/* LegalYes Court Praxis — єдиний design-system (один файл на всі сторінки).
   Підключати ОСТАННІМ у <head> кожної сторінки: тоді ці :root-токени перебивають
   локальні (наліплені) і дають однакову палітру, не чіпаючи верстку сторінок.
   Серветься з api.py: GET /ds.css */

:root{
  /* поверхні */
  --bg:#0f1419; --bg2:#0b0f14; --card:#181f29; --card2:#1d242d;
  --soft:#222c38; --pill:#222c38; --surface-1:#181f29; --surface-0:#0f1419;
  /* межі */
  --bd:#2a3340; --border:#2a3340;
  /* текст */
  --fg:#e7edf3; --text-primary:#e7edf3;
  --mut:#93a3b4; --text-secondary:#93a3b4;
  --mut2:#67788a; --text-muted:#67788a;
  /* акценти */
  --acc:#3b82f6; --acc-d:#2f6ad9; --bg-accent:rgba(59,130,246,.16); --text-accent:#7cb0ff;
  --cur:#8b5cf6; --violet:#8b5cf6; --cyan:#06b6d4;
  /* семантика */
  --green:#1f9d57; --ok:#1f9d57; --text-success:#1f9d57;
  --amber:#c9851f; --warn:#c9851f; --text-warning:#c9851f;
  --bad:#f85149;
  --radius:8px;
}

/* ── спільний верхній нав-бар ─────────────────────────────── */
.ds-nav{display:flex;gap:4px;align-items:center;flex-wrap:wrap;
  padding:9px 18px;border-bottom:1px solid var(--border);background:var(--bg2);
  font-size:13px;position:sticky;top:0;z-index:80;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif}
.ds-nav .brand{font-weight:700;color:var(--text-primary);margin-right:14px;letter-spacing:.2px}
.ds-nav a{color:var(--text-secondary);text-decoration:none;padding:6px 12px;border-radius:8px;
  transition:background .15s,color .15s;white-space:nowrap}
.ds-nav a:hover{background:var(--soft);color:var(--text-primary)}
.ds-nav a.active{color:var(--text-primary);background:var(--soft);font-weight:600}
.ds-nav .sp{flex:1}

