/*
 * Dizajnové tokeny — jediný zdroj farieb, odstupov, písma, rádiusov a tieňov.
 * Záväzné hodnoty a pravidlá sú v docs/DIZAJN.md.
 *
 * Komponenty používajú výhradne tokeny podľa ROLY (--surface, --accent…), nikdy priamo
 * hexadecimálnu farbu. Tmavý režim tak mení len túto vrstvu.
 *
 * Režim: theme.js nastaví data-theme podľa uloženej voľby alebo systému. Bez JavaScriptu
 * rozhoduje prefers-color-scheme (blok nižšie).
 */

:root {
    color-scheme: light;

    /* --- plochy a text (sivé neutrály bez modrého nádychu) --- */
    --bg: #F6F6F7;
    --surface: #FFFFFF;
    --surface-2: #F1F1F3;
    --border: #E7E8EC;
    /* Okraj ovládacích prvkov (polia, sekundárne tlačidlá) — aspoň 3 : 1 voči ploche. */
    --border-strong: #858991;
    --text: #121417;
    --text-muted: #5F636B;
    --text-subtle: #686B73;

    /* --- jantár: jediný akcent --- */
    /* Ako výplň vždy s tmavým textom --on-accent, nikdy biely text na jantári. */
    --accent: #F2A20C;
    --accent-hover: #E09400;
    --on-accent: #1A1206;
    --accent-text: #8F5B00;
    --accent-display: #B97800;
    --accent-soft: #FDF1D8;
    --accent-soft-text: #6E4600;
    /* Obrys fokusu: tmavší jantár, aby mal kontrast aj na bielej ploche. */
    --focus-ring: var(--accent-text);

    /* --- dátová paleta grafov (docs/DIZAJN.md → Grafy) — overená validátorom palety voči --surface --- */
    /* Hlavný rad: jantár ≥ 3 : 1 voči karte. Tlmený krok toho istého jantáru (2,3 : 1) = ostatné dni pri zvýraznenom dnešku. */
    --chart-1: #B97800;
    --chart-1-muted: #D9A441;
    /* Porovnávací rad bez farby (roboty) — sivá, nikdy druhý akcent. */
    --chart-2: #858991;
    /* Dráha merača (podiel z celku): svetlý krok jantáru, nesie len „zvyšok do 100 %“. */
    --chart-track: #F6E7C8;
    --chart-grid: var(--border);
    --chart-baseline: var(--border-strong);

    /* --- bodkové mraky: jedna plná bledá farba (kontrast voči ploche ~1,4 : 1, text ostáva dominantný) --- */
    --dots: #E9D199;
    /* --- vodoznak značky v pätičke: o kúsok tmavší než plocha pätičky (--surface), dekorácia bez čitateľného kontrastu --- */
    --watermark: #EFEFF2;
    --watermark-accent: #F9EBD2;

    /* --- výpis činnosti v štýle terminálu (Prehľad → Čo sa deje, Zber, CRON) — tmavý podklad v oboch témach ---
       Kontrast na --terminal-bg: text 12,1 : 1, zdroj 16,6 : 1, čas 5,6 : 1, stavy 7,4 – 9,8 : 1 (aj na hover a zvýraznení ≥ 4,9 : 1). */
    --terminal-bg: #15171C;
    --terminal-border: #15171C;
    --terminal-text: #D2D4D9;
    --terminal-strong: #F5F6F7;
    --terminal-muted: #8C9099;
    --terminal-info: #A3A7B0;
    --terminal-success: #6FD394;
    --terminal-warning: #FFA066;
    --terminal-error: #FF8A80;
    --terminal-hover: #1F2228;
    --terminal-new: #2A2112;
    --terminal-focus: #FFC14D;
    --terminal-rule: #2A2D34;

    /* --- stavy: plná farba (ikony, okraje) + štítková dvojica plocha / text --- */
    --success: #2F8A4E;
    --success-text: #1D6B3A;
    --success-soft: #E5F4EA;
    --success-border: #BFE3CB;
    --warning: #C2560A;
    --warning-text: #9A3F05;
    --warning-soft: #FDEBDD;
    --warning-border: #F6CDAE;
    --danger: #D13A2E;
    --danger-text: #B42318;
    --danger-soft: #FDECEA;
    --danger-border: #F5C4BE;

    /* Posuvníky */
    --scrollbar-track: var(--bg);
    --scrollbar-thumb: #C9CBD0;
    --scrollbar-thumb-hover: var(--border-strong);

    /* Šípka rozbaľovacieho zoznamu (farba --text-muted) — obrázok, <select> nedovolí ::after. */
    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F636B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");

    /* Plocha pod QR kódom: biela v oboch režimoch, čítačka potrebuje tmavé na svetlom. */
    --qr-bg: #FFFFFF;

    /* Stmavenie pod dialógom a bočným panelom na mobile */
    --backdrop: rgb(18 20 23 / 0.5);

    /* --- písmo (lokálne, viď fonts.css) --- */
    --font-display: "Bricolage Grotesque", "Hanken Grotesk", ui-sans-serif, system-ui, sans-serif;
    --font-sans: "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
    /* Škála: 12, 14, 16, 20, 24, 32 px (40 px a viac len na verejnom webe) */
    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.25rem;
    --text-xl: 1.5rem;
    --text-2xl: 2rem;
    /* Verejný web: veľké čísla a nadpisy úvodu (40, 48, 56 px) */
    --text-3xl: 2.5rem;
    --text-4xl: 3rem;
    --text-5xl: 3.5rem;
    --weight-regular: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;
    --weight-heavy: 800;
    --leading-display: 1.05;
    /* Menší nadpis pod hlavným (podnadpis v h1): vyšší riadok, aby diakritika dvoch riadkov nenarážala */
    --leading-tight: 1.15;
    --leading-normal: 1.5;
    --tracking-display: -0.03em;
    --tracking-label: 0.06em;

    /* --- odstupy: 4, 8, 12, 16, 24, 32, 48, 64 px --- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-6: 1.5rem;
    --space-8: 2rem;
    --space-12: 3rem;
    --space-16: 4rem;

    /* --- rádiusy --- */
    --radius-control: 6px;
    --radius-card: 10px;
    --radius-full: 9999px;

    /* --- tiene: len vo svetlom režime a jemné --- */
    --shadow-xs: 0 1px 2px 0 rgb(18 20 23 / 0.04);
    --shadow-lg: 0 12px 24px -8px rgb(18 20 23 / 0.12), 0 4px 8px -4px rgb(18 20 23 / 0.06);

    /* --- pohyb --- */
    --ease-out: cubic-bezier(0, 0, 0.2, 1);
    --duration: 150ms;
    --duration-panel: 250ms;
    /* Posun ukazovateľa priebehu po obnovení a jeden prechod bežiaceho úseku pri neznámom celku. */
    --duration-progress: 600ms;
    --duration-indeterminate: 1600ms;
    /* Výpis činnosti: pulz „naživo“ a zvýraznenie nového riadku (dosvit). */
    --duration-pulse: 2s;
    --duration-arrive: 2400ms;

    /* --- rozmery rozloženia --- */
    --sidebar-width: 16rem;
    --topbar-height: 4rem;
    /* Ikony: 16, 18, 20, 24, 32, 40 px */
    --icon-xs: 1rem;
    --icon-sm: 1.125rem;
    --icon-md: 1.25rem;
    --icon-lg: 1.5rem;
    --icon-xl: 2rem;
    --icon-2xl: 2.5rem;
    /* Výška štítku a počítadla (riadok písma 12 px s odsadením) */
    --chip-height: 1.25rem;
    /* Dĺžka riadku textu */
    --measure: 65ch;
    --measure-narrow: 45ch;
    --measure-wide: 70ch;
    /* Šírky panelov a prvkov */
    --width-dropdown: 15rem;
    --width-auth: 26rem;
    --width-dialog: 36rem;
    --width-panel: 40rem;
    --width-field-min: 11rem;
    --width-search: 24rem;
    --width-tile-min: 14rem;
    --width-label: 6rem;
    --height-dialog: 48rem;
    --height-code: 20rem;
    /* Návštevnosť (administrácia): výška grafu a najväčšia šírka stĺpca dňa */
    --height-chart: 12rem;
    /* Malý stĺpcový graf v karte Prehľadu (tržby po dňoch, návštevy 30 dní) */
    --height-chart-sm: 6rem;
    --width-chart-bar: 1.5rem;
    /* Stĺpec popisov pri vodorovných pruhoch Prehľadu (najdlhší typ subjektu na jeden-dva riadky) */
    --width-chart-label: 16rem;
    /* Karta „Čo sa deje“ v hlavičke Prehľadu (od 80 rem okna vedľa nadpisu). */
    --width-term: 34rem;
    /* Výpis činnosti v Zbere a CRONe: najvyššia výška, ďalej sa posúva vnútri. */
    --height-term-panel: 32rem;
    --height-textarea: 5rem;
    --size-qr: 10rem;
    --size-qr-lg: 15rem;
    /* Verejný web: šírka obsahu a textového stĺpca úvodu */
    --width-site: 76rem;
    --width-hero: 46rem;
    /* Obsah dokumentu vedľa právneho textu (verejný web) a stĺpec so značkami vedľa editora (administrácia). */
    --width-toc: 16rem;
    /* Ukážka: rozmazanie vymyslených riadkov a výška ich pásu pod výzvou */
    --blur-sample: 5px;
    --height-sample-more: 34rem;
    /* Najmenšia klikacia plocha ovládacích prvkov */
    --control-height: 2.75rem;
    --control-height-sm: 2.25rem;
}

