/* Module content styles from app.synesto.com components/hosting/hostingStyles.ts (HOST_CSS). */

:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; justify-content: flex-end; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-presets { display: inline-flex; border: 1px solid #e0e0e0; border-radius: 8px; overflow: hidden; background: #fff; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-presets button { border: 0; background: transparent; padding: 5px 12px; font-size: 13px; color: #555; cursor: pointer; line-height: 1.4; font-family: inherit; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-presets button + button { border-left: 1px solid #e0e0e0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-presets button:hover { background: #f5f7fa; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-presets button.is-active { background: #248ad3; color: #fff; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-select { width: auto; min-width: 170px; font-size: 13px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-range { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; color: #666; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-range .form-control { width: 140px; font-size: 13px; }

:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 12px; margin-top: 12px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile { display: flex; align-items: center; gap: 12px; background: #fff; border: 1px solid #e9e9e9; border-radius: 10px; padding: 12px 14px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__icon { width: 38px; height: 38px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 17px; flex-shrink: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__label { font-size: 12px; color: #6b7785; line-height: 1.2; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__value { font-size: 22px; font-weight: 600; line-height: 1.2; font-variant-numeric: tabular-nums; color: #1f2933; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__hint { font-size: 11.5px; color: #9aa3ad; display: flex; align-items: center; gap: 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__hint.is-up { color: #2e7d32; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tile__hint.is-down { color: #c62828; }

:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card { background: #fff; border: 1px solid #e9e9e9; border-radius: 10px; padding: 14px 16px; margin-top: 16px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card__title { display: flex; align-items: baseline; gap: 8px; font-size: 14px; font-weight: 600; color: #1f2933; margin: 0 0 12px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card__title span { font-size: 12px; font-weight: 400; color: #9aa3ad; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(340px, 1fr)); gap: 16px; margin-top: 16px; margin-bottom: 40px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-grid .synesto-host-card { margin-top: 0; }

:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-empty { text-align: center; padding: 26px 16px; color: #9aa3ad; font-size: 13px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-empty i { display: block; font-size: 24px; color: #c3cad2; margin-bottom: 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice { display: flex; align-items: flex-start; gap: 10px; margin-top: 12px; padding: 10px 14px; border-radius: 10px; font-size: 13px; line-height: 1.5; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice i { font-size: 16px; line-height: 1.3; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice--info { background: #e3f2fd; border: 1px solid #bbdefb; color: #0d47a1; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice--warning { background: #fff8e1; border: 1px solid #ffe082; color: #7a5a00; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice--error { background: #ffebee; border: 1px solid #ffcdd2; color: #b71c1c; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-notice a { color: inherit; font-weight: 600; }

/* Wykres dzienny: slupki kosztu z linia przychodu - bez zewnetrznej biblioteki. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart { display: flex; align-items: flex-end; gap: 2px; height: 160px; padding-top: 8px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart__col { flex: 1 1 0; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; position: relative; min-width: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart__bar { width: 100%; max-width: 26px; background: #248ad3; border-radius: 3px 3px 0 0; min-height: 2px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart__bar.is-revenue { background: #2e7d32; opacity: .55; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart__stack { display: flex; align-items: flex-end; gap: 2px; width: 100%; justify-content: center; height: 100%; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chart__axis { display: flex; justify-content: space-between; font-size: 11px; color: #9aa3ad; margin-top: 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-legend { display: flex; gap: 14px; font-size: 12px; color: #6b7785; margin-top: 8px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-legend span { display: inline-flex; align-items: center; gap: 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-legend i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; }

/* Pasek wykorzystania budzetu w planach. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget { display: flex; align-items: center; gap: 10px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget__bar { flex: 1; background: #f2f5f8; border-radius: 6px; height: 10px; overflow: hidden; min-width: 80px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget__bar div { height: 100%; border-radius: 6px; background: #248ad3; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget__bar div.is-warning { background: #f9a825; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget__bar div.is-over { background: #c62828; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-budget__value { font-size: 12px; color: #6b7785; font-variant-numeric: tabular-nums; white-space: nowrap; }

:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-muted { color: #9aa3ad; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-chip { display: inline-flex; align-items: center; gap: 5px; padding: 2px 8px; border-radius: 999px; background: #f2f5f8; color: #5a6672; font-size: 11.5px; white-space: nowrap; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-variant-list { display: flex; flex-direction: column; gap: 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-variant { display: flex; align-items: flex-start; gap: 8px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-variant .form-control { flex: 1; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-counter { font-size: 11.5px; color: #9aa3ad; min-width: 52px; text-align: right; padding-top: 7px; font-variant-numeric: tabular-nums; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-counter.is-over { color: #c62828; font-weight: 600; }

/* Przyciski akcji na listach i kartach (poza oknami). Regula panelu dziala tylko
   w modalach, a zmienne --pm-* sa zdefiniowane tylko tam - stad jawne kolory. */
#synesto-marketing .synesto-section-add { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px; border: 1px solid transparent; border-radius: 7px; background: #eef7ff; color: #248ad3; font-size: 13px; font-weight: 500; line-height: 1; white-space: nowrap; cursor: pointer; font-family: inherit; transition: background-color .15s, color .15s; }
#synesto-marketing .synesto-section-add i { font-size: 14px; }
#synesto-marketing .synesto-section-add:hover:not(:disabled) { background: #248ad3; color: #fff; }
#synesto-marketing .synesto-section-add:focus-visible { outline: 2px solid #248ad3; outline-offset: 2px; }
#synesto-marketing .synesto-section-add:disabled { opacity: .55; cursor: not-allowed; }
#synesto-marketing .synesto-section-add.synesto-section-add--danger { background: #fdecea; color: #c62828; }
#synesto-marketing .synesto-section-add.synesto-section-add--danger:hover:not(:disabled) { background: #c62828; color: #fff; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-section-add.is-icon { width: 32px; padding: 0; justify-content: center; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-row-actions { display: inline-flex; gap: 6px; justify-content: flex-end; flex-wrap: nowrap; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-row-actions .synesto-section-add { height: 30px; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-meter.is-inline { min-width: 140px; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-kv { display: grid; grid-template-columns: max-content 1fr; gap: 6px 16px; font-size: 13px; margin: 0; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-kv dt { color: #6b7785; font-weight: 400; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-kv dd { margin: 0; color: #1f2933; word-break: break-word; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-meters { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px 24px; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-meter__title { font-size: 13px; color: #1f2933; font-weight: 500; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-status { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-status i { width: 9px; height: 9px; border-radius: 50%; display: inline-block; background: #9aa3ad; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-status.is-ok i { background: #2e7d32; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-status.is-warning i { background: #e65100; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-status.is-error i { background: #c62828; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-chart__bar.is-offline { background: #c62828; opacity: .35; height: 100% !important; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-chart__bar.is-mem { background: #7c3aed; opacity: .6; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-chart__bar.is-empty { background: transparent; }

/* Pasek filtrow pod paskiem narzedzi - to samo tlo co pasek, male kontrolki.
   Filtry nie mieszcza sie w jednym rzedzie z ikonami, a wciskanie ich w pasek
   zawijalo go na dwie linie. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; padding: 0 6px 10px; background: #fbfbfb; border-bottom: 1px solid #f0f0f0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .form-select,
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .form-control { height: 32px; padding-top: 4px; padding-bottom: 4px; font-size: 13px; width: auto; min-width: 150px; max-width: 240px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .form-control[type=date] { min-width: 0; width: 140px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .synesto-host-search { min-width: 200px; flex: 0 1 240px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .synesto-host-presets button { height: 30px; padding: 0 12px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar .synesto-host-range { gap: 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-filterbar__spacer { flex: 1 1 auto; }

/* Kafelki: szesc wskaznikow miesci sie w jednym rzedzie na zwyklym ekranie. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tiles { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }

/* Tabele w kartach pulpitu od krawedzi do krawedzi, jak w statystykach aktywnosci. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-grid .synesto-host-card { padding: 14px 0 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-grid .synesto-host-card__title { padding: 0 16px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-grid .synesto-host-empty { padding-left: 16px; padding-right: 16px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .synesto-table { margin-top: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card--flush { padding: 14px 0 6px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card--flush .synesto-host-card__title { padding: 0 16px; }

/* Liczby w tabelach wysrodkowane jak naglowki (konwencja tabel panelu). */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-table .synesto-host-num { text-align: center; }

/* Szeroka tabela wynikow przewija sie w poziomie zamiast ucinac ostatnie kolumny. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-scroll-x { overflow-x: auto !important; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-scroll-x .synesto-table__th { white-space: nowrap; padding-left: 10px; padding-right: 10px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-scroll-x .synesto-td { padding-left: 10px; padding-right: 10px; }

/* Formularz ustawien na karcie w rozmiarze pol panelu (13 px), nie domyslnym bootstrapa. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .form-label { font-size: 13px; color: #4b5563; margin-bottom: 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .form-control,
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .form-select { font-size: 13px; height: 34px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .form-text { font-size: 12px; color: #8a94a3; line-height: 1.4; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-card .form-check-label { font-size: 13px; }

/* Koncowka klucza: neutralnie, bez rozowego koloru znacznika code. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) code.synesto-host-hint,
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-table code { color: #5a6672; background: #f2f5f8; padding: 1px 6px; border-radius: 4px; font-size: 12px; }
/* Wybrany produkt w kreacji: miniatura, nazwa, cena i odpiecie - jak wiersz relacji produktu. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product { display: flex; align-items: center; gap: 12px; padding: 8px 10px; border: 1px solid #e5e7eb; border-radius: 8px; background: #fafbfc; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product__text { flex: 1 1 auto; min-width: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product__name { font-size: 14px; font-weight: 600; color: #1f2933; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product__meta { font-size: 12.5px; color: #6b7280; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product__meta a { color: #248ad3; text-decoration: none; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-product__meta a:hover { text-decoration: underline; }

/* Wynik SEO 0-100: pierscien z liczba (kolor ustawiany inline wg progu). */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-score { position: relative; width: 108px; height: 108px; flex-shrink: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-score svg { width: 108px; height: 108px; transform: rotate(-90deg); }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-score__value { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 28px; font-weight: 600; color: #1f2933; font-variant-numeric: tabular-nums; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-score__value span { font-size: 11px; font-weight: 400; color: #9aa3ad; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-hero { display: flex; align-items: center; gap: 24px; flex-wrap: wrap; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-hero__text { flex: 1 1 280px; min-width: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-hero__title { font-size: 16px; font-weight: 600; color: #1f2933; margin: 0 0 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-hero__desc { font-size: 13px; color: #6b7785; margin: 0; line-height: 1.5; }

/* Lista problemow z paskiem udzialu. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issues { display: flex; flex-direction: column; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue { display: grid; grid-template-columns: minmax(180px, 1fr) 160px 90px 220px; align-items: center; gap: 14px; padding: 10px 16px; border-top: 1px solid #f2f2f2; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue:first-child { border-top: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__label { font-size: 13.5px; color: #1f2933; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__hint { font-size: 12px; color: #9aa3ad; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__bar { background: #f2f5f8; border-radius: 6px; height: 8px; overflow: hidden; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__bar div { height: 100%; border-radius: 6px; background: #e65100; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__bar div.is-ok { background: #2e7d32; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__count { font-size: 13px; font-weight: 600; text-align: right; font-variant-numeric: tabular-nums; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__actions { display: flex; gap: 6px; justify-content: flex-end; }
@media (max-width: 767px) { :is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue { grid-template-columns: 1fr auto; } :is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-issue__bar { display: none; } }

/* Porownanie przed / po w propozycjach AI. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff__col { border: 1px solid #edf0f3; border-radius: 8px; padding: 8px 10px; background: #fff; min-width: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff__col.is-before { background: #fafbfc; color: #6b7785; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff__col.is-after { border-color: #cfe5f7; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff__label { font-size: 11px; text-transform: uppercase; letter-spacing: .04em; color: #9aa3ad; margin-bottom: 3px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff__text { font-size: 13px; line-height: 1.45; word-break: break-word; }
@media (max-width: 767px) { :is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-diff { grid-template-columns: 1fr; } }

/* Podglad wyniku w Google (ustawienia szablonow, propozycje). */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-serp { border: 1px solid #edf0f3; border-radius: 8px; padding: 12px 14px; background: #fff; max-width: 640px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-serp__url { font-size: 12px; color: #1e8e3e; margin-bottom: 2px; word-break: break-all; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-serp__title { font-size: 17px; color: #1a0dab; line-height: 1.3; margin-bottom: 3px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-serp__desc { font-size: 13px; color: #4d5156; line-height: 1.45; }

/* Wynik kontroli technicznej: ikona stanu przy kazdej pozycji. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check { display: grid; grid-template-columns: 22px 180px 1fr; gap: 10px; align-items: start; padding: 8px 16px; border-top: 1px solid #f2f2f2; font-size: 13px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check:first-child { border-top: 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check i.is-ok { color: #2e7d32; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check i.is-warning { color: #e65100; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check i.is-error { color: #c62828; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check__detail { color: #6b7785; word-break: break-word; }
@media (max-width: 767px) { :is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check { grid-template-columns: 22px 1fr; } :is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-check__detail { grid-column: 2; } }

/* Sciezki i adresy w tabelach: czcionka o stalej szerokosci, zawijanie dlugich adresow. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-path { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 12.5px; color: #1f2933; word-break: break-all; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-arrow { color: #9aa3ad; margin: 0 6px; }

/* Karty jedna pod druga na pelna szerokosc (przeglad SEO). */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-stack { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; margin-bottom: 40px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-stack .synesto-host-card { margin-top: 0; }

/* Naglowek kolumny tekstowej wyrownany do lewej, jak tresc pod nim. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-table__th.is-text { text-align: left; padding-left: 12px; }
:is(#synesto-marketing, .synesto-eshop-modal) .synesto-host-grid .synesto-host-meters { padding: 0 16px 8px; }

/* Linki w widokach SEO w kolorze panelu, bez podkreslenia przegladarki. */
#synesto-marketing [id^=synesto-marketing-host] a:not(.btn):not(.synesto-section-add),
.synesto-eshop-modal .synesto-host-link { color: #248ad3; text-decoration: none; }
#synesto-marketing [id^=synesto-marketing-host] a:not(.btn):not(.synesto-section-add):hover,
.synesto-eshop-modal .synesto-host-link:hover { text-decoration: underline; }

/* Kafelki rozciagaja sie na cala szerokosc zamiast zostawiac pusta kolumne. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-tiles { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* Zuzycie zasobu: pasek z progiem ostrzezenia. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter { display: flex; flex-direction: column; gap: 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter__bar { background: #f2f5f8; border-radius: 6px; height: 8px; overflow: hidden; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter__bar div { height: 100%; border-radius: 6px; background: #2e7d32; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter__bar div.is-warning { background: #e65100; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter__bar div.is-critical { background: #c62828; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-meter__label { display: flex; justify-content: space-between; font-size: 12px; color: #6b7785; font-variant-numeric: tabular-nums; }

/* Haslo pokazywane jeden raz: czcionka o stalej szerokosci i przycisk kopiowania. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-secret { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border: 1px dashed #cfd8e3; border-radius: 8px; background: #fafbfc; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-secret code { flex: 1 1 auto; font-size: 15px; color: #1f2933; background: none; padding: 0; word-break: break-all; }

/* Potwierdzenie przez wpisanie nazwy. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-confirm-name { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; background: #f2f5f8; border-radius: 4px; padding: 1px 6px; font-size: 13px; word-break: break-all; user-select: all; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }

/* Watek zgloszenia. */
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-thread { display: flex; flex-direction: column; gap: 10px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg { border: 1px solid #edf0f3; border-radius: 10px; padding: 10px 12px; background: #fff; max-width: 85%; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg.is-client { background: #eef7ff; border-color: #cfe5f7; align-self: flex-end; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg.is-support { align-self: flex-start; border-left: 3px solid #475569; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg.is-system { background: transparent; border: 0; color: #9aa3ad; font-size: 12px; align-self: center; max-width: 100%; padding: 2px 0; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg__meta { font-size: 11.5px; color: #9aa3ad; margin-bottom: 4px; }
:is(#synesto-marketing, .synesto-eshop-modal, .synesto-confirm-modal) .synesto-host-msg__body { font-size: 13.5px; color: #1f2933; white-space: pre-wrap; word-break: break-word; }
