/* ==========================================================================
   EXAFUSION CI // DESIGN TOKENS (CSS CUSTOM PROPERTIES)
   Festgelegt 06.10.2026 (Christian: "ja so machen") aus seinem Vorschlag vom selben Tag, korrigiert:
   - Bildschirm IMMER dunkel. Keine Umschaltung ueber prefers-color-scheme (Christian: "Die Seite darf bei einem
     hell eingestellten Betriebssystem keinesfalls automatisch auf ein weisses Layout umschalten").
   - Helle Palette NUR fuer den Druck (@media print) - Papier, DIN 5008, Whitepaper, Vertraege.
   - Die Wortmarke wird als SVG eingebunden (fertig/exafusion_*.svg), nie mit Text und CSS nachgebaut; deshalb
     hier keine Geometrie der Kachel (festgeschrieben: Rand H/16, Ecken 3H/16 und 2H/16).
   - Druck: --text-muted #4A5568 statt #718096.
   Die sechs Grundfarben (Abschnitt 1) muessen denen in basis.py und in LIESMICH.md gleichen - geprueft von
   pruefe_farben.py bei jedem Lauf von wortmarke.py. Gerechnete Kontraste stehen in LIESMICH.md, nicht hier.
   ========================================================================== */

:root {
  color-scheme: dark;   /* Formularelemente und Bildlaufleisten dunkel, unabhaengig vom Betriebssystem */

  /* 1. Grundfarben der Marke */
  --color-stealth-black: #0D0F12;
  --color-stealth-black-rgb: 13, 15, 18;
  --color-command-blue: #004990;
  --color-command-blue-rgb: 0, 73, 144;
  --color-vector-cyan: #00B4D8;
  --color-vector-cyan-rgb: 0, 180, 216;
  --color-kinetic-orange: #FF5E00;
  --color-kinetic-orange-rgb: 255, 94, 0;
  --color-thermal-white: #FFFFFF;
  --color-thermal-white-rgb: 255, 255, 255;
  --color-deep-tactical-grey: #1A202C;
  --color-deep-tactical-grey-rgb: 26, 32, 44;

  /* 2. Bildschirm (immer dunkel) */
  --bg-canvas: var(--color-stealth-black);
  --bg-surface-l1: #13171D;
  --bg-surface-l2: #1B2129;
  --bg-badge: var(--color-command-blue);

  --border-subtle: rgba(255, 255, 255, 0.08);     /* nur Gliederung, kein Rand von Eingabefeldern */
  --border-tactical: #252D37;                      /* nur Gliederung */
  --border-structural: #3A434E;                    /* nur Gliederung */
  --border-perimeter: var(--color-vector-cyan);

  --text-primary: var(--color-thermal-white);
  --text-secondary: rgba(255, 255, 255, 0.85);
  --text-muted: #8A99AD;
  --text-disabled: #4A5568;                        /* nur fuer Abgeschaltetes */

  --action-kinetic: var(--color-kinetic-orange);
  --action-telemetry: var(--color-vector-cyan);
  --action-command: var(--color-command-blue);     /* NUR als Flaeche, nie als Schrift auf Dunkel */

  /* 3. Kachel der Wortmarke - nur Farben; die Kachel selbst ist fertig/exafusion_kachel.svg */
  --tile-bg: var(--color-command-blue);
  --tile-border-color: var(--color-vector-cyan);
  --tile-text-color: var(--color-thermal-white);
  --tile-node-color: var(--color-kinetic-orange);
}

/* 4. Druck (Papier): helle Palette - nur hier */
@media print {
  :root {
    color-scheme: light;
    --bg-canvas: var(--color-thermal-white);
    --bg-surface-l1: #F7FAFC;
    --bg-surface-l2: #EDF2F7;

    --border-subtle: #E2E8F0;
    --border-tactical: #CBD5E0;
    --border-structural: #A0AEC0;

    --text-primary: var(--color-deep-tactical-grey);
    --text-secondary: #2D3748;
    --text-muted: #4A5568;
    --text-disabled: #A0AEC0;

    --action-kinetic: var(--color-kinetic-orange);     /* nur Flaeche oder Akzent, nicht Text */
    --action-telemetry: #007A99;
    --action-command: var(--color-command-blue);
  }
}