/* ===========================================================================
   Centrála — design tokens (Mission Control Dark)
   Elevace = světlost povrchu (ne stíny). Barva jen pro stav a akci.
   =========================================================================== */
:root {
  /* ── Povrchový žebřík (šalvěj tmavá) ── */
  --bg:            #0E120F;
  --surface-1:     #141A16;
  --surface-2:     #1A221C;
  --surface-3:     #212A23;
  --surface-hover: #27322A;

  /* ── Bordery ── */
  --border:        #2A352D;
  --border-strong: #384636;
  --border-soft:   rgba(255,255,255,0.06);

  /* ── Text ── */
  --text:          #E8F0E9;
  --text-2:        #A3B3A7;
  --text-muted:    #7E9285;
  --text-faint:    #4A584E;

  /* ── Akcent (šalvěj, prosvětlená pro tmavé pozadí) ── */
  --accent:        #7FB08C;
  --accent-hover:  #96C4A2;
  --accent-dim:    rgba(127,176,140,0.15);
  --accent-glow:   rgba(127,176,140,0.32);

  /* ── Urgentní akce (terakota) ──
     Pro tlačítka, která mají vytáhnout ruku — třeba „Zadat úkol".
     Odstín ~25°, schválně tlumený: se šalvějí ladí přes nízkou sytost,
     čistá oranžová by z palety vypadla. Kontrast proti povrchu 6,65:1.
     Pozor: světlostí je blízko `--warning`, takže se odlišuje odstínem —
     používat na popsaná tlačítka, ne na malé stavové tečky. */
  --urgent:       #E08A4C;
  --urgent-hover: #EDA067;
  --urgent-dim:   rgba(224,138,76,0.15);
  --urgent-glow:  rgba(224,138,76,0.32);
  --urgent-ink:   #141A16;   /* text na výplni */

  /* ── Sidebar (charakteristický gradient z mockupu A4 Šalvěj) ── */
  --sidebar-bg:      #1B2620;
  --sidebar-bg-deep: #141D18;

  /* ── Sémantika (zemitá, ať neřve proti šalvěji) ── */
  --success: #6FBF7F; --success-dim: rgba(111,191,127,0.15);
  --warning: #D9A441; --warning-dim: rgba(217,164,65,0.15);
  --danger:  #E0685E; --danger-dim:  rgba(224,104,94,0.15);
  --info:    #7FB08C; --info-dim:    rgba(127,176,140,0.15);

  /* ── Priority úkolů ── */
  --prio-1: #E0685E; --prio-2: #D9A441; --prio-3: #7FB08C; --prio-4: #6F8175;

  /* ── Heatmapa ── */
  --heat-0:#18211A; --heat-1:#24402C; --heat-2:#356048; --heat-3:#4E8763; --heat-4:#7FB08C;

  /* ── Typografie ── */
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "SF Mono", ui-monospace, "Cascadia Code", monospace;

  --fs-display: 32px; --fs-h1: 24px; --fs-h2: 20px; --fs-h3: 16px;
  --fs-body: 14px; --fs-sm: 13px; --fs-label: 12px; --fs-micro: 11px;

  /* ── Spacing (4px base) ── */
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px;
  --sp-6:24px; --sp-8:32px; --sp-10:40px; --sp-12:48px;

  /* ── Radius ── */
  --r-xs:4px; --r-sm:6px; --r-md:8px; --r-lg:12px; --r-full:9999px;

  /* ── Stíny / glow ── */
  --shadow-overlay: 0 8px 24px rgba(0,0,0,0.5), 0 2px 8px rgba(0,0,0,0.4);
  --shadow-fab:     0 4px 16px var(--accent-glow);
  --glow-accent:    0 0 0 1px var(--accent-dim), 0 0 12px -2px var(--accent-glow);
  --glow-danger:    0 0 0 1px var(--danger-dim), 0 0 10px -2px var(--danger-dim);
  --glow-success:   0 0 8px -2px rgba(63,185,80,0.35);

  /* ── Layout ── */
  --sidebar-w: 240px;
  --topbar-h: 56px;
  --bottomnav-h: 60px;
  --maxw: 1440px;

  /* ── Vstupní pole jako zapuštěná plocha (2. 8. 2026) ──
     Do té doby mělo pole `--surface-2` na kartě `--surface-1`, tedy o stupeň
     SVĚTLEJŠÍ podklad — #1A221C na #141A16. Rozdíl na hranici viditelnosti
     a pole splývalo s kartou. Teď je pole tmavší než cokoli kolem: čte se
     jako díra, do které se píše, zatímco tlačítko je výstupek.
     Ztmavení samo o sobě NESTAČÍ: pole vůči kartě má kontrast jen 1,09:1,
     takže rozlišení musí nést rámeček — proto je výrazně světlejší než
     `--border` (3,88:1 vůči vnitřku pole, 3,55:1 vůči kartě, WCAG 1.4.11). */
  --field-bg:     #0B0F0C;
  --field-border: #5F7565;
  /* Rámeček ovládacích prvků (tlačítka) — tlačítko se od karty liší podkladem
     jen 1,19:1, takže i tady drží rozlišení rámeček. */
  --ctl-border:   #5F7565;

  /* ── Data (2. 8. 2026) ──
     Pátá sémantická role. Do té doby byla skoro celá aplikace šalvějová,
     takže čísla, akce i stavy vypadaly stejně. Modrá je jediný odstín, který
     se šalvějí nekoliduje a přitom není varovný. Používat na počty, časy
     a metriky — NIKDY na akci. Kontrast na `--surface-1`: 6,4:1. */
  --data:     #6FA8C7;
  --data-dim: rgba(111,168,199,0.15);

  /* ── Hustota ──
     Výchozí („vzdušný") režim drží původní rozměry, aby se dal kdykoli vrátit.
     Kompaktní režim je níž a přepíná se atributem `data-density` na <html>. */
  --card-pad:    var(--sp-4);
  --card-gap:    var(--sp-4);
  --card-head-mb: var(--sp-3);
  --row-h:       44px;
  --row-pad-y:   10px;
  --ctl-h:       36px;
  --field-pad-y: 10px;
  --zebra:       transparent;
}

