/* ── Eno Design Schema — tokens ─────────────────────────────────────────
   Übernommen aus dem Claude-Design-Projekt "Eno Design Schema" (DINLOK / ENOLABS).
   Nicht von Hand anpassen — bei Änderungen im Design-System hier neu einspielen. */

/* fonts.css — echte enolabs.de-Schrift (Google Fonts "Outfit"), verifiziert
   gegen die Live-Seite am 2026-08-26. Ersetzt die zuvor aus PNG-Referenzen
   rekonstruierte Annahme "Helvetica Neue". Laden via <link> in base.html. */
:root{
  --font-core:"Outfit","Helvetica Neue",Helvetica,Arial,"Liberation Sans",sans-serif;
  --font-sans:var(--font-core);
}

/* colors.css */
:root{
  --bg:#f4f4f8;
  --surface:#ffffff;
  --surface2:#f8f8fb;
  --line:#e8e8ef;
  --ink:#241f33;
  --text:#1f2430;
  --muted:#6b7280;
  --faint:#9aa0ac;

  --accent:#7c3aed;
  --accent-hover:#6d28d9;
  --accent-soft:rgba(124,58,237,.10);
  --accent-contrast:#ffffff;

  --dinlok-red:#e2001a;
  --dinlok-red-hover:#c40017;
  --dinlok-red-soft:rgba(226,0,26,.10);

  --ok-fg:#15803d;      --ok-bg:#dcfce7;
  --due-fg:#b45309;     --due-bg:#fef3c7;
  --overdue-fg:#b42318; --overdue-bg:#fee4e2;
}
[data-bs-theme="dark"]{
  --bg:#0e0b14;
  --surface:#1a1522;
  --surface2:#221b2d;
  --line:#2c2440;
  --ink:#ece9f4;
  --text:#ece9f4;
  --muted:#9a92ab;
  --faint:#6f6880;
  --accent:#a855f7;
  --accent-hover:#9333ea;
  --accent-soft:rgba(168,85,247,.16);
  --accent-contrast:#ffffff;
  /* Solide Töne statt Alpha-Blend: Alpha-Amber/Rot/Grün über der dunkelvioletten
     Fläche ergab rechnerisch ein schmutziges Braun (14% #fbbf24 auf #1a1522 ≈
     RGB 57,45,34) — jetzt eigens für den dunklen Grund abgestimmt. */
  --ok-fg:#4ade80;      --ok-bg:#153a24;
  --due-fg:#fbbf24;     --due-bg:#3a2e14;
  --overdue-fg:#fb7185; --overdue-bg:#3a1620;
}
[data-accent="red"]{
  --accent:var(--dinlok-red);
  --accent-hover:var(--dinlok-red-hover);
  --accent-soft:var(--dinlok-red-soft);
}

/* typography.css */
:root{
  --fs-screen-title:19px;   --fw-screen-title:700;
  --fs-section:15px;        --fw-section:700;
  --fs-card-title:13px;     --fw-card-title:700;
  --fs-row-name:13.5px;     --fw-row-name:600;
  --fs-body:13px;           --lh-body:1.6;
  --fs-meta:12px;
  --fs-overline:10.5px;     --fw-overline:700;  --ls-overline:.08em;
  --fs-wordmark:13px;       --fw-wordmark:700;  --ls-wordmark:.14em;
  --fs-kpi:24px;            --fw-kpi:700;
  --fs-tag:10.5px;          --fw-tag:700;       --ls-tag:.04em;
  --fs-chip:12px;
  --fs-button:13px;         --fw-button:700;
  --lh-tight:1.25;
}

/* spacing.css */
:root{
  --gap-xs:6px; --gap-sm:8px; --gap-md:10px; --gap-lg:14px; --gap-xl:20px; --gap-2xl:26px;
  --pad-screen-y:22px; --pad-screen-x:24px; --pad-screen-bottom:30px;
  --pad-card:16px; --pad-card-tight:14px;
  --pad-row-y:12px; --pad-row-x:16px;
  --pad-button-y:9px; --pad-button-x:15px;
  --sidebar-w:150px; --topbar-h:52px; --hairline:1px;
  /* Waechst mit der Fensterbreite (min() statt fixer 1100px) - auf
     Widescreen-Monitoren bleibt sonst der grosse Teil des Bildschirms
     ungenutzt leer; 1600px als Obergrenze verhindert absurd lange Zeilen
     auf sehr breiten/Ultrawide-Monitoren. */
  --content-max-width:min(1600px, 96vw);
}

/* radii.css */
:root{
  --r-tag:4px; --r-logo:6px; --r-button:8px; --r-input:9px;
  --r-card:10px; --r-card-lg:12px; --r-chip:999px; --r-avatar:50%;
  --r-phone:24px; --r-phone-inner:18px;
}

/* elevation.css — Kanten statt Schatten */
:root{
  --edge:1px solid var(--line);
  --shadow-none:none;
  --shadow-card:0 1px 2px rgba(16,16,24,.04);
  --shadow-raised:0 4px 14px rgba(16,16,24,.08);
  --shadow-phone:0 8px 30px rgba(16,16,24,.14);
}