/*
 * Fallwerk – semantische Farben für Hell und Dunkel (D1a, verbindlich nach docs/DESIGN_SYSTEM.md)
 *
 * Jede Farbrolle steht genau einmal als light-dark(hell, dunkel). Der Zweig richtet sich nach color-scheme:
 *   data-theme="system"  -> light dark (folgt prefers-color-scheme ausschließlich per CSS)
 *   data-theme="light"   -> light
 *   data-theme="dark"    -> dark
 * Ohne Attribut gilt der Systemmodus. Die Akzentfarben (primary, link, nav-current) stehen in accents.css.
 * Statusfarben, Fokusfarbe und Neutralflächen sind unabhängig von der Akzentpalette.
 */
:root {
  color-scheme: light dark;

  /* Flächen */
  --color-background: light-dark(#f5f7f8, #0f1519);
  --color-surface: light-dark(#ffffff, #161f25);
  --color-surface-raised: light-dark(#ffffff, #1e2a31);
  --color-surface-muted: light-dark(#eef1f3, #1b252c);
  --color-field: light-dark(#ffffff, #0d1317);

  /* Rahmen: border dekorativ, border-strong für Bedienelemente (mindestens 3:1) */
  --color-border: light-dark(#c5ced3, #34434c);
  --color-border-strong: light-dark(#7b8a94, #7f909a);

  /* Text */
  --color-text: light-dark(#1b2a33, #e6edf1);
  --color-text-muted: light-dark(#4a5a64, #a9b8c1);

  /* Status: unabhängig von der Akzentpalette, nie allein über Farbe vermittelt */
  --color-success: light-dark(#1e6b3a, #6fcf8f);
  --color-success-soft: light-dark(#e6f2ea, #12301e);
  --color-warning: light-dark(#8a5a00, #f0b94d);
  --color-warning-soft: light-dark(#fbf1dc, #3a2b08);
  --color-danger: light-dark(#a32323, #ff8f8f);
  --color-danger-soft: light-dark(#fbe9e9, #3d1717);
  --color-info: light-dark(#1f4e8c, #8ab8f5);
  --color-info-soft: light-dark(#e6eef8, #14283f);
  --color-on-danger: light-dark(#ffffff, #1f0808);

  /* Fokus: feste Farbe je Theme, nicht aus der Akzentpalette abgeleitet */
  --color-focus: light-dark(#1a56b8, #7fb2ff);

  /* Deaktivierte Elemente */
  --color-disabled-bg: light-dark(#e4e8ea, #222c32);
  --color-disabled-text: light-dark(#5f6d76, #8a9aa4);
  --color-disabled-border: light-dark(#c5ced3, #34434c);

  /* Überlagerung und Schatten */
  --color-overlay: light-dark(rgb(27 42 51 / 55%), rgb(0 0 0 / 70%));
  --shadow-color: light-dark(rgb(27 42 51 / 8%), rgb(0 0 0 / 40%));
  --shadow-color-strong: light-dark(rgb(27 42 51 / 16%), rgb(0 0 0 / 60%));

  /* Codeanzeige (Wiederherstellungscode): eigene Rollen, ohne Akzentfläche */
  --color-code-bg: light-dark(#f0f3f5, #0d1317);
  --color-code-text: light-dark(#1b2a33, #e6edf1);
  --color-code-border: light-dark(#4a5a64, #7f909a);
}

:root[data-theme="system"] {
  color-scheme: light dark;
}

:root[data-theme="light"] {
  color-scheme: light;
}

:root[data-theme="dark"] {
  color-scheme: dark;
}

/* Rückfall für Browser ohne light-dark(): Hellmodus, keine transparenten oder unlesbaren Flächen */
@supports not (color: light-dark(#000000, #ffffff)) {
  :root,
  :root[data-theme] {
    color-scheme: light;
    --color-background: #f5f7f8;
    --color-surface: #ffffff;
    --color-surface-raised: #ffffff;
    --color-surface-muted: #eef1f3;
    --color-field: #ffffff;
    --color-border: #c5ced3;
    --color-border-strong: #7b8a94;
    --color-text: #1b2a33;
    --color-text-muted: #4a5a64;
    --color-success: #1e6b3a;
    --color-success-soft: #e6f2ea;
    --color-warning: #8a5a00;
    --color-warning-soft: #fbf1dc;
    --color-danger: #a32323;
    --color-danger-soft: #fbe9e9;
    --color-info: #1f4e8c;
    --color-info-soft: #e6eef8;
    --color-on-danger: #ffffff;
    --color-focus: #1a56b8;
    --color-disabled-bg: #e4e8ea;
    --color-disabled-text: #5f6d76;
    --color-disabled-border: #c5ced3;
    --color-overlay: rgb(27 42 51 / 55%);
    --shadow-color: rgb(27 42 51 / 8%);
    --shadow-color-strong: rgb(27 42 51 / 16%);
    --color-code-bg: #f0f3f5;
    --color-code-text: #1b2a33;
    --color-code-border: #4a5a64;
  }
}

/* Druck ist immer hell, unabhängig vom gewählten Theme: weißer Grund, schwarzer Text, keine Akzentfläche */
@media print {
  :root,
  :root[data-theme] {
    color-scheme: light;
    --color-background: #ffffff;
    --color-surface: #ffffff;
    --color-surface-raised: #ffffff;
    --color-text: #000000;
    --color-code-bg: #ffffff;
    --color-code-text: #000000;
    --color-code-border: #000000;
  }
}
