/* =====================================================================
   Sprawdź działkę – WSPÓLNE KOMPONENTY (serwis WWW + przeglądarka raportu)
   Wymaga tokens.css. Klasy mają prefiks sd- i nie kolidują z klasami
   viewera (.btn, .card, .badge zostają w viewerze bez zmian – tu są ich
   odpowiedniki o tych samych wartościach, do użycia w serwisie i nagłówku).
   ===================================================================== */

/* --- Pasek górny (wspólny nagłówek) --- */
.sd-topbar{background:var(--surface-solid);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:30;font-family:var(--font)}
.sd-topbar__in{max-width:var(--content-max);margin:0 auto;padding:0 max(16px,env(safe-area-inset-left,0px)) 0 max(16px,env(safe-area-inset-right,0px));display:flex;align-items:center;gap:18px;min-height:var(--topbar-h)}
.sd-brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:var(--ink);flex:0 0 auto}
.sd-brand__logo{width:42px;height:42px;border-radius:12px;background:var(--grad-brand);display:grid;place-items:center;flex:0 0 auto}
.sd-brand__logo svg{width:24px;height:24px}
.sd-brand__name{font-weight:var(--fw-bold);font-size:15px;line-height:1.1}
.sd-brand__sub{color:var(--muted);font-size:11.5px;margin-top:2px}
.sd-nav{display:flex;gap:2px;list-style:none;margin:0 0 0 8px;padding:0}
.sd-nav a{text-decoration:none;color:var(--ink);font-weight:var(--fw-semibold);font-size:14px;padding:8px 11px;border-radius:var(--radius-sm);white-space:nowrap}
.sd-nav a:hover,.sd-nav a[aria-current]{background:var(--accent-soft);color:var(--accent-ink)}
.sd-topbar__account{margin-left:auto;display:flex;gap:8px;align-items:center}
.sd-topbar__burger{display:none;margin-left:auto;border:1px solid var(--line);background:var(--surface-solid);border-radius:var(--radius-sm);padding:8px 10px;cursor:pointer;color:var(--ink);font:inherit}
@media(max-width:960px){
  .sd-nav,.sd-topbar__account{display:none}
  .sd-topbar__burger{display:block}
  .sd-topbar.is-open .sd-nav{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:var(--topbar-h);background:var(--surface-solid);border-bottom:1px solid var(--line);padding:10px 16px 16px;gap:2px}
  .sd-topbar.is-open .sd-topbar__account{display:flex;position:absolute;left:16px;top:calc(var(--topbar-h) + 260px)}
}

