/* Zentrale Theme-Tokens für Light-/Dark-Mode (Tabler data-bs-theme).
   Wird in allen Layouts VOR custom.css/client-portal.css geladen —
   auch auf Seiten ohne custom.css (z.B. Tool-Launch-Embed). */

:root {
  /* Semantische Tokens — Light-Werte entsprechen der bisherigen Festverdrahtung,
     Dark-Werte folgen der Tabler-Slate-Palette (body #111827 / surface #1f2937). */
  --kc-surface: #fff;
  --kc-surface-soft: #fcfbf8;
  --kc-surface-muted: #f7f5f0;
  --kc-ink: #182433;
  --kc-ink-soft: #475569;
  --kc-muted: #716b5d;
  --kc-label: #80755e;
  --kc-border: rgba(82, 64, 18, 0.11);
  --kc-border-strong: rgba(82, 64, 18, 0.18);
  --kc-form-disabled: #f1efe9;
  --kc-danger-fg: #b42318;
  --kc-warning-fg: #b45309;
  --kc-success-fg: #15803d;
  --kc-info-fg: #1d5fa7;

  /* Modern-Pass: weichere Geometrie & Tiefe (Referenz: Login-/2FA-Look).
     Lädt nach tabler.min.css und überstimmt dessen :root-Defaults. */
  --tblr-border-radius: 8px;
  --tblr-border-radius-sm: 6px;
  --tblr-border-radius-lg: 12px;
  --tblr-card-cap-bg: transparent;
  --kc-card-shadow: 0 1px 2px rgba(70, 55, 15, 0.05), 0 16px 32px -20px rgba(70, 55, 15, 0.28);
  --kc-page-bg: linear-gradient(180deg, #ffffff 0%, #faf9f5 100%);
  /* "Edding"-Markierung: durchscheinendes zitro-Gelb (Tabellenköpfe u.ä.) */
  --kc-mark: rgba(255, 199, 0, 0.2);
  /* Warmer Akzent für dekorative Icon-Kacheln, CTAs und Auswahl-Rahmen */
  --kc-accent-fg: #7a5c12;
  --kc-accent-border: rgba(212, 158, 14, 0.55);

  /* Sidebar im Light: hochkant gestellte Login-Maske (zitro-Verlauf + Zitronen),
     aktiver Punkt wie der Anmelden-Button (weiß auf Orange). */
  --kc-sidebar-bg: linear-gradient(to bottom right, #ffc700 25%, #ff9900 100%);
  /* Dunkle warme Schrift auf dem Gelb — liest sich wie Druck unterm Textmarker
     (Weiß auf Gelb bleibt kontrastarm, egal wie viel Schatten). */
  --kc-sidebar-link: #7a5c12;
  --kc-sidebar-hover: rgba(255, 255, 255, 0.22);
  --kc-sidebar-active-bg: #fff;
  --kc-sidebar-active-fg: #ff9900;
  --kc-sidebar-sub-bg: rgba(255, 255, 255, 0.16);
  --kc-sidebar-accent: #5c450c;
  --kc-sidebar-logo: #fff;
  --kc-sidebar-line: rgba(122, 92, 18, 0.35);
  --kc-sidebar-dot: rgba(122, 92, 18, 0.6);
  --kc-sidebar-shadow: 14px 0 36px -18px rgba(122, 74, 0, 0.5);
  /* Level-1-Karten-Tiles: durchscheinendes Glas, Verlauf schimmert durch */
  --kc-sidebar-tile: rgba(255, 255, 255, 0.18);
  --kc-sidebar-tile-edge: rgba(255, 255, 255, 0.28);
  --kc-sidebar-tile-hover: rgba(255, 255, 255, 0.32);
}

/* Tabler-Overrides, die nur im Light-Mode gelten dürfen
   (im Dark-Mode liefern Tablers eigene [data-bs-theme=dark]-Werte). */
html:not([data-bs-theme=dark]) {
  --tblr-gray-50: #f0eee8;
  --tblr-muted-lt: #f1ece4;
  --tblr-white: #fffefc;
  --tblr-bg-forms: var(--tblr-white);
  --tblr-border-color: #e8e4da;
  --tblr-border-color-translucent: rgba(94, 74, 22, 0.14);
  --gui-background-color: #f0ede6;
}

[data-bs-theme=dark] {
  --kc-surface: #1f2937;
  --kc-surface-soft: #1c2434;
  --kc-surface-muted: #18202d;
  --kc-ink: #e5e7eb;
  --kc-ink-soft: #b7c2d0;
  --kc-muted: #95a0b1;
  --kc-label: #8ea4b1;
  --kc-border: rgba(226, 232, 240, 0.09);
  --kc-border-strong: rgba(226, 232, 240, 0.16);
  --kc-form-disabled: #1a2332;
  --kc-danger-fg: #f1a0a0;
  --kc-warning-fg: #f0c179;
  --kc-success-fg: #93d8a5;
  --kc-info-fg: #9cc4f0;
  --gui-background-color: #1a2332;

  --kc-card-shadow: 0 1px 2px rgba(0, 0, 0, 0.24), 0 16px 32px -20px rgba(0, 0, 0, 0.55);
  --kc-page-bg: linear-gradient(180deg, #121928 0%, #0d1320 100%);
  --kc-mark: rgba(255, 199, 0, 0.13);
  --kc-accent-fg: #ecca6d;
  --kc-accent-border: rgba(255, 199, 0, 0.38);
  --kc-sidebar-bg: #161d2b;
  --kc-sidebar-link: #c3cbd9;
  --kc-sidebar-hover: rgba(255, 255, 255, 0.05);
  --kc-sidebar-active-bg: #ffc700;
  --kc-sidebar-active-fg: #5c450c;
  --kc-sidebar-sub-bg: rgba(0, 0, 0, 0.22);
  --kc-sidebar-accent: #ffc700;
  --kc-sidebar-logo: #ffc700;
  --kc-sidebar-line: rgba(255, 255, 255, 0.18);
  --kc-sidebar-dot: rgba(255, 255, 255, 0.45);
  --kc-sidebar-shadow: 14px 0 36px -18px rgba(0, 0, 0, 0.6);
}