/* =====================================================================
   tokens.css — Design-Tokens (Single Source of Truth)
   ---------------------------------------------------------------------
   Diese Datei definiert ALLE Farb-/Layout-Variablen — einmal fuer Light
   (:root) und einmal fuer Dark (html[data-theme="dark"]). Sie wird als
   ERSTE Stylesheet-Datei im <head> geladen (vor theme.css, components.css
   und allen Page-Styles), damit jede nachfolgende Regel auf die Tokens
   zugreifen kann.

   Zwei Variablen-Familien (historisch gewachsen, hier vereint):
     --theme-*  — von Sidebar, Toolbar, Modals, theme.css genutzt
     --c-*      — von den Page-<style>-Bloecken genutzt (Admin, Einsaetze …)
   Beide werden hier zentral gepflegt. Pages, die noch ein eigenes
   :root { --c-… } inline definieren, ueberschreiben diese Defaults (die
   Migration entfernt die Inline-Bloecke schrittweise — danach erben sie
   automatisch von hier).

   Design ⟂ Funktionalitaet: Wer das Erscheinungsbild aendern will, fasst
   NUR diese Datei an. Struktur/Layout/Verhalten liegt in theme.css +
   components.css.
   ===================================================================== */

:root {
    /* ---- Typografie ----
       Basis-Schriftfamilie. Pages nutzen sie via var(--font-base); ein
       eigenes Theme (T3) kann sie ueberschreiben. Default = bisheriger
       System-Font-Stack (keine Sicht-Aenderung). */
    --font-base: system-ui, -apple-system, "Segoe UI", sans-serif;

    /* ---- Mono-Schrift (Einsatznummern, Codes, Aliasse) ----
       Zentral, damit die Mono-Einsatznummer (Design „Mischung") und
       .alias/.key-mono dieselbe Familie nutzen. */
    --font-mono: ui-monospace, "SFMono-Regular", "Consolas", Menlo, monospace;

    /* ---- Spacing-Skala ----
       Einheitliche Abstaende statt verstreuter px-Werte. */
    --sp-xs: 4px;
    --sp-sm: 8px;
    --sp-md: 12px;
    --sp-lg: 16px;
    --sp-xl: 24px;

    /* ---- Radius-Skala ----
       #189: --radius-sm auf 6px (haeufigster hartkodierter Wert im Bestand,
       frueher 5px). --radius-xs fuer die kleinen 3-4px-Ecken (Chips/Swatches),
       --radius-pill fuer voll gerundete Pillen/Toggles. */
    --radius-xs: 4px;
    --radius-sm: 6px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-pill: 999px;

    /* ---- Shadow-Skala (Light) ----
       Loest hartkodierte Modal-/Karten-Schatten ab. Dark-Werte im
       Dark-Block. */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 8px 28px rgba(0, 0, 0, 0.16);

    /* ---- z-index-Leiter (#189/5d) — Single Source of Truth ----
       Kompakte, benannte Stapel-Ebenen statt verstreuter
       999/1000/1100/1200/1300/9990/9999/10000-Literale. NEUE z-index-Werte
       NUR hier als Token ergaenzen. Kernregel: --z-toast liegt bewusst UEBER
       Drawer, SP-Rahmen und allen Modals (schwebendes Feedback darf nie
       verdeckt werden); darueber nur --z-critical (transiente Top-Layer:
       Confirm-Dialog, Touch-Drag-Ghost, Tap-Picker, Bild-Lightbox).
       z-index ist theme-unabhaengig -> nur hier, kein Dark-Override. */
    --z-sticky:          30;   /* sticky Filter-/Bulk-Leiste            */
    --z-map-control:    500;   /* Karten-Buttons/Legenden (ueber Leaflet) */
    --z-map-overlay:    600;   /* Karten-Panels/Toggles                 */
    --z-drawer-topbar:  900;   /* Mobil-Topbar + Hilfe-Schublade        */
    --z-drawer-backdrop: 1000; /* Backdrop des Mobil-Nav-Drawers        */
    --z-drawer:         1001;  /* Mobil-Nav-Drawer                      */
    --z-modal-backdrop: 1100;  /* reserviert: separater Modal-Dimmer    */
    --z-modal:          1200;  /* Inhalts-Modals + Karten-Lightbox      */
    --z-sheet:          1300;  /* Modal ueber Modal (Abschnitts-Sperre) */
    --z-sp-frame:       1400;  /* Schwerpunkt-Seitenrahmen              */
    --z-toast:          1500;  /* schwebende Toasts                     */
    --z-critical:       1600;  /* Confirm-Dialog, Drag-Ghost, Tap-Picker, Bild-Lightbox */

    /* ---- Typo-Skala ----
       Konsistente Schriftgroessen + Heading-Hierarchie. #189: die im Bestand
       mit Abstand haeufigsten realen Basisgroessen 13px (224x) und 12px (166x)
       als echte Tokens ergaenzt (fs-13/fs-12), damit die Seiten von den harten
       px-Werten darauf umgestellt werden koennen. */
    --fs-xs:   11px;
    --fs-12:   12px;
    --fs-sm:   12.5px;
    --fs-13:   13px;
    --fs-base: 14px;
    --fs-md:   16px;
    --fs-lg:   18px;
    --fs-xl:   22px;
    --fs-2xl:  28px;   /* #210: Kennzahlen der Wetterseite — vom Beamer aus vier Metern lesbar */
    --fs-h1:   var(--fs-xl);
    --fs-h2:   var(--fs-lg);
    --fs-h3:   var(--fs-md);

    /* ---- Zentrale Breakpoints (Referenz) ----
       Eine Quelle der Wahrheit fuer die heute verstreuten Media-Queries
       (Konsolidierung in Etappe 6). ACHTUNG: @media kann var() NICHT
       lesen — dort die dokumentierten Literale verwenden; diese
       Custom-Properties dienen Referenz + JS (matchMedia). */
    --bp-sm: 480px;
    --bp-md: 760px;
    --bp-lg: 1024px;

    /* ---- Identitaets-Akzent (dezentes Feuerwehr-Rot) ----
       Design „Mischung": Marken-/Aktiv-Akzent (Logo, aktive Elemente).
       BEWUSST getrennt von der Status-/Alarm-Semantik (--c-error,
       --c-einsatz) — identisch in Hell + Dunkel. */
    --c-identity:        #c8102e;
    --c-identity-strong: #a00d24;
    --c-identity-fg:     #ffffff;
    --c-identity-text:   var(--c-identity);  /* Rot als Vordergrund — Light ok (5.9:1); Dark aufgehellt s.u. */

    /* ---- Theme-Tokens (Light) ---- */
    --theme-bg:              #f3f3f3;
    --theme-card:            #ffffff;
    --theme-card-hover:      #fafbfc;
    --theme-border:          #d6d6d6;
    --theme-border-light:    #ececec;
    --theme-fg:              #1b2530;
    --theme-fg-strong:       #0e2538;
    --theme-muted:           #404a58;
    --theme-link:            #c8102e;
    --theme-link-hover:      #a00d24;
    --theme-input-bg:        #ffffff;
    --theme-input-border:    #d6d6d6;
    --theme-code-bg:         #f3f5f8;
    --theme-code-fg:         #2c3e50;
    /* Read-only EM-Meta-Kapsel (Staerke/Kontakt), #177 — vorher hart
       rgba(255,255,255,0.7)/rgba(0,0,0,0.08), im Dark unlesbar. */
    --theme-em-meta-bg:      rgba(255,255,255,0.7);
    --theme-em-meta-border:  rgba(0,0,0,0.08);
    --theme-toast-ok-bg:     #e8f8ec;
    --theme-toast-ok-fg:     #0e6b30;
    --theme-toast-ok-border: #b6e2c2;
    --theme-toast-err-bg:    #fff0ee;
    --theme-toast-err-fg:    #c0392b;
    --theme-toast-err-border:#f1c0bc;
    --theme-toast-warn-bg:   #fff8e6;
    --theme-toast-warn-fg:   #6f4f00;
    --theme-toast-warn-border:#f3d97a;
    --theme-shadow:          0 1px 2px rgba(0, 0, 0, 0.03);
    /* Angehobener Zustand (Kachel unter dem Zeiger, translateY(-2px)). Die
       Skala --shadow-* passt hier nicht: deren md/lg sind Ruhe-Schatten fuer
       Karten und Modals, nicht die flache, weite Anhebung. Wert = der bisherige
       Hartcode aus admin/index.php (1:1), damit sich im Hellmodus nichts
       aendert; der Dark-Wert holt nach, was 0.08 Schwarz auf dunkler Karte nie
       zeigen konnte. */
    --theme-shadow-hover:    0 6px 18px rgba(0, 0, 0, 0.08);

    /* Sidebar-Chrome — Default dunkel (Fokus-Anker), aber als vollstaendiger
       Token-Satz gepflegt, damit ein Theme die Seitenleiste umfaerben kann
       (T3). Gelten in Hell + Dunkel gleich, solange ein Theme sie nicht
       ueberschreibt. Werte = bisherige Hartcodes aus renderCss (1:1). */
    --theme-sidebar-bg:        #1f2933;
    --theme-sidebar-brand-bg:  #2c3640;
    --theme-sidebar-brand-fg:  #ffffff;
    --theme-sidebar-fg:        #d8dee5;
    --theme-sidebar-fg-strong: #ffffff;
    --theme-sidebar-fg-dim:    #7f8c8d;
    --theme-sidebar-border:    #2c3640;
    --theme-sidebar-hover-bg:  #2c3640;
    --theme-sidebar-active:     var(--c-identity);  /* Feuerwehr-Rot als Aktiv-Nav-Akzent (Default; Org-Branding-Sekundaerfarbe ueberschreibt) */
    --theme-sidebar-btn-border:       #3a4651;
    --theme-sidebar-btn-border-hover: #4a5a68;
    /* Sidebar im Schwerpunkt-Modus */
    --theme-sidebar-sp-accent:       #229954;
    --theme-sidebar-sp-brand-bg:     #1d4d2f;
    --theme-sidebar-sp-brand-border: #226e3a;
    --theme-sidebar-sp-text:         #d4e9d8;
    /* Helle Plakette hinter dem Menue-Logo — damit ein (transparentes)
       Logo auf JEDER Sidebar-Farbe sauber sitzt (T4). */
    --theme-sidebar-logo-plate:      #ffffff;

    /* ---- Page-Tokens (Light) ----
       Der gemeinsame Satz, den ~37 Page-<style>-Bloecke bisher identisch
       dupliziert haben. Jetzt einmal hier. */
    --c-bg:        #eef1f5;
    --c-card:      #ffffff;
    --c-border:    #d6d6d6;
    --c-border-l:  #ececec;
    --c-fg:        #1b2530;
    --c-muted:     #404a58;
    --c-primary:   #c8102e;
    --c-error:     #c0392b;
    --c-success:   #229954;
    --c-warn:      #e98011;
    --c-on-warn:   #3a2703;   /* dunkle Schrift auf --c-warn (Badges/Pills), WCAG-sicher */
    --c-on-primary: #ffffff;  /* Schrift auf --c-primary — hier das Marken-Rot, Weiss traegt */
    --c-ok:        #229954;

    /* ---- Komponenten-Sonderfarben (Light) ----
       Genutzt von components.css-Bausteinen (S2-Refactoring). */
    --c-btn-soft-bg:    #fafafa;   /* Sekundaer-Button (.btn-link) */
    --c-btn-soft-hover: #eeeeee;
    --c-chip-on-bg:     #fbe7ea;   /* angewaehlter Auswahl-Chip (.ort-chip) — hellroter Tint (Identitaet) */
    --c-toast-float-bg: #2c3e50;   /* schwebender Feedback-Toast (.toast-float) */
    /* Inline-EM-Toast (index.php, edit.php): gedaempftes Dunkel-Slate mit
       weissem Text — in beiden Themes kontrastreiches Floating-Overlay. */
    --c-toast-bg:       #2c3e50;
    --c-toast-fg:       #ffffff;

    /* ---- EM-Status-Farben ----
       Einsatzmittel-Status (einsatzmittel.php; Lagekarte nutzt eigene
       Werte). Kraeftige Signalfarben — bewusst identisch in Light+Dark. */
    --c-frei:       #229954;   /* frei / verfuegbar */
    --c-dispo:      #27ae60;   /* in Dispo (etwas helleres Gruen) */
    --c-anfahrt:    #e98011;   /* auf Anfahrt */
    --c-einsatz:    #cb4335;   /* im Einsatz */
    --c-haus:       #34495e;   /* aus Einsatz entlassen (dunkelgrau) */
    --c-haus-light: #7f8c8d;   /* nicht eingesetzt (mittelgrau) */
    --c-unknown:    #7f8c8d;   /* Status unbekannt */

    /* ---- Lagekarte-Status-Marker-Farben ----
       Auch von .status-pill .dot (components.css) genutzt — daher GLOBAL in
       tokens.css (frueher nur in lagekarte.css, dort undefiniert auf anderen
       Seiten). Signalfarben, identisch in Light+Dark. */
    --c-st-green:     #229954;
    --c-st-green-alt: #27ae60;
    --c-st-red:       #cb4335;
    --c-st-red-alt:   #d35400;
    --c-st-orange:    #e98011;
    --c-st-violet:    #7d3c98;
    /* MAYDAY (FwDV 7) — die Notlage eines Atemschutztrupps.

       EINE EIGENE FARBE, WEIL ES EINE EIGENE AUSSAGE IST. Michael,
       10.09.2026: „Es muss sich dabei von den Darstellungen mit niedrigem
       Druck usw. unterscheiden." Rot sagt auf dieser Tafel bereits drei
       Dinge — Rückzugsdruck erreicht, Abfrage überfällig, Einsatz läuft.
       Ein viertes Rot wäre kein Signal mehr, sondern Rauschen.

       #6b21a8 statt des vorhandenen `--c-st-violet` (#7d3c98): Auf
       `--c-card` (#fff) sind das 8,72:1 statt 7,07:1 — die Farbe trägt hier
       auch Text (die Pille), nicht nur einen Rahmen. Die Dunkel-Fassung
       steht weiter unten bei den übrigen Dunkel-Tokens.

       (Die Zahlen standen bis zur Abnahme am 10.09.2026 falsch hier — 7,6
       und 6,0, beide zu niedrig geschätzt. Kommentare sind Prüfeingabe:
       Wer hier nachrechnet, rechnet gegen das, was dasteht.) */
    --c-mayday:       #6b21a8;
    /* Und die Schrift darauf. Ein festes `#fff` ginge hier gut und im
       Dunkelmodus gar nicht — dort ist `--c-mayday` aufgehellt, und Weiß
       darauf käme auf 2,64:1, also unter jede Grenze. Zwei Tokens, wie bei
       allen Flächenfarben dieses Projekts (siehe `ColorContrast`). */
    --c-mayday-fg:    #fff;
    --c-st-gray:      #95a5a6;

    /* ---- Rueckmeldungen (#182) ----
       EIGENE Familie, bewusst nicht die --c-st-* daneben: Die sitzen als
       Punkte und Marker AUF hellem Grund. Diese hier sind Vollton-FLAECHEN
       mit WEISSEM Text — Kacheln, Pillen, spaeter der Alarmmonitor. Das ist
       eine andere Kontrastbedingung, und sie war verletzt.

       Vorher standen die Werte als sieben Hex-Zahlen in einem ungescopten
       :root-Block mitten in dashboard.php, ohne Dunkel-Fassung. Drei davon
       hielten WCAG 1.4.3 nicht ein (Weiss darauf): Gruen #229954 = 3,65:1,
       Blau #2980b9 = 4,30:1, Grau #7f8c8d = 3,48:1 — noetig sind 4,5:1.

       Die Werte unten sind gegen Weiss nachgerechnet; der Kommentar nennt
       das Ergebnis, damit die naechste Anpassung nicht raten muss.

       IDENTISCH in Hell und Dunkel, wie alle Signalfarben: Eine Zusage darf
       ihre Farbe nicht wechseln, nur weil jemand das Thema umstellt. */
    --c-antwort-komme:   #1e8449;   /* 4,72:1 auf Weiss */
    --c-antwort-est:     #1f6fa8;   /* 5,39:1 */
    --c-antwort-spaeter: #a85800;   /* 5,17:1 */
    --c-antwort-nicht:   #cb4335;   /* 4,78:1 */
    --c-antwort-lg:      #34495e;   /* 9,29:1 */
    --c-antwort-offen:   #5d6d7e;   /* 5,31:1 — auch der Rueckfall fuer
                                       selbst benannte Antworten */

    /* DIESELBEN Zustaende als VORDERGRUND (Kachel-Akzent, Icon).
       Die Werte oben sind fuer weissen Text DARAUF gerechnet und deshalb
       dunkel - auf dem dunklen Kartengrund verschwinden sie: Slate laege
       bei 1,6:1, Grau bei 2,9:1. Das Haus-Symbol der LG-Kachel waere
       praktisch unsichtbar, und damit faellt genau die Farbkodierung aus,
       die die Kacheln unterscheidbar macht (Review-Befund 8, 28.08.2026).
       Im hellen Thema sind sie identisch mit den Flaechenwerten. */
    --c-antwort-komme-fg:   var(--c-antwort-komme);
    --c-antwort-est-fg:     var(--c-antwort-est);
    --c-antwort-spaeter-fg: var(--c-antwort-spaeter);
    --c-antwort-nicht-fg:   var(--c-antwort-nicht);
    --c-antwort-lg-fg:      var(--c-antwort-lg);
    --c-antwort-offen-fg:   var(--c-antwort-offen);

    /* ---- DWD-Warnstufen (#210 Wetter-Modul) ----
       AMTLICHE Farben des Deutschen Wetterdienstes — Wiedererkennung geht vor
       Hausfarbe. Wie die --c-st-* identisch in Hell UND Dunkel.
       NIE als Hintergrund fuer Text verwenden: sie tragen Kante, Balken und
       Symbol, Text steht immer auf --c-card. Fuer die seltenen Faelle, in
       denen doch Text auf Vollton sitzt (Farb-Swatch), gibt es die -fg-Werte;
       sie stammen aus ColorContrast::textOn() und sind nicht geraten.
       ACHTUNG: Der DWD zaehlt GEGENLAEUFIG zu unseren MoWaS-Warnstufen (dort
       ist Stufe 1 die schlimmste). Beschriftungen kommen deshalb ausschliesslich
       aus WetterSchwere::label() und tragen immer das Praefix "DWD-". */
    --c-wetter-stufe0:    #9aa0a6;   /* Vorabinformation           */
    --c-wetter-stufe1:    #ffeb3b;   /* Stufe 1  Wetterwarnung     */
    --c-wetter-stufe2:    #ff9800;   /* Stufe 2  markantes Wetter  */
    --c-wetter-stufe3:    #e53935;   /* Stufe 3  Unwetterwarnung   */
    /* Stufe 4 war bis Welle 6 ein Lila (#8e24aa) — zu nah an der Hitzeskala
       darunter, die beim DWD ebenfalls violett ist. Der DWD selbst nimmt hier
       ein Bordeaux-Magenta; das trennt „extremes Unwetter" sauber von
       „Hitze" und ist zugleich naeher am Original. */
    --c-wetter-stufe4:    #af0064;   /* Stufe 4  extremes Unwetter */
    --c-wetter-stufe0-fg: #000;
    --c-wetter-stufe1-fg: #000;
    --c-wetter-stufe2-fg: #000;
    --c-wetter-stufe3-fg: #000;
    --c-wetter-stufe4-fg: #fff;

    /* ---- Warnarten mit EIGENER Skala (#210, Welle 6) ----
       Hitze und UV faerbt der DWD NICHT nach Schweregrad, sondern nach eigener
       Skala. Eine Hitzewarnung traegt CAP-`SEVERITY=Minor`; bis Welle 5 wurde
       daraus bei uns Stufe 1 und damit GELB, waehrend der DWD violett zeichnet
       — im August 2026 betraf das 66 von 67 bundesweit aktiven Warnungen.
       Werte aus dem amtlichen DWD-Kartenstil (WMS GetStyles, 09.08.2026).
       Entschieden wird in WetterWarnart::farbToken(), nicht hier. */
    --c-wetter-hitze:            #cc99ff;   /* starke Waermebelastung  (EC_II 247) */
    --c-wetter-hitze-extrem:     #9e46f8;   /* extreme Waermebelastung (EC_II 248) */
    --c-wetter-uv:               #fe68fe;   /* UV-Warnung                          */
    --c-wetter-hitze-fg:         #000;
    --c-wetter-hitze-extrem-fg:  #000;
    --c-wetter-uv-fg:            #000;

    /* ---- Temperaturskala (#210, Wetter-Rose + Kennzahlen) ----
       Vierzehn Stufen in Fuenf-Grad-Schritten von -25 bis +40. Der
       Helligkeitsverlauf bleibt V-foermig — die Enden dunkel, die Mitte hell —,
       damit die Reihenfolge auch in Graustufen ablesbar ist; die feineren
       Farbtoene liegen dort, wo die grobe Skala ueber zehn Grad hinweg
       praktisch dasselbe Weiss zeigte (Befund Klick-Test 07.08.2026).
       Benennung nach der UNTERGRENZE der Stufe: m25 = ab -25 Grad,
       p00 = ab 0 Grad, p40 = ab +40 Grad.
       Identisch in Hell und Dunkel (Signalfarben-Konvention wie --c-st-*).
       Die Stufen-Zuordnung liegt in src/WetterTemperatur.php, die
       JS-Entsprechung in wetter-karte.js — Schwellen dort und hier gleich
       halten. */
    --c-wetter-t-m25: #5b2c8a;   /* unter -25  strenger Frost                */
    --c-wetter-t-m20: #6f42b5;
    --c-wetter-t-m15: #4f5fc0;
    --c-wetter-t-m10: #3f7ad2;   /*       -10  Frost                         */
    --c-wetter-t-m05: #3f9ede;
    --c-wetter-t-p00: #3fbcd4;   /*         0  Gefrierpunkt                  */
    --c-wetter-t-p05: #4ecab0;
    --c-wetter-t-p10: #6fd48a;   /*        10  mild                          */
    --c-wetter-t-p15: #a7dc5e;
    --c-wetter-t-p20: #e0d64c;   /*        20  warm — hellster Bereich       */
    --c-wetter-t-p25: #f2b13f;
    --c-wetter-t-p30: #ee8837;   /*        30                                */
    --c-wetter-t-p35: #e0532c;
    --c-wetter-t-p40: #b81f2a;   /*        40  Hitzewarnung                  */

    /* Boeen. BEWUSST BLAU und nicht in der Tintenfarbe: die Zacken sitzen auf
       dem Windkeil, und Tinte auf Tinte ist im Hellmodus unsichtbar
       (Befund Klick-Test 07.08.2026). Blau trennt zugleich die Bedeutung —
       schwarz ist der Mittelwind, blau die Boe. */
    --c-wetter-boee: #1d4ed8;   /* Hellmodus: dunkles Blau, traegt auf heller Karte */

    /* ---- Listen-Chips (S4a: einsaetze/index.php, kuenftig view/abschnitt) ----
       Neutrale Info-Chips (EM-Zuordnung in Tabellenzellen, Kommentar-
       Badge) + Hover-Zustand "Klick entfernt". Dark-Werte stammen aus
       den frueheren theme.css-Overrides (1:1). */
    --c-chip-bg:           #eef3f7;
    --c-chip-border:       #d8dee5;
    --c-chip-fg:           #34495e;
    /* Digitaler-Zwilling-Karten-Chip (#175/AP7) — Gruen, abgesetzt von TIM
       (neutral) und HYD (gelb). Kontrast fg/bg 6.6:1 (AA). Dark s. u. */
    --c-mapbtn-dz-bg:      #e3f2ea;
    --c-mapbtn-dz-fg:      #14602f;
    --c-mapbtn-dz-border:  #b6ddc4;
    --c-chip-hover-bg:     #ffd9d4;
    --c-chip-hover-border: #f1c0bc;
    --c-chip-hover-fg:     #8a1f17;

    /* ---- Tabellen-Grundwerte (Listen-Seiten) ---- */
    --c-th-bg:      #fafafa;   /* Tabellen-Header-Hintergrund */
    --c-row-sel-bg: #fff8e1;   /* Bulk-selektierte Zeile (gelblich) */

    /* ---- Schwerpunkt-Akzent (gruen) ----
       SP-Pool-Chips, SP-Badge an Einsatzzeilen, SP-Tabellen-Kopf. */
    --c-sp-soft-bg:     #e8f5ec;
    --c-sp-border:      #b6e2c2;
    --c-sp-fg:          #0e6b30;
    --c-sp-head-bg:     #f0f7f2;
    --c-sp-head-border: #d6d6d6;
    --c-sp-row-hover:   #f7fafc;

    /* ---- Status-Pills (Einsatz-Status + Wichtigkeit-Fallback) ----
       bg/fg-Paare. Light = heller Pastell-Grund mit gesaettigtem Text,
       Dark = dunkel-tonaler Grund mit hellem Akzent (Werte identisch zu
       den bestehenden theme.css-Pill-Overrides, die fuer die noch nicht
       migrierten Seiten weiterbestehen — NICHT auseinanderdriften
       lassen!). Wichtigkeit: eilig nutzt s3-, gross s4-Toene. */
    --c-pill-neu-bg:           #d4eaff;
    --c-pill-neu-fg:           #003a80;
    --c-pill-dispo-bg:         #dff6e3;
    --c-pill-dispo-fg:         #1f6f3a;
    --c-pill-s3-bg:            #fff0d8;
    --c-pill-s3-fg:            #a85800;
    --c-pill-s4-bg:            #ffd9d4;
    --c-pill-s4-fg:            #8a1f17;
    --c-pill-erledigt-bg:      #e5e5e5;
    --c-pill-erledigt-fg:      #555555;
    --c-pill-beantragt-bg:     #ffe6e6;
    --c-pill-beantragt-fg:     #8a1f17;
    --c-pill-beantragt-border: #cb4335;
    --c-pill-abgeschlossen-bg: #2c3e50;
    --c-pill-abgeschlossen-fg: #ffffff;
    --c-pill-normal-bg:        #eaf0f6;
    --c-pill-normal-fg:        #34495e;
    --c-pill-muted-bg:         #f3f5f8;
    /* Admin-Rollen-Pills (Light-Defaults; Dark s.u.). Vorsorglich zentral —
       bislang nur users.php inline (Light), Dark global in theme.css. */
    --c-pill-admin-bg:         #2c3e50;
    --c-pill-admin-fg:         #ffffff;
    --c-pill-lage-bg:          var(--c-pill-neu-bg);
    --c-pill-lage-fg:          var(--c-pill-neu-fg);

    /* ---- Chrome: Header / Toolbar / Banner (Light) ----
       Werte = bisherige Hartcodes aus MainNavSidebar::renderCss (1:1),
       jetzt als Tokens — Voraussetzung fuer themebare Chrome (T3). */
    --c-crumb-sep:           #b0b6bd;
    --c-toolbar-hover-bg:    #f3f5f8;
    --c-personal-pill-bg:    #1f6f3a;
    /* Schwerpunkt-Banner (Streifen ueber der Toolbar) */
    --c-sp-banner-bg:        #e8f5ec;
    --c-sp-banner-bg2:       #f4faf6;
    --c-sp-banner-border:    #b6e2c2;
    --c-sp-banner-accent:    #229954;
    --c-sp-banner-title:     #0e6b30;
    --c-sp-banner-meta:      #5f6b7a;
    --c-sp-banner-btn-bg:    #ffffff;
    /* Schema-/Feature-Banner */
    --c-schema-admin-bg:     #fff5e0;
    --c-schema-admin-border: #f0c674;
    --c-schema-admin-fg:     #6f4f00;
    --c-schema-admin-btn:    #6f4f00;
    --c-schema-admin-btn-hover: #4a3500;
    --c-schema-user-bg:      #fdf2f2;
    --c-schema-user-border:  #e7b8b8;
    --c-schema-user-fg:      #6b1f1f;

    /* ---- Status-Kachel (Design „Mischung": gesaettigte Statusfarbe + Mono-Nummer) ----
       Inverse zu den Pastell-Status-Pills (--c-pill-*): kraeftiger Grund,
       heller Text. Feste Kachel links an Listen-/Detail-Zeilen + (kuenftig)
       Lagekarte-Marker. Signalfarben — in Hell + Dunkel nahezu gleich. */
    --c-kachel-fg:               #ffffff;
    /* Light-Mode bewusst gedaempfter/weniger grell als Dark (User-Feedback):
       Blau + Orange ueberstrahlten auf hellem Grund. Weiterhin weiss-text-fest
       (Luminanz niedrig genug fuer >= 4.5:1). Dark-Werte (unten) unveraendert. */
    --c-kachel-neu-bg:           #3f63a0;
    --c-kachel-dispo-bg:         #2a7548;
    --c-kachel-bearb-bg:         #b0562f;
    --c-kachel-erledigt-bg:      #6b7280;
    --c-kachel-abgeschlossen-bg: #334155;

    /* ---- Alarm-Regel-Chips (admin/alarm-regeln.php) ----
       Trigger-Stichwort (blau) + Wildcard (gruen) + An/Aus-Pills. Loesen die
       hartkodierten Hex der Inline-Styles ab (Etappe 6.2). */
    --c-chip-trigger-bg:      #eaf3ff;
    --c-chip-trigger-fg:      #0056b3;
    --c-chip-trigger-border:  #b6d4fe;
    --c-chip-wildcard-bg:     #e2f3df;
    --c-chip-wildcard-fg:     #2c6e1d;
    --c-chip-wildcard-border: #b5d8a0;
}

