/* ============================================================
   Torbim – design tokeny (zelená identita podle schváleného návrhu)
   ------------------------------------------------------------
   Jediné místo, kde se definují barvy, písmo, odsazení, zaoblení
   a stíny. Ostatní styly z těchto proměnných čtou; nikde jinde
   se hodnoty nepíší natvrdo.

   Načítá se hned ZA bootstrapem: přemapovává jeho proměnné (--bs-*)
   na tokeny, takže jeho komponenty převezmou hodnoty bez přepisování
   tříd.

   Rozměry jsou v rem. Základ je 15 px a na širokých displejích roste
   (viz dole), takže se celá aplikace zvětší od 1920 px po 4K, místo
   aby stála úzká uprostřed.

   Kontrasty jsou naměřené proti bílé, pokud není uvedeno jinak.
   AA pro běžný text = 4,5:1, pro velký text a hranice prvků = 3:1.
   ============================================================ */

:root {
    /* ---------- Barvy: značka a akce ---------- */
    /* Zelená značky (nové logo). */
    --color-brand: #10b981;

    /* Hluboká zelená: čísla, hlavní nadpisy, blok účtu v menu. 12:1 */
    --color-navy: #123f33;
    --color-navy-text: #ffffff;

    /* Světlá zelená jako akcent: křivky, ikony, aktivní stav. Na text nestačí. */
    --color-accent: #10b981;

    /* Primární akce a odkazy: tmavší zelená, 5,1:1 s bílým textem. */
    --color-primary: #047857;
    --color-primary-hover: #065f46;   /* 6,9:1 */
    --color-primary-tint: #d1fae5;    /* aktivní položka, vybraný řádek */
    --color-primary-tint-text: #065f46; /* 6,1:1 na tintu */

    /* ---------- Barvy: text ---------- */
    --color-text: #182420;            /* 15,4:1 */
    --color-text-2: #4b5a52;          /* 7,2:1 – sekundární text, popisky */
    --color-text-3: #68776f;          /* 4,7:1 – tlumený text, časy, placeholder */
    --color-text-inverse: #ffffff;

    /* ---------- Barvy: plochy a hranice ---------- */
    --color-bg: #f2f6f3;              /* zelenkavě šedý podklad stránky */
    --color-surface: #ffffff;         /* karty, tabulky, panely, menu */
    --color-surface-2: #f3f7f4;       /* hlavička tabulky, zvýrazněný řádek */
    --color-border: #dfe7e1;          /* rámečky karet, dělicí čáry */
    --color-border-strong: #68776f;   /* rámeček polí formuláře, 4,7:1 */

    /* ---------- Barvy: stavy ---------- */
    --color-success: #16794f;         /* 4,6:1 bílý text */
    --color-success-tint: #e2f6ec;
    --color-success-text: #166a48;    /* 6,3:1 na tintu */

    --color-warning: #b26a00;         /* 4,6:1 bílý text */
    --color-warning-tint: #fff1dc;
    --color-warning-text: #8a5200;    /* 6,4:1 na tintu */

    --color-danger: #c0392b;          /* 5,2:1 bílý text */
    --color-danger-tint: #fde6e3;
    --color-danger-text: #9a2b20;     /* 6,6:1 na tintu */

    --color-info: #2563eb;            /* 4,6:1 bílý text */
    --color-info-tint: #e3f0ff;
    --color-info-text: #1d4ed8;       /* 6,2:1 na tintu */

    --color-neutral-tint: #eef2f6;
    --color-neutral-text: #3d4d5c;    /* 8,2:1 na tintu */

    /* Odlišení AI návrhů od značky (zatím jen připraveno) */
    --color-ai: #4f46e5;
    --color-ai-tint: #eef2ff;

    /* ---------- Typografie ---------- */
    --font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

    --text-xs: 0.75rem;     /* 12 px – časy, pomocné popisky, odznaky */
    --text-sm: 0.8125rem;   /* 13 px – buňky tabulek, sekundární text */
    --text-base: 0.875rem;  /* 14 px – základ aplikace */
    --text-md: 1rem;        /* 16 px – nadpisy karet a sekcí */
    --text-lg: 1.375rem;    /* 22 px – titulek stránky */
    --text-xl: 1.75rem;     /* 28 px – čísla v metrikách */
    --text-2xl: 3rem;       /* 48 px – hlavní číslo na přehledu */

    --leading-xs: 1rem;
    --leading-sm: 1.125rem;
    --leading-base: 1.25rem;
    --leading-md: 1.5rem;
    --leading-lg: 1.75rem;
    --leading-xl: 2rem;

    --weight-normal: 400;
    --weight-medium: 500;
    --weight-semibold: 600;
    --weight-bold: 700;

    /* ---------- Odsazení (krok 4 px) ---------- */
    --space-1: 0.25rem;
    --space-2: 0.5rem;
    --space-3: 0.75rem;
    --space-4: 1rem;
    --space-5: 1.5rem;
    --space-6: 2rem;
    --space-7: 3rem;

    /* ---------- Zaoblení ---------- */
    --radius-sm: 8px;     /* pole, tlačítka */
    --radius-md: 12px;    /* karty, panely */
    --radius-pill: 999px; /* odznaky, avatar */

    /* ---------- Stíny ---------- */
    --shadow-card: 0 1px 3px rgba(24, 36, 32, 0.06), 0 8px 24px rgba(24, 36, 32, 0.06);
    --shadow-float: 0 12px 32px rgba(24, 36, 32, 0.14);

    /* ---------- Fokus ---------- */
    --focus-ring: 0 0 0 2px var(--color-surface), 0 0 0 4px var(--color-accent);

    /* ---------- Rozměry (rem, aby škálovaly se základem) ---------- */
    --control-height: 2.5rem;          /* 36 px */
    --control-height-sm: 2.1428rem;    /* 30 px */
    --touch-target: 3.1428rem;         /* 44 px */
    --content-max-width: 100rem;       /* 1400 px při 14 px */
    --content-max-width-wide: 128rem;
    --sidebar-width: 18.2857rem;       /* 256 px */
    --sidebar-width-collapsed: 4.5714rem; /* 64 px */
    --topbar-height: 4.5714rem;        /* 64 px */
    --drawer-width: 34.2857rem;        /* 480 px */
    --bottom-nav-height: 4.2857rem;    /* 60 px, mobil */

    /* ============================================================
       Přemapování Bootstrapu 5.3 na tokeny
       ============================================================ */
    --bs-font-sans-serif: var(--font-sans);
    --bs-body-font-family: var(--font-sans);
    --bs-body-font-size: var(--text-base);
    --bs-body-line-height: 1.4286;
    --bs-body-color: var(--color-text);
    --bs-body-color-rgb: 24, 36, 32;
    --bs-body-bg: var(--color-bg);
    --bs-emphasis-color: var(--color-text);
    --bs-heading-color: var(--color-text);

    --bs-secondary-color: var(--color-text-3);
    --bs-secondary-color-rgb: 104, 119, 111;
    --bs-tertiary-color: var(--color-text-3);
    --bs-tertiary-bg: var(--color-surface-2);
    --bs-secondary-bg: var(--color-neutral-tint);

    --bs-border-color: var(--color-border);
    --bs-border-color-translucent: var(--color-border);
    --bs-border-radius: var(--radius-sm);
    --bs-border-radius-sm: var(--radius-sm);
    --bs-border-radius-lg: var(--radius-md);
    --bs-border-radius-xl: var(--radius-md);

    --bs-link-color: var(--color-primary);
    --bs-link-color-rgb: 4, 120, 87;
    --bs-link-hover-color: var(--color-primary-hover);
    --bs-link-hover-color-rgb: 6, 95, 70;

    --bs-primary: var(--color-primary);
    --bs-primary-rgb: 4, 120, 87;
    --bs-secondary: var(--color-text-2);
    --bs-secondary-rgb: 75, 90, 82;
    --bs-success: var(--color-success);
    --bs-success-rgb: 31, 157, 107;
    --bs-warning: var(--color-warning);
    --bs-warning-rgb: 178, 106, 0;
    --bs-danger: var(--color-danger);
    --bs-danger-rgb: 192, 57, 43;
    --bs-info: var(--color-info);
    --bs-info-rgb: 37, 99, 235;
    --bs-light: var(--color-surface-2);
    --bs-light-rgb: 243, 247, 244;
    --bs-dark: var(--color-navy);
    --bs-dark-rgb: 18, 63, 51;

    --bs-primary-text-emphasis: var(--color-primary-tint-text);
    --bs-primary-bg-subtle: var(--color-primary-tint);
    --bs-primary-border-subtle: #a7f3d0;
    --bs-success-text-emphasis: var(--color-success-text);
    --bs-success-bg-subtle: var(--color-success-tint);
    --bs-success-border-subtle: #b9e9d2;
    --bs-warning-text-emphasis: var(--color-warning-text);
    --bs-warning-bg-subtle: var(--color-warning-tint);
    --bs-warning-border-subtle: #fbdca8;
    --bs-danger-text-emphasis: var(--color-danger-text);
    --bs-danger-bg-subtle: var(--color-danger-tint);
    --bs-danger-border-subtle: #f6c3bd;
    --bs-info-text-emphasis: var(--color-info-text);
    --bs-info-bg-subtle: var(--color-info-tint);
    --bs-info-border-subtle: #bfd8ff;
    --bs-secondary-text-emphasis: var(--color-neutral-text);
    --bs-secondary-bg-subtle: var(--color-neutral-tint);
    --bs-secondary-border-subtle: var(--color-border);

    --bs-box-shadow: var(--shadow-float);
    --bs-box-shadow-sm: var(--shadow-card);
    --bs-box-shadow-lg: var(--shadow-float);

    --bs-focus-ring-color: rgba(16, 185, 129, 0.35);
    --bs-focus-ring-width: 3px;
}