/* ── перевикористовувані елементи (за бажанням) ───────────── */
.ds-btn{font-size:13px;font-weight:600;padding:7px 14px;border-radius:8px;cursor:pointer;
  border:1px solid var(--acc);background:var(--acc);color:#fff}
.ds-btn.ghost{background:transparent;color:var(--acc)}
.ds-card{background:var(--card);border:1px solid var(--border);border-radius:12px;padding:14px 16px}
.ds-badge{font-size:11px;border-radius:10px;padding:1px 7px;white-space:nowrap;
  border:1px solid var(--border);color:var(--text-muted)}
.ds-badge.ok{color:var(--green);border-color:var(--green)}

/* ── ЄДИНИЙ КОНТЕЙНЕР: однакові відступи/ширина/шрифт на всіх сторінках ──
   (лінкується останнім у <head>, тож перебиває локальні .wrap/main/body) */
:root{ --page-max:1100px; --page-pad-x:24px; }
/* єдиний відступ дає ТІЛЬКИ контейнер .wrap/main; body-паддінг обнуляємо,
   щоб сторінки з власним body-padding (прототип) не отримували подвійний */
body{ font-size:15px; margin:0; padding:0;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.55; }
/* єдиний розмір заголовків сторінок (локальні h1 різнились 17–26px);
   сторінка може свідомо перебити класом (напр. signup h1.hero) */
h1{ font-size:21px; font-weight:600; }
.wrap, main{ max-width:var(--page-max); margin:0 auto; padding:22px var(--page-pad-x) 64px; box-sizing:border-box; }
/* нав-бар: контент вирівняний з центрованим контейнером (повноширинний фон,
   ліва межа лінків збігається з .wrap на широких екранах) */
.ds-nav{ padding-top:10px; padding-bottom:10px;
  padding-left:max(var(--page-pad-x), calc((100% - var(--page-max))/2 + var(--page-pad-x)));
  padding-right:max(var(--page-pad-x), calc((100% - var(--page-max))/2 + var(--page-pad-x))); }
/* evidence_ui власний sub-header — вирівняти з тим самим відступом */
header{ padding-left:var(--page-pad-x); padding-right:var(--page-pad-x); }

/* ══ СВІТЛА/ТЕМНА ТЕМА ═══════════════════════════════════════════════════
   Темна — дефолт (:root вище). Світла — авто за ОС (prefers-color-scheme)
   АБО ручний вибір [data-theme] (перемикач у /ds.js, збереження в localStorage).
   Контраст світлих токенів звірено за WCAG 2.1 AA (текст ≥4.5:1, UI ≥3:1). */
:root{ color-scheme: dark; }

/* спільний список світлих токенів (дублюється у двох селекторах — стандартний
   патерн: авто-світла для light-OS БЕЗ явного вибору + явний data-theme=light) */
@media (prefers-color-scheme: light){
  :root:not([data-theme="dark"]){
    color-scheme: light;
    --bg:#f6f8fb; --bg2:#eef2f7; --card:#ffffff; --card2:#f2f5f9;
    --soft:#e7edf4; --pill:#e7edf4; --surface-1:#ffffff; --surface-0:#f6f8fb;
    --bd:#d3dce7; --border:#d3dce7;
    --fg:#17202e; --text-primary:#17202e;               /* 14.6:1 на --bg */
    --mut:#54617a; --text-secondary:#54617a;            /* 6.1:1  на --bg */
    --mut2:#697488; --text-muted:#697488;               /* 4.6:1  на --card */
    --acc:#2563eb; --acc-d:#1d4ed8;                     /* 5.4:1 текст / 5.8:1 з білим */
    --bg-accent:rgba(37,99,235,.12); --text-accent:#1d4ed8;
    --cur:#7c3aed; --violet:#7c3aed; --cyan:#0e7490;
    --green:#157a43; --ok:#157a43; --text-success:#157a43;   /* 4.9:1 */
    --amber:#8a5a00; --warn:#8a5a00; --text-warning:#8a5a00; /* 5.1:1 (темніший за dark) */
    --bad:#cf2230;                                            /* 5.0:1 */
  }
}
:root[data-theme="light"]{
  color-scheme: light;
  --bg:#f6f8fb; --bg2:#eef2f7; --card:#ffffff; --card2:#f2f5f9;
  --soft:#e7edf4; --pill:#e7edf4; --surface-1:#ffffff; --surface-0:#f6f8fb;
  --bd:#d3dce7; --border:#d3dce7;
  --fg:#17202e; --text-primary:#17202e;
  --mut:#54617a; --text-secondary:#54617a;
  --mut2:#697488; --text-muted:#697488;
  --acc:#2563eb; --acc-d:#1d4ed8;
  --bg-accent:rgba(37,99,235,.12); --text-accent:#1d4ed8;
  --cur:#7c3aed; --violet:#7c3aed; --cyan:#0e7490;
  --green:#157a43; --ok:#157a43; --text-success:#157a43;
  --amber:#8a5a00; --warn:#8a5a00; --text-warning:#8a5a00;
  --bad:#cf2230;
}
:root[data-theme="dark"]{ color-scheme: dark; }   /* явна темна перебиває light-OS */

/* кнопка-перемикач теми (інжектиться у .ds-nav скриптом /ds.js) */
.ds-theme{ cursor:pointer; border:1px solid var(--border); background:var(--card);
  color:var(--text-secondary); border-radius:8px; padding:5px 9px; font-size:14px;
  line-height:1; margin-left:8px; }
.ds-theme:hover{ color:var(--text-primary); background:var(--soft); }