/* 44CHKN Business OS — Tokens. Baut auf ui/reference-tokens.css auf (gleiche Palette),
   erweitert um Typografie-, Zahlen- und Fokus-Tokens. Manuelles Hell/Dunkel zusätzlich
   zur Medienabfrage: [data-theme] überschreibt, 'auto' folgt prefers-color-scheme. */
@import "../reference-tokens.css";

:root {
  --font-num: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, "Cascadia Mono", Consolas, "Courier New", monospace;
  --fs-0: 0.75rem;   /* 12 px */
  --fs-1: 0.875rem;  /* 14 px */
  --fs-2: 1rem;      /* 16 px */
  --fs-3: 1.25rem;   /* 20 px */
  --fs-4: 1.5rem;    /* 24 px */
  --fs-5: 2rem;      /* 32 px */
  --focus: 0 0 0 2px var(--surface), 0 0 0 4px var(--brand);
  --sidebar-w: 236px;
  --topbar-h: 56px;
}

/* Manueller Dark-Modus (Toggle, in localStorage gespeichert). */
[data-theme="dark"] {
  --bg: #11151d; --surface: #1a1f2a; --surface-2: #232937; --ink: #eef1f6; --muted: #b4bccb; --line: #343b4b;
  --brand: #ff5468; --brand-ink: #14171f; --dark: #0b0e14;
  --ok-bg: #173527; --ok: #8fe0b0; --part-bg: #3a2c14; --part: #ffc979; --warn-bg: #45191f; --warn: #ffb0ba;
  --miss-bg: #2a303d; --miss: #c9d0dc; --info-bg: #1d2b4d; --info: #b3c8ff;
  --shadow: none;
}

/* Manueller Light-Modus: erzwingt helle Tokens auch bei dunkler Systemeinstellung. */
[data-theme="light"] {
  --bg: #f4f5f8; --surface: #ffffff; --surface-2: #eef0f4; --ink: #14171f; --muted: #4a5163; --line: #d8dce4;
  --brand: #c8102e; --brand-ink: #ffffff; --dark: #1b2230;
  --ok-bg: #dff0e6; --ok: #17673a; --part-bg: #f8ead5; --part: #8a4b00; --warn-bg: #fbe1e4; --warn: #9c1426;
  --miss-bg: #e6e9ee; --miss: #444c5c; --info-bg: #e3eafa; --info: #23438f;
  --shadow: 0 1px 2px rgba(20, 23, 31, .06), 0 2px 8px rgba(20, 23, 31, .05);
}

html { height: 100%; }
body {
  margin: 0;
  font-family: var(--font);
  font-size: var(--fs-2);
  line-height: 1.5;
  color: var(--ink);
  background: var(--bg);
  -webkit-font-smoothing: antialiased;
}

/* Alle Zahlen tabellarisch — auch in Fließtext-Klassen .num. */
.num, table, .kpi-value, .chart-table td, .chart-table th {
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum" 1;
}

:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 4px; }
:focus { outline: none; }

::selection { background: var(--info-bg); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001s !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001s !important;
    scroll-behavior: auto !important;
  }
}

.visually-hidden {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}