/*
  Globale Design-Tokens (CSS Custom Properties).
  Werden von allen öffentlichen Seiten und allen Web-Component-Controls (auch
  im Shadow DOM, da Custom Properties Shadow-Grenzen durchdringen) referenziert.
  Diese statischen Werte sind der Fallback/die Baseline, BEVOR das dynamische
  Theme (js/core/theme-runtime.js/theme-loader.js, Dashboard "Design") greift -
  daher entsprechen sie bewusst 1:1 dem aktuellen Standard-Theme (Fit-Easy),
  damit es keinen Flash falscher Farben gibt.

  Die Farb-Werte (--color-*) sind über das Dashboard live änderbar. Die
  Form-/Typografie-Werte (--radius-*, --font-weight-bold, --border-width)
  sind aktuell FEST Teil des Fit-Easy-Designs (nicht per Farbwähler tunbar).

  Das Admin-Dashboard lädt diese Datei ebenfalls, überschreibt die Werte aber
  bewusst wieder auf sein eigenes, unabhängiges Design (siehe dashboard.css) -
  das Dashboard bleibt dadurch vom öffentlichen Theme unberührt.
*/
:root {
  --color-primary: #FF5E00;
  --color-primary-hover: #D44A00;
  --color-on-primary: #ffffff;

  --color-bg: #ffffff;
  --color-surface: #F4F4F4;
  --color-surface-hover: #ECE0D6;

  --color-text: #111111;
  --color-text-muted: #666666;
  --color-border: #E0E0E0;
  --color-danger: #dc2626;

  --font-base: 'Pretendard', system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --font-weight-bold: 900;

  --space-1: 0.25rem;
  --space-2: 0.5rem;
  --space-3: 1rem;
  --space-4: 1.5rem;
  --space-5: 2.5rem;

  /* Fit-Easy verwendet durchgängig scharfe Ecken und fette Rahmen - kein
     abgerundetes Standard-Design mehr, um 1:1 optische Übereinstimmung zu
     erreichen. */
  --radius-sm: 0px;
  --radius-md: 0px;
  --border-width: 2px;
}
