/* Farebné verzie. Zelená je základ v styles.css (:root), tu sú ostatné.
   Prepína ich atribút data-theme na <html>; html[data-theme] má vyššiu špecificitu než :root. */

/* Červená — oheň */
html[data-theme="red"] {
  --ink-rgb: 26 16 14;
  --paper-rgb: 251 243 238;
  --accent-rgb: 226 58 32;
  --accent-deep: 140 24 12;
  --accent-hi: 255 190 160;
  --accent-edge: 250 190 160;
  --accent-a: 232 70 36;
  --accent-b: 196 36 20;
  --accent-hover: #BC2215;
  --on-accent: #FBF3EE;
  --field-a: 255 150 60;      /* oranžový plameň */
  --field-b: 255 205 110;     /* jantárová žiara */
  --glass-hi: 252 245 240;
  --glass-lo: 248 234 226;
  --sheen: 255 250 246;
  --edge: 253 246 241;
  --tint-a: 245 150 110;
  --tint-b: 250 190 120;
  --soft-a: 250 225 212;
  --soft-b: 246 205 185;
  --solid-a: 252 244 238;
  --solid-b: 246 232 223;
  --solid-c: 244 226 214;
  --shadow-rgb: 110 30 15;
  --solid: #F6ECE5;
  --solid-tint: #F4D2C2;
  --logo-grey: #6A5A55;
  --invalid: #B4452A;
  --error: #9A2A12;

  --bg: #F1E6DF;
  --paper: #FBF3EE;
  --ink: #1A100E;
  --ink-2: #3A2621;
  --muted: #5E4A44;
  --accent: #D42A1A;
  --accent-ink: #9C1C10;
  --accent-soft: #F8DDD2;
  --scrim: 20 9 7;
  --hero-hl: #FF9A5A;
  --hero-eyebrow: #FFB98A;
  --video-filter: none;
}
html[data-theme="red"] .hero__mark path { stroke: url(#flame); }

/* Modrá — polnočná navy + signálna žltá (reflexná vesta) + kobalt */
html[data-theme="navy"] {
  --ink-rgb: 12 20 36;
  --paper-rgb: 245 247 251;
  --accent-rgb: 255 197 49;
  --accent-deep: 150 100 0;
  --accent-hi: 255 236 180;
  --accent-edge: 255 225 150;
  --accent-a: 255 208 72;
  --accent-b: 246 178 18;
  --accent-hover: #FFB703;
  --on-accent: #0C1424;
  --field-a: 92 136 255;      /* kobaltová žiara */
  --field-b: 255 214 102;     /* signálna žltá */
  --glass-hi: 248 250 254;
  --glass-lo: 236 241 250;
  --sheen: 252 253 255;
  --edge: 250 252 255;
  --tint-a: 150 180 255;
  --tint-b: 255 222 150;
  --soft-a: 232 238 252;
  --soft-b: 214 224 248;
  --solid-a: 246 248 252;
  --solid-b: 234 239 248;
  --solid-c: 226 233 246;
  --shadow-rgb: 20 40 90;
  --solid: #EEF2F9;
  --solid-tint: #D9E3F7;
  --logo-grey: #5A6478;
  --logo-mark: #0C1424;
  --invalid: #B4452A;
  --error: #9A2A12;
  --scrim: 8 14 28;
  --hero-hl: #FFD25A;
  --hero-eyebrow: #A9C6FF;
  --video-filter: hue-rotate(185deg) saturate(1.1);

  --bg: #E8ECF4;
  --paper: #F5F7FB;
  --ink: #0C1424;
  --ink-2: #22304A;
  --muted: #4A5568;
  --accent: #FFC531;
  --accent-ink: #2450D8;
  --accent-soft: #FFF1C7;
}
html[data-theme="navy"] .logo__mark path { stroke: #FFC531; }