/* ── Kompaktní režim (Mariovo zadání 2. 8. 2026) ──────────────────────────
   „Potřebuju vidět co nejvíce informací." Mění se jen rozestupy a výšky —
   žádná barva, žádný font, žádná šablona. Na obrazovku se vejde zhruba
   o polovinu víc řádků. Vypíná se přepínačem v horní liště. */
:root[data-density="kompakt"] {
  --card-pad:     var(--sp-3);
  --card-gap:     var(--sp-2);
  --card-head-mb: var(--sp-2);
  --row-h:        28px;
  --row-pad-y:    3px;
  --ctl-h:        30px;
  --field-pad-y:  6px;
  /* Zebra drží oko na řádku, když jsou řádky nízko u sebe. */
  --zebra:        rgba(255,255,255,0.022);
}
:root[data-density="kompakt"][data-theme="light"] {
  --zebra: rgba(38,50,41,0.028);
}

/* ── Světlý motiv ── */
:root[data-theme="light"] {
  --bg:            #EEF2EC;
  --surface-1:     #FFFFFF;
  --surface-2:     #F6FAF5;
  --surface-3:     #E9F0E7;
  --surface-hover: #E3ECE1;

  --border:        #DDE7DC;
  --border-strong: #C6DAC8;
  --border-soft:   rgba(38,50,41,0.07);

  --text:          #263229;
  --text-2:        #5C6D60;
  --text-muted:    #5F7565;
  --text-faint:    #93A797;

  --accent:        #4E7A5A;
  --accent-hover:  #3C6148;
  --accent-dim:    rgba(78,122,90,0.12);
  --accent-glow:   rgba(78,122,90,0.25);

  /* Urgentní akce — tmavší terakota, ať projde na bílé i na pozadí:
     5,31:1 s bílým textem ve výplni, 4,69:1 jako text na `--bg`. */
  --urgent:       #A85423;
  --urgent-hover: #8E441A;
  --urgent-dim:   rgba(168,84,35,0.12);
  --urgent-glow:  rgba(168,84,35,0.25);
  --urgent-ink:   #FFFFFF;

  /* Sidebar: gradient přesně z mockupu A4 Šalvěj */
  --sidebar-bg:      #4C6156;
  --sidebar-bg-deep: #3D4F45;

  --success: #3F7A4E; --success-dim: rgba(63,122,78,0.12);
  --warning: #8A6410; --warning-dim: rgba(138,100,16,0.12);
  --danger:  #A8443B; --danger-dim:  rgba(168,68,59,0.10);
  --info:    #4E7A5A; --info-dim:    rgba(78,122,90,0.10);

  /* Priority a heatmapa v šalvějových tónech. (Do 27. 7. 2026 je tady
     přebíjel zapomenutý blok z modré palety před designovým restartem —
     priorita 3 svítila modře a FAB měl modrý glow.) */
  --prio-1: #A8443B; --prio-2: #8A6410; --prio-3: #4E7A5A; --prio-4: #8BA18F;
  --heat-0:#E9F0E7; --heat-1:#CDE2CF; --heat-2:#A8CDAF; --heat-3:#7BAE89; --heat-4:#4E7A5A;

  --shadow-overlay: 0 8px 24px rgba(38,50,41,0.12), 0 2px 8px rgba(38,50,41,0.08);
  --shadow-fab:     0 4px 16px var(--accent-glow);
  --glow-accent:    0 0 0 1px var(--accent-dim), 0 0 0 3px rgba(78,122,90,0.12);
  --glow-danger:    0 0 0 1px var(--danger-dim);
  --glow-success:   0 0 0 1px var(--success-dim);

  /* Ve světlém motivu nejde pole „zapustit" ztmavením — bílá karta je už
     nejsvětlejší plocha. Zapuštění tedy dělá výrazný rámeček a vnitřní stín,
     ne barva podkladu. */
  --field-bg:     #FFFFFF;
  --field-border: #7E9285;
  --ctl-border:   #7E9285;

  /* Modrá pro data, ztmavená na bílou: kontrast 5,1:1. */
  --data:     #2C6B8F;
  --data-dim: rgba(44,107,143,0.12);
}
/* světlé karty potřebují jemný stín místo surface-ladder */
:root[data-theme="light"] .card,
:root[data-theme="light"] .kpi,
:root[data-theme="light"] .hero {
  box-shadow: 0 1px 2px rgba(20,30,50,0.05), 0 2px 6px rgba(20,30,50,0.05);
}