/* ============================================================
   Tmavý režim: vlastní sada, ne inverze. Zapíná se atributem
   data-theme="dark" na <html> (přepínač v horní liště, uloženo
   v localStorage). Kontrasty měřené proti #16232c.
   ============================================================ */
html[data-theme="dark"] {
    --color-navy: #17342a;
    --color-accent: #34d399;
    --color-primary: #10b981;          /* 8,3:1 s tmavým textem */
    --color-primary-hover: #34d399;
    --color-primary-tint: #0f3328;
    --color-primary-tint-text: #86efac;

    --color-text: #e7efe9;             /* 13,5:1 */
    --color-text-2: #b6c4ba;           /* 8,5:1 */
    --color-text-3: #8a9a8f;           /* 5,0:1 */
    --color-text-inverse: #0c1512;

    --color-bg: #0c1512;
    --color-surface: #12201a;
    --color-surface-2: #172721;
    --color-border: #22362d;
    --color-border-strong: #8a9a8f;

    --color-success: #4ade80;  --color-success-tint: #10261a; --color-success-text: #86efac;
    --color-warning: #fbbf24;  --color-warning-tint: #2c2210; --color-warning-text: #fcd34d;
    --color-danger: #f87171;   --color-danger-tint: #2d1515;  --color-danger-text: #fca5a5;
    --color-info: #7cb0ff;     --color-info-tint: #16213a;    --color-info-text: #a9c7ff;
    --color-neutral-tint: #1f2e38; --color-neutral-text: #cbd5df;
    --color-ai: #a5b4fc; --color-ai-tint: #1e2140;

    --shadow-card: none;
    --shadow-float: 0 12px 32px rgba(0, 0, 0, 0.5);

    --bs-body-color-rgb: 231, 239, 233;
    --bs-secondary-color-rgb: 138, 154, 143;
    --bs-link-color-rgb: 16, 185, 129;
    --bs-link-hover-color-rgb: 52, 211, 153;
    --bs-primary-rgb: 16, 185, 129;
    --bs-secondary-rgb: 182, 196, 186;
    --bs-success-rgb: 74, 222, 128;
    --bs-warning-rgb: 251, 191, 36;
    --bs-danger-rgb: 248, 113, 113;
    --bs-info-rgb: 124, 176, 255;
    --bs-light-rgb: 23, 39, 33;
    --bs-dark-rgb: 231, 239, 233;
    --bs-primary-border-subtle: #14532d;
    --bs-success-border-subtle: #1f4d33;
    --bs-warning-border-subtle: #5a4412;
    --bs-danger-border-subtle: #5a2626;
    --bs-info-border-subtle: #27406e;

    /* Tlačítka s tmavým textem na světlé tyrkysové */
    --color-navy-text: #e7efe9;
}

html[data-theme="dark"] {
    color-scheme: dark;
}

/* ============================================================
   Škálování základu podle šířky displeje. Tokeny jsou v rem,
   takže se zvětší písmo, odsazení, menu i horní hranice obsahu.
   ============================================================ */
html {
    font-size: 15px;
}

/* Notebooky s retinou (MacBook Air 1280–1470 px) */
@media (min-width: 1280px) {
    html { font-size: 16px; }
}

@media (min-width: 1920px) {
    html { font-size: 17px; }
}

@media (min-width: 2560px) {
    html { font-size: 18px; }
    :root { --content-max-width: 116rem; --content-max-width-wide: 140rem; }
}

@media (min-width: 3440px) {
    html { font-size: 20px; }
    :root { --content-max-width: 124rem; --content-max-width-wide: 150rem; }
}