/* Dunkelmodus (DESIGN 14). Überschreibt nur die --farbe-*-Variablen.
   Die Dunkel-Werte stehen bewusst zweimal: einmal für die feste Wahl "Dunkel",
   einmal für "Automatisch" (wirkt so auch ohne JavaScript). Nur @media screen:
   Beim Drucken bleiben die hellen Werte aus /theme.css. */
:root {
  color-scheme: light dark;
  --farbe-auf-warnung: #FFFFFF;
  --farbe-fokus-kopf: #C98BBD;
  --farbe-kopf-linie: transparent;
  --farbe-schatten: rgb(0 0 0 / .18);
  --farbe-abdunkeln: rgb(0 0 0 / .4);
}
:root[data-theme="light"] { color-scheme: light; }

@media screen {
  :root[data-theme="dark"] {
    color-scheme: dark;
    --farbe-hintergrund: #17191C;
    --farbe-flaeche: #202327;
    --farbe-text: #E8EAEC;
    --farbe-text-gedaempft: #A9AFB5;
    --farbe-linie: #3A3F45;
    --farbe-primaer: #DADDE0;
    --farbe-primaer-text: #17191C;
    --farbe-akzent: #C98BBD;
    --farbe-kopf-hintergrund: #0F1113;
    --farbe-kopf-text: #FFFFFF;
    --farbe-zeile-wechsel: #272B30;
    --farbe-warnung: #E3A64B;
    --farbe-fehler: #F2918A;
    --farbe-erfolg: #6FC48E;
    --farbe-auf-warnung: #17191C;
    --farbe-fokus-kopf: #C98BBD;
    --farbe-kopf-linie: #3A3F45;
    --farbe-schatten: rgb(0 0 0 / .5);
    --farbe-abdunkeln: rgb(0 0 0 / .6);
  }
}
@media screen and (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --farbe-hintergrund: #17191C;
    --farbe-flaeche: #202327;
    --farbe-text: #E8EAEC;
    --farbe-text-gedaempft: #A9AFB5;
    --farbe-linie: #3A3F45;
    --farbe-primaer: #DADDE0;
    --farbe-primaer-text: #17191C;
    --farbe-akzent: #C98BBD;
    --farbe-kopf-hintergrund: #0F1113;
    --farbe-kopf-text: #FFFFFF;
    --farbe-zeile-wechsel: #272B30;
    --farbe-warnung: #E3A64B;
    --farbe-fehler: #F2918A;
    --farbe-erfolg: #6FC48E;
    --farbe-auf-warnung: #17191C;
    --farbe-fokus-kopf: #C98BBD;
    --farbe-kopf-linie: #3A3F45;
    --farbe-schatten: rgb(0 0 0 / .5);
    --farbe-abdunkeln: rgb(0 0 0 / .6);
  }
}