/* =====================================================================
   Barevné varianty. Výchozí varianta A („Teplý večer“) je v styles.css.
   Aktivní varianta se řídí atributem <html data-theme="a|b|c">.
   Po výběru finální varianty: přesunout její tokeny do :root v styles.css
   a tento soubor + přepínač (config.js → themeSwitcher) odstranit.
   ===================================================================== */

/* ---------- B „Půlnoc a broskev“ – tmavá půlnoční modř, broskvová CTA, lehká perlová modř ---------- */
:root[data-theme="b"] {
  --bg: #12172B;            --bg-rgb: 18, 23, 43;
  --bg-2: #171D36;
  --surface: #1C2340;       --surface-rgb: 28, 35, 64;
  --border: rgba(241, 238, 247, 0.12);
  --tint: #1A2038;
  --ink: #F1EEF7;  --ink-soft: #BDC1CF;  --ink-faint: #8B91A6;

  --accent: #F0AE74;        --accent-dark: #F7BE8C;   --on-accent: #14182B;  --accent-rgb: 240, 174, 116;
  --accent-soft: rgba(240, 174, 116, 0.16);   --on-accent-soft: #F5C592;
  --accent-text: #F3B884;

  --secondary: #4A5AC7;     --secondary-dark: #3B49A8; --on-secondary: #F1EEF7; --secondary-rgb: 74, 90, 199;
  --secondary-soft: #252D55; --on-secondary-soft: #BCC4FF;
  --secondary-mid: #8A97E8;
  --link: #BCC4FF;

  --dark-section: #221C48;  --on-dark: #F1EEF7;  --on-dark-accent: #F3B884;
  --footer-bg: #0C1020;

  --gold: #E0B25C;  --ok: #6FCF97;  --err: #FF8A7A;  --err-bg: rgba(255, 138, 122, 0.15);

  --glow-1: rgba(240, 174, 116, 0.18);
  --glow-2: rgba(138, 151, 232, 0.2);
  --glow-safety: rgba(138, 151, 232, 0.35);
  --shadow-rgb: 0, 0, 0;
  --shadow: 0 10px 30px rgba(0, 0, 0, 0.35), 0 2px 6px rgba(0, 0, 0, 0.3);
  --shadow-lg: 0 30px 60px rgba(0, 0, 0, 0.5), 0 6px 14px rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}
:root[data-theme="b"] .field select { background-image: linear-gradient(45deg, transparent 50%, var(--ink-soft) 50%), linear-gradient(135deg, var(--ink-soft) 50%, transparent 50%); }
:root[data-theme="b"] .gallery figure, :root[data-theme="b"] .map { background: var(--surface); }
:root[data-theme="b"] .why-diff { border-color: rgba(241, 238, 247, 0.25); }

/* ---------- C „Šalvěj a švestka“ – světlý šalvějový podklad, švestková CTA, hluboká lesní zelená ---------- */
:root[data-theme="c"] {
  --bg: #F3F4EF;            --bg-rgb: 243, 244, 239;
  --bg-2: #F9F9F5;
  --surface: #FFFFFF;       --surface-rgb: 255, 255, 255;
  --border: #DFE4DA;
  --tint: #E9EFE6;
  --ink: #1E2823;  --ink-soft: #4C5A52;  --ink-faint: #7B877F;

  --accent: #6A2C5B;        --accent-dark: #55214A;   --on-accent: #FFFFFF;  --accent-rgb: 106, 44, 91;
  --accent-soft: #F0E0EC;   --on-accent-soft: #5A2450;
  --accent-text: #7A3468;

  --secondary: #24443A;     --secondary-dark: #182F28; --on-secondary: #F3F4EF; --secondary-rgb: 36, 68, 58;
  --secondary-soft: #DFE9E1; --on-secondary-soft: #24443A;
  --secondary-mid: #6E9A82;
  --link: #6A2C5B;

  --dark-section: #24443A;  --on-dark: #F3F4EF;  --on-dark-accent: #BFD6C4;
  --footer-bg: #16261F;

  --gold: #D8A657;  --ok: #2E7D5B;  --err: #B3261E;  --err-bg: #FBE9E7;

  --glow-1: rgba(226, 214, 230, 0.9);
  --glow-2: rgba(214, 228, 216, 0.9);
  --glow-safety: rgba(110, 154, 130, 0.45);
  --shadow-rgb: 30, 40, 35;
}

/* ---------- Přepínač variant (jen pro výběr, před spuštěním vypnout v config.js) ---------- */
.theme-switcher {
  position: fixed; left: 14px; bottom: 14px; z-index: 95;
  display: flex; align-items: center; gap: 6px; padding: 6px 8px 6px 12px;
  background: rgba(var(--surface-rgb), 0.96); border: 1px solid var(--border); border-radius: 999px;
  box-shadow: var(--shadow-lg); font-size: 0.78rem; color: var(--ink-soft);
}
.theme-switcher__label { font-family: var(--font-display); font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; font-size: 0.68rem; margin-right: 4px; }
.theme-switcher button {
  display: inline-flex; align-items: center; gap: 7px; padding: 6px 10px 6px 7px; border-radius: 999px;
  border: 1.5px solid transparent; background: transparent; color: var(--ink); cursor: pointer; font-weight: 600; font-size: 0.8rem;
}
.theme-switcher button:hover { background: var(--bg-2); }
.theme-switcher button[aria-pressed="true"] { border-color: var(--ink); }
.theme-switcher .sw { display: inline-flex; gap: 2px; }
.theme-switcher .sw i { width: 10px; height: 16px; border-radius: 3px; display: block; }
.theme-switcher .name { display: none; }
@media (min-width: 700px) { .theme-switcher .name { display: inline; } }
@media (max-width: 860px) { .theme-switcher { bottom: 86px; } }