/* design/dist/kern.css — Kern der Grundlage (D-41, GEST-02, GEST-05, D-05, D-07, D-08)
 *
 * KERN = Erscheinung, die jedes Werkzeug und die Website teilen: Farben (hell, dunkel, Druck),
 * Schriftfamilien und die Linienbreite. Die Wortmarke (assets/wortmarke.svg) und die Schrift
 * (dist/schrift.css) gehoeren ebenfalls zum Kern. Diese Datei traegt KEINE Dichte: Schriftgroessen,
 * Zeilenhoehe, Abstaende, Masse, Radien, Schatten und Bewegung stehen in der jeweiligen Schicht
 * (dist/werkzeug.css bzw. dist/website.css). scripts/check-schichtgrenze.sh haelt diese Grenze.
 *
 * Quelle der Namen und Werte: 03-UI-SPEC.md (Repo meta, Phase 3), Abschnitt „Tokens", Teil
 * „Farbe" und die Schriftfamilien; seit Plan 03-19 die Revision 2026-11-01, §R8.1 (Farbe und
 * Linien in der Anmutung der Website, UI-E4) und §R8.2 (--font-display, F5). Namen nach OP-13:
 * englisches Grundvokabular, kein Firmenname, keine Entwurfskennung (D-41 Nr. 3).
 *
 * MODUS: Hell ist der Standard DES KERNS (D-05). `:root` und `[data-theme="light"]` tragen den
 * vollen Satz; `[data-theme="dark"]` uebersteuert nur die Farben. Der Kern traegt KEINE
 * Medienabfrage auf das Systemthema (`prefers-color-scheme`, §R8.6, U1): dunkel wirkt nur ueber
 * das Attribut `data-theme="dark"`. Die Kalkulation setzt das Attribut selbst (Plan 03-20, F4:
 * sie folgt dem System); die Website laedt den Kern ohne Attribut und bleibt hell (U1).
 *
 * LINIEN: --color-border und --color-border-strong sind rgba wie auf der Website (weich, fuer
 * Raster und Trenner). Kanten von Bedienelementen nehmen --color-control-edge (der alte Wert von
 * --color-border-strong), damit kein Bedienelement schwerer zu erkennen ist (§R8.1).
 *
 * DRUCK: Grund weiss, Nebentext #444444 (9,74:1), Linien #d0d0d0 (UI-SPEC „Druck und PDF").
 *
 * scripts/kontrast.py liest die Farbwerte (Hex und rgba, rgba ueber --color-bg desselben Modus
 * gemischt) der beiden obersten Bloecke (hell, dunkel) DIESER Datei und rechnet die Tabelle
 * „Kontrast — gemessen" nach; Bloecke in @media liest es nicht. Der Kern ist die einzige
 * Farbquelle der Grundlage.
 */

:root,
[data-theme="light"] {
  /* --- Farbe --------------------------------------------------------------------------- */
  --color-bg: #ffffff;
  --color-surface: #ffffff;
  --color-surface-2: #f5f5f5;
  --color-row-current: #f2f2f2;
  --color-overlay-bg: #ffffff;
  --color-scrim: rgba(0, 0, 0, 0.42);
  --color-border: rgba(0, 0, 0, 0.08);
  --color-border-strong: rgba(0, 0, 0, 0.16);
  --color-control-edge: #a3a3a3;
  --color-row-hover: #fafafa;
  --color-field-line: #cdcdcd;
  --color-text: #141414;
  --color-text-muted: #5e5e5e;
  --color-primary: #000000;
  --color-primary-hover: #333333;
  --color-on-primary: #ffffff;
  --color-focus: #000000;
  --color-pos: #00808c;
  --color-neg: #b32d2a;
  --color-warn: #b5670a;
  --color-warn-text: #a55e09;

  /* --- Schriftfamilien ----------------------------------------------------------------- */
  --font-sans: "Geist", system-ui, sans-serif;
  --font-num: "Geist Mono", ui-monospace, monospace;
  --font-label: var(--font-num);
  --font-display: "Archivo", "Arial Narrow", sans-serif; /* nur .anzeige (§R8.2, F5) */

  /* --- Linie --------------------------------------------------------------------------- */
  --border-w: 1px;
}

[data-theme="dark"] {
  --color-bg: #000000;
  --color-surface: #000000;
  --color-surface-2: #111111;
  --color-row-current: #161616;
  --color-overlay-bg: #0a0a0a;
  --color-scrim: rgba(0, 0, 0, 0.42);
  --color-border: rgba(255, 255, 255, 0.12);
  --color-border-strong: rgba(255, 255, 255, 0.22);
  --color-control-edge: #5a5a5a;
  --color-row-hover: #0a0a0a;
  --color-field-line: #424242;
  --color-text: #ededed;
  --color-text-muted: #a1a1a1;
  --color-primary: #ffffff;
  --color-primary-hover: #d4d4d4;
  --color-on-primary: #000000;
  --color-focus: #ffffff;
  --color-pos: #0097a6;
  --color-neg: #da625f;
  --color-warn: #c8720b;
  --color-warn-text: #c8720b;
}

/* --- Druck ------------------------------------------------------------------------------- */
@media print {
  :root,
  [data-theme="light"],
  [data-theme="dark"] {
    --color-bg: #ffffff;
    --color-surface: #ffffff;
    --color-surface-2: #f5f5f5;
    --color-text: #000000;
    --color-text-muted: #444444;
    --color-border: #d0d0d0;
  }
}