/* Tmavé hodnoty — rovnaký blok dvakrát: raz pre voľbu v prepínači, raz pre systém bez voľby. */
:root[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0E1014;
    --surface: #15171C;
    --surface-2: #1B1E24;
    --border: #262A31;
    --border-strong: #656A74;
    --text: #ECEDEF;
    --text-muted: #A3A7B0;
    --text-subtle: #848892;
    --accent: #FFB020;
    --accent-hover: #FFC14D;
    --on-accent: #1A1206;
    --accent-text: #FFC14D;
    --accent-display: #FFB020;
    --accent-soft: #2E2310;
    --accent-soft-text: #FFCB66;
    --dots: #3F3114;
    --watermark: #1E2127;
    --watermark-accent: #2A2214;
    --chart-1: #FFB020;
    --chart-1-muted: #8A6420;
    --chart-2: #656A74;
    --chart-track: #2E2310;
    --success: #3FB86A;
    --success-text: #6FD394;
    --success-soft: #11261A;
    --success-border: #1F4A30;
    --warning: #F07A2E;
    --warning-text: #FFA066;
    --warning-soft: #2E1A0E;
    --warning-border: #5A3218;
    --danger: #F0574B;
    --danger-text: #FF8A80;
    --danger-soft: #331614;
    --danger-border: #642722;
    /* Terminál o krok tmavší ako plocha stránky, s okrajom (bez neho by splynul). Kontrast textu 13,3 : 1, času 6,2 : 1. */
    --terminal-bg: #0A0B0E;
    --terminal-border: #2F333B;
    --terminal-hover: #16181D;
    --terminal-rule: #1F2228;
    --scrollbar-thumb: #2F333B;
    --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A3A7B0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
    --backdrop: rgb(0 0 0 / 0.6);
    /* V tmavom režime žiadne tiene — hĺbku dáva svetlejšia plocha. */
    --shadow-xs: none;
    --shadow-lg: none;
}

