/* suprima-tokens.css — NUR die Marken-Tokens (--sup-*). Zentral gehostet; alle
   Suprima-Apps laden das zur Laufzeit NACH ihrer lokalen suprima-design-system.css
   (override). Bearbeitet wird das in Atlas (Einstellungen -> Design System).
   Faellt der Host aus, greift die lokale :root als Fallback. */
:root {
  /* --- Marke ------------------------------------------------------------- */
  --sup-teal:       #006e78;
  --sup-teal-dark:  #014f54;
  --sup-teal-soft:  #e6f3f3;
  --sup-berry:      #a00e53;
  --sup-navy:       #1e316a;
  --sup-amber:      #ffb74a;
  --sup-turq:       #2a9098;

  /* --- Neutrale ---------------------------------------------------------- */
  --sup-ink:        #2a555a;   /* Haupttext */
  --sup-muted:      #5b7378;   /* Sekundärtext, Labels */
  --sup-bg:         #f5f8f8;   /* Seiten-Hintergrund */
  --sup-surface:    #ffffff;   /* Karten/Panels/Header */
  --sup-line:       #e3eaea;   /* Rahmen/Trennlinien */

  /* --- Semantik ---------------------------------------------------------- */
  --sup-ok:         #1a7f37;  --sup-ok-bg:    #dcfce7;
  --sup-warn:       #b8860b;  --sup-warn-bg:  #fef3c7;
  --sup-error:      #b91c1c;  --sup-error-bg: #fee2e2;
  --sup-info:       #1e316a;  --sup-info-bg:  #e6ecf6;

  /* --- Geometrie --------------------------------------------------------- */
  --sup-radius-sm:  8px;
  --sup-radius-md:  12px;
  --sup-radius-lg:  16px;
  --sup-radius-pill: 999px;

  /* Spacing-Skala (1..7) */
  --sup-space-1: 4px;  --sup-space-2: 8px;  --sup-space-3: 12px; --sup-space-4: 16px;
  --sup-space-5: 24px; --sup-space-6: 32px; --sup-space-7: 48px;

  /* Schatten — bewusst dezent (die Apps sind flach/randbasiert) */
  --sup-shadow-sm: 0 1px 2px rgba(2,42,45,0.05), 0 1px 3px rgba(2,42,45,0.06);
  --sup-shadow-md: 0 6px 18px rgba(2,42,45,0.10);
  --sup-shadow-lg: 0 12px 30px rgba(2,42,45,0.14);
  --sup-ring: 0 0 0 3px rgba(0,110,120,0.18);   /* Fokus-Ring (Teal, transluzent) */

  /* --- Motion ------------------------------------------------------------ */
  --sup-duration-fast:   100ms;
  --sup-duration-normal: 200ms;
  --sup-duration-slow:   360ms;
  --sup-easing-standard: cubic-bezier(0.22, 1, 0.36, 1);
  --sup-easing-snap:     cubic-bezier(0.34, 1.56, 0.64, 1);

  /* --- Typografie -------------------------------------------------------- */
  --sup-font-head: "Fraunces", Georgia, serif;
  --sup-font-body: "Mulish", "Muli", "Segoe UI", system-ui, -apple-system, sans-serif;
  --sup-font-mono: ui-monospace, Menlo, Consolas, monospace;
  --sup-text-h1: 24px;  --sup-text-h2: 19px;  --sup-text-h3: 16px;
  --sup-text-body: 15px; --sup-text-small: 13px; --sup-text-label: 12px;

  /* --- Layout ------------------------------------------------------------ */
  --sup-content-max: 1180px;
  --sup-pad-x: 20px;

  /* --- Z-Index ----------------------------------------------------------- */
  --sup-z-sticky: 30; --sup-z-drawer: 40; --sup-z-overlay: 50; --sup-z-toast: 60;
}
