/* =====================================================================
   Material 3 token bridge (2026-09-05). @material/web komponenty čtou
   barvy/tvary/písmo z proměnných s prefixem "md-sys" a "md-ref" –
   POZOR: nikdy nepsat v komentářích v tomhle souboru "hvězdička,
   lomítko" pohromadě (i jako součást jiné zkratky) - uzavře to
   komentář předčasně a zbytek souboru přestane platit jako CSS (přesně
   tenhle bug tu byl 2026-09-05, --md-sys-color-primary končilo jako
   Google výchozí fialová misto brand modré na VŠECH stránkách).
   Tenhle soubor mapuje ty proměnné na NAŠE existující brand tokeny
   (style.css :root a [data-theme="dark"]), takže Material komponenty
   automaticky dostanou euroklic brand, ne výchozí Google fialovou M3
   paletu. Žádné nové barvy tady nejsou definované, jen aliasy.

   Načíst AŽ PO style.css (potřebuje --surface/--brand-ink/atd. už
   definované), na VŠECH stránkách, co používají <md-*> komponenty.
   ===================================================================== */
:root {
    /* --- Barvy: primary = brandButton (§15, KONSTANTNÍ přes témata) --- */
    --md-sys-color-primary: var(--btn-primary-bg);
    --md-sys-color-on-primary: #ffffff;
    --md-sys-color-primary-container: var(--brand-wash);
    --md-sys-color-on-primary-container: var(--brand-ink);

    /* Nemáme samostatnou "secondary" roli v brand booku – neutrální
       povrchová alternativa (outlined/text tlačítka, sekundární chipy). */
    --md-sys-color-secondary: var(--text-strong);
    --md-sys-color-on-secondary: var(--surface);
    --md-sys-color-secondary-container: var(--surface-container);
    --md-sys-color-on-secondary-container: var(--text-strong);

    /* Tertiary = accent-orange (druhý brand akcent, hint/CTA). */
    --md-sys-color-tertiary: var(--accent-orange);
    --md-sys-color-on-tertiary: var(--accent-orange-ink);
    --md-sys-color-tertiary-container: var(--brand-wash);
    --md-sys-color-on-tertiary-container: var(--accent-orange);

    --md-sys-color-error: var(--accent-red);
    --md-sys-color-on-error: #ffffff;
    --md-sys-color-error-container: var(--dislike-bg);
    --md-sys-color-on-error-container: var(--dislike-text);

    --md-sys-color-background: var(--bg-color);
    --md-sys-color-on-background: var(--text-color);
    --md-sys-color-surface: var(--surface);
    --md-sys-color-on-surface: var(--text-strong);
    --md-sys-color-surface-variant: var(--surface-container);
    --md-sys-color-on-surface-variant: var(--text-muted);
    --md-sys-color-outline: var(--outline);
    --md-sys-color-outline-variant: var(--outline-variant);

    --md-sys-color-surface-container-lowest: var(--surface);
    --md-sys-color-surface-container-low: var(--surface-container);
    --md-sys-color-surface-container: var(--surface-container);
    --md-sys-color-surface-container-high: var(--surface-container-high);
    --md-sys-color-surface-container-highest: var(--surface-container-high);
    --md-sys-color-surface-dim: var(--surface-container);
    --md-sys-color-surface-bright: var(--surface);

    --md-sys-color-inverse-surface: var(--text-strong);
    --md-sys-color-inverse-on-surface: var(--surface);
    --md-sys-color-inverse-primary: var(--brand-wash);
    --md-sys-color-shadow: #000000;
    --md-sys-color-scrim: #000000;
}

/* KRITICKÉ (zjištěno 2026-09-05 z uživatelova screenshotu – text v
   Material polích zůstával tmavý i v tmavém režimu): "--md-sys-color-X:
   var(--Y)" výš v :root se spočítá JEDNOU, na <html> – a <html> nikdy
   nedostane [data-theme="dark"] (to je na <body>). Zděděná vypočtená
   hodnota se pak nese dolů BEZE ZMĚNY do všech Material komponent, i
   když <body> samo o sobě --text-strong/--surface/atd. správně mění.
   Prostý HTML text (nadpisy, place-card) tenhle bug NEMÁ, protože čte
   --text-strong PŘÍMO, ne přes tuhle přesměrovací vrstvu.
   Řešení: STEJNÉ mapování zopakovat pod [data-theme="dark"], ať se
   přepočítá NA <body> (kde tenhle atribut skutečně je) ze SPRÁVNÝCH
   tmavých hodnot – ne duplicitní barvy, furt jen alias na style.css. */
[data-theme="dark"] {
    --md-sys-color-primary: var(--btn-primary-bg);
    --md-sys-color-on-primary: #ffffff;
    --md-sys-color-primary-container: var(--brand-wash);
    --md-sys-color-on-primary-container: var(--brand-ink);

    --md-sys-color-secondary: var(--text-strong);
    --md-sys-color-on-secondary: var(--surface);
    --md-sys-color-secondary-container: var(--surface-container);
    --md-sys-color-on-secondary-container: var(--text-strong);

    --md-sys-color-tertiary: var(--accent-orange);
    --md-sys-color-on-tertiary: var(--accent-orange-ink);
    --md-sys-color-tertiary-container: var(--brand-wash);
    --md-sys-color-on-tertiary-container: var(--accent-orange);

    --md-sys-color-error: var(--accent-red);
    --md-sys-color-on-error: #ffffff;
    --md-sys-color-error-container: var(--dislike-bg);
    --md-sys-color-on-error-container: var(--dislike-text);

    --md-sys-color-background: var(--bg-color);
    --md-sys-color-on-background: var(--text-color);
    --md-sys-color-surface: var(--surface);
    --md-sys-color-on-surface: var(--text-strong);
    --md-sys-color-surface-variant: var(--surface-container);
    --md-sys-color-on-surface-variant: var(--text-muted);
    --md-sys-color-outline: var(--outline);
    --md-sys-color-outline-variant: var(--outline-variant);

    --md-sys-color-surface-container-lowest: var(--surface);
    --md-sys-color-surface-container-low: var(--surface-container);
    --md-sys-color-surface-container: var(--surface-container);
    --md-sys-color-surface-container-high: var(--surface-container-high);
    --md-sys-color-surface-container-highest: var(--surface-container-high);
    --md-sys-color-surface-dim: var(--surface-container);
    --md-sys-color-surface-bright: var(--surface);

    --md-sys-color-inverse-surface: var(--text-strong);
    --md-sys-color-inverse-on-surface: var(--surface);
    --md-sys-color-inverse-primary: var(--brand-wash);
    --md-sys-color-shadow: #000000;
    --md-sys-color-scrim: #000000;
}

:root {
    /* --- Tvar: naše 3-stupňová škála (§08) na M3 7-stupňovou --- */
    --md-sys-shape-corner-none: 0px;
    --md-sys-shape-corner-extra-small: var(--radius-sm);
    --md-sys-shape-corner-small: var(--radius-sm);
    --md-sys-shape-corner-medium: var(--radius-md);
    --md-sys-shape-corner-large: var(--radius-lg);
    --md-sys-shape-corner-extra-large: var(--radius-lg);
    --md-sys-shape-corner-full: 999px;

    /* --- Písmo: IBM Plex Sans všude (§10), ne Roboto --- */
    --md-ref-typeface-brand: 'Plex Sans', sans-serif;
    --md-ref-typeface-plain: 'Plex Sans', sans-serif;
}