/* --- Przyciski (wartości z .btn / .btn-primary viewera) --- */
.sd-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:var(--radius-sm);padding:7px 12px;font:inherit;font-size:12.5px;font-weight:var(--fw-semibold);text-decoration:none;cursor:pointer;line-height:1.3;white-space:nowrap}
.sd-btn:hover{border-color:var(--accent);color:var(--accent-ink)}
.sd-btn:focus-visible{outline:none;box-shadow:var(--focus)}
.sd-btn--primary{background:var(--accent);border-color:var(--accent);color:#fff}
.sd-btn--primary:hover{background:var(--accent-ink);border-color:var(--accent-ink);color:#fff}
.sd-btn--ghost{background:transparent;border-color:rgba(255,255,255,.55);color:#fff}   /* na ciemnej zieleni */
.sd-btn--ghost:hover{background:rgba(255,255,255,.12);color:#fff;border-color:#fff}
.sd-btn--lg{padding:12px 20px;font-size:15px;border-radius:var(--radius-sm)}

/* --- Karta statystyki (z .card viewera: tło --bg, etykieta uppercase, wartość bold) --- */
.sd-stat{background:var(--bg);border:1px solid var(--line);border-radius:var(--radius-sm);padding:8px 10px;min-width:0}
.sd-stat__label{color:var(--muted);font-size:var(--fs-label);text-transform:uppercase;letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sd-stat__value{font-size:15.5px;font-weight:var(--fw-bold);margin-top:2px;word-break:break-word}
.sd-stat--big .sd-stat__value{font-size:30px;line-height:1.05;color:var(--accent)}
.sd-stat--big{padding:16px 20px;border-radius:var(--radius)}

/* --- Panel / karta treści (z .item-card i .sidebar viewera) --- */
.sd-panel{background:var(--surface-solid);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-sm)}
.sd-panel--hover:hover{border-color:var(--accent)}
.sd-note{border:1px solid var(--line);background:var(--bg);border-radius:12px;padding:10px 12px;color:var(--ink);font-size:14px;line-height:1.5}

/* --- Odznaki ocen (z .badge-tone-* viewera) --- */
.sd-badge{display:inline-block;border:1px solid var(--neutral-line);background:var(--neutral-bg);color:var(--neutral-fg);font-size:10.5px;font-weight:var(--fw-bold);padding:2.5px 8px;border-radius:var(--radius-pill);white-space:nowrap;line-height:1.4}
.sd-badge--ok{background:var(--ok-bg);color:var(--ok-fg);border-color:var(--ok-line)}
.sd-badge--info{background:var(--info-bg);color:var(--info-fg);border-color:var(--info-line)}
.sd-badge--warn{background:var(--warn-bg);color:var(--warn-fg);border-color:var(--warn-line)}
.sd-badge--bad{background:var(--bad-bg);color:var(--bad-fg);border-color:var(--bad-line)}
/* wypełnione (ocena ogólna raportu) */
.sd-badge--solid{color:#fff;border:0;font-size:11px;padding:3px 9px}
.sd-badge--solid.sd-badge--ok{background:var(--ok-solid)}
.sd-badge--solid.sd-badge--warn{background:var(--warn-solid)}
.sd-badge--solid.sd-badge--bad{background:var(--bad-solid)}
.sd-badge--solid.sd-badge--empty{background:var(--empty-solid)}

/* --- Link "O analizie i interpretacji" (z .module-info-link viewera) --- */
.sd-info-link{display:inline-flex;align-items:center;gap:5px;color:var(--accent);font-size:12.5px;font-weight:650;line-height:1.25;text-decoration:none}
.sd-info-link:hover{text-decoration:underline;text-underline-offset:2px}
.sd-info-link__i{width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;border:1px solid currentColor;border-radius:50%;font-size:10px;font-weight:800;font-family:Georgia,serif;line-height:1}

/* --- Etykieta "eyebrow" (z .desc-eyebrow viewera) --- */
.sd-eyebrow{color:var(--muted);font-size:11.5px;letter-spacing:.02em;margin:0 0 3px}
.sd-eyebrow--accent{color:var(--accent);font-weight:var(--fw-semibold);text-transform:uppercase;letter-spacing:.08em;font-size:12px}

/* --- Stopka (wspólna) --- */
.sd-footer{border-top:1px solid var(--line);background:var(--surface-solid);color:var(--muted);font-size:14px;font-family:var(--font)}
.sd-footer__in{max-width:var(--content-max);margin:0 auto;padding:34px max(16px,env(safe-area-inset-right,0px)) 30px max(16px,env(safe-area-inset-left,0px))}
.sd-footer__cols{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:24px}
@media(max-width:860px){.sd-footer__cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.sd-footer__cols{grid-template-columns:1fr}}
.sd-footer h4{margin:0 0 8px;color:var(--ink);font-size:15px;font-weight:var(--fw-bold)}
.sd-footer ul{list-style:none;padding:0;margin:0;display:grid;gap:6px}
.sd-footer a{text-decoration:none;color:inherit}
.sd-footer a:hover{color:var(--accent)}
.sd-footer__legal{margin-top:26px;padding-top:18px;border-top:1px solid var(--line);font-size:13px;max-width:90ch}
.sd-footer--compact .sd-footer__in{padding:14px 16px}
.sd-footer--compact .sd-footer__cols{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px}
.sd-footer--compact h4,.sd-footer--compact .sd-footer__legal{display:none}
.sd-footer--compact ul{display:contents}