/* Design-Tokens der Lager-App. Gleiche Linie und Werte wie das Hupe-Dashboard (Design-Paket „Hupe-Dashboard-Look“):
   ruhig, hell, Apple-nah, Systemschrift, weiche Karten, runde Bedienelemente; Dunkelmodus gleichwertig.
   Hupe-Akzent: Primärgrün #46AA28 mit schwarzer Schrift auf der Hauptaktion. Alle Kontraste gemessen (siehe CLAUDE.md).
   Erlaubte Abstände (px): 0 2 4 8 12 16 20 24 32 40 48 · Schriftgrößen: 12 14 16 20 24 30 36 · Gewichte: 400 600 700. */
:root {
  color-scheme: light;

  /* Flächen */
  --ground: #F5F5F7;
  --surface: #FFFFFF;
  --surface-2: #F2F2F7;        /* gefüllte Felder, Hinweise */
  --surface-hover: #F5F5F7;
  --fill: #E9E9EE;             /* graue Knöpfe, Spur des Schalters */
  --bar: rgba(255, 255, 255, .78);

  /* Linien */
  --line: #E5E5EA;
  --line-strong: #8A8A8E;      /* Rahmen von Eingaben: 3,4:1 */

  /* Text */
  --ink: #1D1D1F;              /* 16,8:1 auf Weiß */
  --ink-2: #515154;            /* 7,9:1 */
  --ink-3: #68686D;            /* 5,5:1 */

  /* Akzent */
  --brand: #46AA28;            /* Fläche der Hauptaktion */
  --on-brand: #000000;         /* 7,0:1 */
  --accent: #276B16;           /* Linktext, aktiver Reiter: 6,6:1 auf Weiß */
  --accent-soft: #E6F4E1;      /* 5,8:1 mit --accent */

  /* Bedeutung (getrennt vom Akzent) */
  --ok: #1B7A37;     --ok-soft: #E1F4E7;
  --warn: #8F4F00;   --warn-soft: #FFF0D9;
  --crit: #C4271C;   --crit-soft: #FDE8E6;

  /* Zusatzfarben aus dem CI (Orange, Blau, Violett). Flächen mit schwarzer Schrift (6,5 bis 8,2:1); Marker und Symbole
     nutzen die weiche Fläche mit dunklem Text (4,7 bis 5,6:1). Bedeutung nie nur über Farbe: immer Text und Symbol dabei. */
  --orange: #FF6C28;  --orange-text: #B04A00;  --orange-soft: #FFE9D6;   /* Abgang: Entnommen */
  --blau: #33AFCD;    --blau-text: #0B6F82;    --blau-soft: #DFF2F5;     /* Zugang: Einlagern, Wareneingang */
  --lila: #B274E4;    --lila-text: #7B3FA8;    --lila-soft: #F0E6F8;     /* Zählung: Zählen, Leer/fehlt, Korrektur */

  /* Erhebung, Radien */
  --shadow-1: 0 1px 2px rgba(0, 0, 0, .04), 0 1px 1px rgba(0, 0, 0, .03);
  --shadow-2: 0 2px 8px rgba(0, 0, 0, .06), 0 8px 24px rgba(0, 0, 0, .06);
  --r-s: 8px;
  --r-m: 12px;
  --r-l: 16px;
  --r-full: 999px;

  /* Schrift: Systemschrift (auf iPhone und Mac SF Pro), Ziffern tabellarisch */
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Inter", "Segoe UI", system-ui, Roboto, sans-serif;
  --mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  /* Bewegung */
  --t-fast: 120ms ease-out;
  --t-base: 180ms ease-out;

  /* Logo: Vollfarbe auf hell, invertiert (weiße Schrift) auf dunkel */
  --logo-hell: block;
  --logo-dunkel: none;
}

@media (prefers-color-scheme: dark) {
  :root {
    color-scheme: dark;
    --ground: #111113; --surface: #1C1C1E; --surface-2: #2C2C2E; --surface-hover: #26262A; --fill: #2C2C2E;
    --bar: rgba(28, 28, 30, .78);
    --line: #38383A; --line-strong: #6E6E73;
    --ink: #F2F2F4; --ink-2: #C2C2C7; --ink-3: #9A9AA0;
    --accent: #6FCB52; --accent-soft: #1F3320;
    --ok: #5FD07F; --ok-soft: #1B3324;
    --warn: #F0B04A; --warn-soft: #3A2A12;
    --crit: #FF8F86; --crit-soft: #40201D;
    --orange-text: #FFA766; --orange-soft: #402512;
    --blau-text: #6FD0DC;   --blau-soft: #16373D;
    --lila-text: #D0A8F2;   --lila-soft: #33263F;
    --shadow-1: 0 1px 2px rgba(0, 0, 0, .35);
    --shadow-2: 0 4px 24px rgba(0, 0, 0, .45);
    --logo-hell: none; --logo-dunkel: block;
  }
}