/* CPM Field – Design-Tokens der Anmeldeseiten (Stand 2026-10-19).
   Stil des Schulungsportals (flache weisse Kacheln auf ruhigem Grund, Carlito, runde Knoepfe),
   Akzent bleibt Violett. Standard ist hell; dunkel nur per Wahl des Nutzers (data-theme="dark").
   Die Entwuerfe in design/ (Hub, JTI, Manager) behalten ihre eigene tokens.css bis zur Umstellung. */

:root,
[data-theme="light"] {
  color-scheme: light;
  --grund: #f4f4f6;
  --grund-2: #eceaf1;
  --grund-3: #e3e0ec;
  --linie: #dcdada;
  --feld-rand: #8f8b9c;
  --feld-grund: #ffffff;
  --text: #3b3838;
  --leise: #66626b;
  --akzent: #6353e0;
  --akzent-dunkel: #5344cc;
  --akzent-deko: #6353e0;
  --akzent-hauch: #ebe8fc;
  --auf-akzent: #ffffff;
  --link: #5344cc;
  --fehler: #b3261e;
  --fehler-grund: #fdecea;
  --fehler-text: #7a1a14;
  --kachel: #ffffff;
  --kachel-rand: #dcdada;
  --schatten: 0 0 24px -8px rgba(0, 0, 0, .2);
  --schatten-knopf: 0 6px 16px -6px rgba(99, 83, 224, .55);
  --fokus-ring: 0 0 0 3px rgba(99, 83, 224, .28);
  /* Zustaende (JTI-Dashboard): Farbe nie allein, der Text sagt es immer */
  --ok: #1f9d63;
  --ok-grund: #dcf5e8;
  --ok-text: #126b43;
  --warn: #9a5b00;
  --warn-grund: #fff1d6;
  --warn-text: #8a5300;
}

[data-theme="dark"] {
  color-scheme: dark;
  --grund: #17161c;
  --grund-2: #211f29;
  --grund-3: #2d2a38;
  --linie: #3a3745;
  --feld-rand: #7d7990;
  --feld-grund: #121116;
  --text: #ecebf0;
  --leise: #aaa7b6;
  --akzent: #a99cff;
  --akzent-dunkel: #9585f5;
  --akzent-deko: #a99cff;
  --akzent-hauch: #2b2745;
  --auf-akzent: #16132a;
  --link: #bdb3ff;
  --fehler: #ff8a8a;
  --fehler-grund: rgba(255, 138, 138, .12);
  --fehler-text: #ffc4c4;
  --kachel: #211f29;
  --kachel-rand: #3a3745;
  --schatten: 0 0 24px -8px rgba(0, 0, 0, .6);
  --schatten-knopf: 0 6px 16px -6px rgba(0, 0, 0, .6);
  --fokus-ring: 0 0 0 3px rgba(169, 156, 255, .35);
  --ok: #5fd19a;
  --ok-grund: rgba(60, 200, 130, .16);
  --ok-text: #8ee6b8;
  --warn: #ffd28a;
  --warn-grund: rgba(255, 190, 90, .16);
  --warn-text: #ffd28a;
}

:root {
  /* Schrift: Carlito, selbst ausgeliefert (statisch/schrift/, Lizenz SIL OFL), kein Google Fonts */
  --schrift: "Carlito", Calibri, "Segoe UI", system-ui, -apple-system, sans-serif;
  --radius: 14px;
  --radius-feld: 14px;
  --radius-flaeche: 32px;
  --radius-knopf: 800px;
  --ziel: 48px;
  --feld-hoehe: 48px;
  /* Bewegung: Bedienelemente 160 ms */
  --dauer-kurz: .16s;
  --dauer-flaeche: .3s;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}