/* =====================================================================
   Dark-Theme — Override auf html[data-theme="dark"]
   ===================================================================== */
html[data-theme="dark"] {
    /* ---- Rueckmeldungen: Vordergrund-Fassung (Kachel-Akzent, Icon) ----
       Die Flaechenwerte (--c-antwort-*) bleiben unveraendert - eine Zusage
       soll ihre Farbe nicht wechseln, nur weil jemand das Thema umstellt.
       Als VORDERGRUND auf #20262d sind sie aber zu dunkel: Slate laege bei
       1,6:1 und waere praktisch unsichtbar. Aufgehellte Zwillinge, gleiche
       Farbfamilie, damit die Kodierung erkennbar bleibt. */
    --c-antwort-komme-fg:   #4fd18a;
    --c-antwort-est-fg:     #63b3e8;
    --c-antwort-spaeter-fg: #e9a64f;
    --c-antwort-nicht-fg:   #f0766a;
    --c-antwort-lg-fg:      #a9bccf;
    --c-antwort-offen-fg:   #8fa0b1;

    /* ---- Theme-Tokens (Dark) ---- */
    --theme-bg:              #161a1e;
    --theme-card:            #20262d;
    --theme-card-hover:      #262d35;
    --theme-border:          #2f3742;
    --theme-border-light:    #2a3038;
    --theme-fg:              #e1e6ec;
    --theme-fg-strong:       #ffffff;
    --theme-muted:           #8a95a3;
    --theme-link:            #ff6b7d;
    --theme-link-hover:      #ff97a5;
    --theme-input-bg:        #1a1f25;
    --theme-input-border:    #3a4651;
    --theme-code-bg:         #2a3038;
    --theme-code-fg:         #d8dee5;
    --theme-em-meta-bg:      rgba(255,255,255,0.10);
    --theme-em-meta-border:  rgba(255,255,255,0.18);
    --theme-toast-ok-bg:     #1a3a25;
    --theme-toast-ok-fg:     #7ed096;
    --theme-toast-ok-border: #2d5a3d;
    --theme-toast-err-bg:    #3a1a18;
    --theme-toast-err-fg:    #ff8a7a;
    --theme-toast-err-border:#6b2a25;
    --theme-toast-warn-bg:   #3a2f10;
    --theme-toast-warn-fg:   #e8c47a;
    --theme-toast-warn-border:#5c4818;
    --theme-shadow:          0 1px 2px rgba(0, 0, 0, 0.4);
    /* Gleiche Geometrie wie im Hellmodus, aber mit dark-tauglicher Deckkraft
       (Einordnung in die Reihe 0.4 / 0.5 / 0.6 der Shadow-Skala unten). */
    --theme-shadow-hover:    0 6px 18px rgba(0, 0, 0, 0.5);

    /* ---- Shadow-Skala (Dark) ---- */
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 2px 10px rgba(0, 0, 0, 0.5);
    --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.6);

    /* Identitaets-Rot als Vordergrund im Dark aufhellen — #c8102e waere
       nur ~2.6:1 auf dunkler Card. Marken-bg (--c-identity /
       .identity-accent-bg) bleibt das satte Rot. */
    --c-identity-text: #ff6b7d;

    /* ---- Page-Tokens (Dark) ----
       Damit Pages, die --c-* nutzen, automatisch dunkeln — ob sie ihren
       Inline-:root schon abgegeben haben oder nicht. */
    --c-bg:        var(--theme-bg);
    --c-card:      var(--theme-card);
    --c-border:    var(--theme-border);
    --c-border-l:  var(--theme-border-light);
    --c-fg:        var(--theme-fg);
    --c-muted:     var(--theme-muted);
    --c-primary:   var(--theme-link);
    --c-error:     #ff8a7a;
    --c-success:   #7ed096;
    --c-warn:      #e8c47a;
    --c-on-warn:   #3a2703;   /* dunkle Schrift auf --c-warn (Amber) — hoher Kontrast */
    /* DUNKEL, nicht weiss: --c-primary ist im Dark `var(--theme-link)`, also
       das aufgehellte #ff6b7d. Es ist als Schriftfarbe auf dunklem Grund
       gedacht; als FLAECHE braucht es dunkle Schrift darauf. Weiss kam auf
       2,74:1 und fiel damit sogar durch die 3:1 fuer Nicht-Text
       (UX-Befund B2, 22.08.2026). */
    --c-on-primary: #161a1e;
    --c-ok:        #7ed096;

    /* ---- Komponenten-Sonderfarben (Dark) ---- */
    --c-btn-soft-bg:    var(--theme-card-hover);
    --c-btn-soft-hover: #2a3038;
    --c-chip-on-bg:     #3a1a20;   /* angewaehlter Chip dunkel-tonal (roter Tint) — heller Text per Tokens lesbar */
    --c-toast-float-bg: #2c3e50;   /* Toast bleibt dunkel-slate in beiden Themes */
    /* EM-Toast im Dark: etwas helleres Slate fuer mehr Kontrast gegen
       den sehr dunklen Seitenhintergrund; Text bleibt weiss. */
    --c-toast-bg:       #3a4a5c;
    --c-toast-fg:       #ffffff;

    /* ---- EM-Status-Farben (Dark = Light, Signalfarben) ---- */
    --c-frei:       #229954;
    --c-dispo:      #27ae60;
    --c-anfahrt:    #e98011;
    --c-einsatz:    #cb4335;
    --c-haus:       #34495e;
    --c-haus-light: #7f8c8d;
    --c-unknown:    #7f8c8d;
    /* MAYDAY im Dunkelmodus: aufgehellt, sonst verschwindet das Lila auf
       dunklem Grund fast im Rahmen. #c084fc auf `--c-card` (#20262d) =
       5,77:1. */
    --c-mayday:     #c084fc;
    --c-mayday-fg:  #2a0a40;   /* 6,54:1 auf #c084fc */

    /* ---- Listen-Chips (Dark) — Werte aus den frueheren theme.css-
       Overrides der Einsatz-Liste. Hover bewusst BLAU (Bestand). */
    --c-chip-bg:           var(--theme-card-hover);
    --c-chip-border:       var(--theme-border);
    --c-chip-fg:           var(--theme-fg);
    /* Digitaler-Zwilling-Karten-Chip (Dark, #175/AP7) — Kontrast fg/bg 8.3:1. */
    --c-mapbtn-dz-bg:      #16331f;
    --c-mapbtn-dz-fg:      #82dba3;
    --c-mapbtn-dz-border:  #2c5e3c;
    --c-chip-hover-bg:     #2a3550;
    --c-chip-hover-border: #2a5680;
    --c-chip-hover-fg:     #88c4ff;

    /* ---- Tabellen-Grundwerte (Dark) ---- */
    --c-th-bg:      var(--theme-card);
    --c-row-sel-bg: #3a2f10;

    /* ---- Schwerpunkt-Akzent (Dark) ---- */
    --c-sp-soft-bg:     #1d3a26;
    --c-sp-border:      #34663d;
    --c-sp-fg:          #9bd685;
    --c-sp-head-bg:     #1d3a26;
    --c-sp-head-border: #2a5638;
    --c-sp-row-hover:   rgba(255, 255, 255, 0.04);

    /* ---- Status-Pills (Dark) — identisch zu den theme.css-Pill-
       Overrides (Konsistenz-Pflicht, s. Light-Block). ---- */
    --c-pill-neu-bg:           #1a3550;
    --c-pill-neu-fg:           #88c4ff;
    --c-pill-dispo-bg:         #1d3a26;
    --c-pill-dispo-fg:         #7ed096;
    --c-pill-s3-bg:            #3a2f10;
    --c-pill-s3-fg:            #e8c47a;
    --c-pill-s4-bg:            #3a1a18;
    --c-pill-s4-fg:            #ff8a7a;
    --c-pill-erledigt-bg:      #2a3038;
    --c-pill-erledigt-fg:      #949fad; /* #M4: 4.96:1 auf -bg (vorher #8a95a3 = 4.38:1, unter AA 4.5) */
    --c-pill-beantragt-bg:     #3a1a18;
    --c-pill-beantragt-fg:     #ff8a7a;
    --c-pill-beantragt-border: #6b2a25;
    --c-pill-abgeschlossen-bg: #0e1a26;
    --c-pill-abgeschlossen-fg: #d8dee5;
    --c-pill-normal-bg:        #2a3038;
    --c-pill-normal-fg:        #c4d1dc;
    --c-pill-muted-bg:         #272c33; /* leicht abgedunkelt: --c-muted-Text erreicht so >=4.5:1 (WCAG 1.4.3) im Dark-Mode */
    --c-pill-admin-bg:         #1f1f2e;
    --c-pill-admin-fg:         #d6c7ff;
    --c-pill-lage-bg:          var(--c-pill-neu-bg);
    --c-pill-lage-fg:          var(--c-pill-neu-fg);

    /* ---- Chrome: Header / Toolbar / Banner (Dark) ----
       Werte = bisherige theme.css-Dark-Overrides (1:1). Die dortigen
       Override-Bloecke fuer sp-banner/schema-banner werden in T2 entfernt,
       sobald renderCss diese Tokens nutzt. Sidebar-Tokens bleiben bewusst
       OHNE Dark-Override (Seitenleiste ist heute in beiden Modi gleich). */
    --c-sp-banner-bg:        #1d4d2f;
    --c-sp-banner-bg2:       #1a3f28;
    --c-sp-banner-border:    #226e3a;
    --c-sp-banner-accent:    #34c759;
    --c-sp-banner-title:     #9bd685;
    --c-sp-banner-meta:      #b5d8a0;
    --c-sp-banner-btn-bg:    rgba(255, 255, 255, 0.08);
    --c-schema-admin-bg:     #3a2f10;
    --c-schema-admin-border: #5c4818;
    --c-schema-admin-fg:     #e8c47a;
    --c-schema-admin-btn:    #6b5012;
    --c-schema-user-bg:      #3a1a18;
    --c-schema-user-border:  #6b2a25;
    --c-schema-user-fg:      #ff8a7a;

    /* ---- Status-Kachel (Dark — satte Signalfarben, leicht abgedunkelt) ---- */
    --c-kachel-fg:               #ffffff;
    --c-kachel-neu-bg:           #2563eb;
    --c-kachel-dispo-bg:         #15803d;
    --c-kachel-bearb-bg:         #c2410c;
    --c-kachel-erledigt-bg:      #4b5563;
    --c-kachel-abgeschlossen-bg: #1e293b;

    /* ---- Alarm-Regel-Chips (Dark) ---- */
    --c-chip-trigger-bg:      #15243a;
    --c-chip-trigger-fg:      #88c4ff;
    --c-chip-trigger-border:  #2a4d73;
    --c-chip-wildcard-bg:     #16301a;
    --c-chip-wildcard-fg:     #9bd685;
    --c-chip-wildcard-border: #2f5a35;
}
