/* Dunkle Schemata Glut und Schiefer (Mike, 16.10.2026) — VERSUCH auf fantabana, aufgesetzt auf das heutige main.css.

   Wählbar im Katalog (services/farbschema.py, DUNKEL); base.html setzt dann data-dunkel und data-bs-theme="dark" am <html>,
   ohne das Attribut wirkt diese Datei nicht. Entstanden im Musterblatt muster/farbschemen.html, das sie ebenfalls lädt.
   Die Form ist noch nicht entschieden (Paket P12, Gabelung A/B/C) — darum eine Datei daneben statt Umbau von main.css.

   Ein dunkles Schema ist mehr als eine Kopffarbe: Grund, Flächen, Felder, Schrift, Leise und die
   Aktivfarbe kehren sich um. main.css trägt dafür heute Variablen (--neu-*, --leise, --grund …) und daneben feste Werte
   (#fff, #444, white …). Die Variablen setzt der erste Block je Schema; was nur fest im CSS steht, holt der Block
   „Feste Werte" nach — seine Länge ist das Maß für den Umbau, den ein echtes dunkles Schema braucht.

   Glut — warm, aus der Ocker-Welt (Verwandte: Gruvbox). Schiefer — kühl, Blaugrau (Verwandte: Nord).
   Aktivfarbe in beiden ein aufgehelltes Ziegelrot: auf dunklem Grund braucht das Rot mehr Helligkeit (G4.14), bleibt aber
   die Farbe aus dem Logo (Regel 34). Kontraste (WCAG, gerechnet): Schrift ≥ 9:1, Leise und Aktiv ≥ 4,3:1 auf jeder Fläche. */

html[data-dunkel="glut"] {
  --d-grund: #1E1A16;  --d-flaeche: #27221D;  --d-feld: #352E27;  --d-kopf: #43372A;  --d-linie: #4A4037;
  --d-text: #EDE4D6;   --d-leise: #A99D8F;    --d-aktiv: #E8836B; --d-aktiv-hover: #F4A48F;  --d-band: #2C2620;
}
html[data-dunkel="schiefer"] {
  --d-grund: #1B2026;  --d-flaeche: #232A31;  --d-feld: #2E363F;  --d-kopf: #33404C;  --d-linie: #3F4955;
  --d-text: #E5E9EE;   --d-leise: #9AA5B1;    --d-aktiv: #EE8A76; --d-aktiv-hover: #F7AC9C;  --d-band: #262E36;
}

/* --- die Variablen von main.css ---------------------------------------------------------------------------------- */
html[data-dunkel] {
  color-scheme: dark;
  --farb-t: 100%;
  --neu-A: var(--d-kopf);  --neu-text: var(--d-text);  --neu-D: var(--d-aktiv);  --neu-E: var(--d-aktiv-hover);
  --neu-Dlight: var(--d-feld);  --neu-grund: var(--d-grund);  --neu-krumen: var(--d-band);  --neu-such: var(--d-feld);
  --colorA: var(--d-kopf);  --colorTitle: var(--d-text);  --colorD: var(--d-aktiv);  --colorE: var(--d-aktiv-hover);
  --colorDlight: var(--d-feld);  --grund: var(--d-grund);  --krumen: var(--d-band);  --krumen-text: var(--d-text);
  --krumen-rand: var(--d-linie);  --zweit: var(--d-flaeche);  --such: var(--d-feld);  --such-text: var(--d-text);
  --kante: var(--d-aktiv);  --menu-rand: var(--d-linie);  --mvz-border: var(--d-linie);
  --leise: var(--d-leise);  --beschriftung: var(--d-leise);  --beschriftung-links: color-mix(in oklab, var(--d-text), var(--d-leise) 40%);
  --fehler: var(--d-aktiv);
  --bs-body-bg: var(--d-grund);  --bs-body-color: var(--d-text);  --bs-border-color: var(--d-linie);
  --bs-secondary-bg: var(--d-flaeche);  --bs-tertiary-bg: var(--d-flaeche);  --bs-emphasis-color: var(--d-text);
}

/* Rollen-Symbole (rollen-symbole.css): dieselben Farbtöne, auf L 0,74 aufgehellt — auf beiden Gründen ≥ 6,7:1 */
html[data-dunkel] {
  --sym-bund: #74AEF5;  --sym-region: #71BF8D;  --sym-lokal: #E5955F;  --sym-verw: #B599EC;  --sym-eigen: #E68AB0;
}

/* --- Feste Werte in main.css und custom.css, die keine Variable lesen ------------------------------------------- */
/* Jede Zeile hier ist eine Stelle, die für ein echtes dunkles Schema eine Variable braucht. */
html[data-dunkel] body { background: var(--d-grund); color: var(--d-text); }                       /* main.css: #fff-Verlauf */
html[data-dunkel] p { color: var(--d-text); }                                                        /* main.css: p #444 */
html[data-dunkel] .feld :is(input[type=text], input[type=date], input[type=email], input[type=url], input[type=number],
  input[type=tel], input[type=password], select, textarea) { background-color: var(--d-feld); }     /* Feld = --grund: im Dunkeln unsichtbar (W2) */
html[data-dunkel] .formular-tabs .nav-link { background: var(--d-flaeche); }                        /* Reiter: mit #fff gemischt */
html[data-dunkel] .formular-tabs .nav-link:hover { color: var(--d-text); background: color-mix(in oklab, var(--d-kopf), var(--d-flaeche) 40%); }
html[data-dunkel] .formular-tabs .nav-link.active,
html[data-dunkel] .formular-tabs .nav-link.active:hover { color: var(--d-text); background: var(--d-kopf); }   /* Schrift #2B2522 fest */
html[data-dunkel] .formular-tabs { border-bottom-color: var(--d-kopf); }
html[data-dunkel] .feld .wert select { background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23bbb' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e"); }   /* Pfeil #444 fest im SVG */
html[data-dunkel] .leaflet-tile-pane { filter: brightness(.78) saturate(.85); }                    /* Karte gedämpft, wie es dunkle Kartendienste tun */