@media (prefers-color-scheme: dark) {
    :root:not([data-theme="light"]) {
        color-scheme: dark;
        --bg: #0E1014;
        --surface: #15171C;
        --surface-2: #1B1E24;
        --border: #262A31;
        --border-strong: #656A74;
        --text: #ECEDEF;
        --text-muted: #A3A7B0;
        --text-subtle: #848892;
        --accent: #FFB020;
        --accent-hover: #FFC14D;
        --on-accent: #1A1206;
        --accent-text: #FFC14D;
        --accent-display: #FFB020;
        --accent-soft: #2E2310;
        --accent-soft-text: #FFCB66;
        --dots: #3F3114;
        --watermark: #1E2127;
        --watermark-accent: #2A2214;
        --chart-1: #FFB020;
        --chart-1-muted: #8A6420;
        --chart-2: #656A74;
        --chart-track: #2E2310;
        --success: #3FB86A;
        --success-text: #6FD394;
        --success-soft: #11261A;
        --success-border: #1F4A30;
        --warning: #F07A2E;
        --warning-text: #FFA066;
        --warning-soft: #2E1A0E;
        --warning-border: #5A3218;
        --danger: #F0574B;
        --danger-text: #FF8A80;
        --danger-soft: #331614;
        --danger-border: #642722;
        /* Terminál o krok tmavší ako plocha stránky, s okrajom (bez neho by splynul). Kontrast textu 13,3 : 1, času 6,2 : 1. */
        --terminal-bg: #0A0B0E;
        --terminal-border: #2F333B;
        --terminal-hover: #16181D;
        --terminal-rule: #1F2228;
        --scrollbar-thumb: #2F333B;
        --select-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23A3A7B0' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
        --backdrop: rgb(0 0 0 / 0.6);
        --shadow-xs: none;
        --shadow-lg: none;
    }
}