/* openbi.studio Design Tokens 1.0.0 – generated from obs-tokens.json */
/* Fonts (Plus Jakarta Sans, IBM Plex Mono) are loaded by the page hull, not here. */
/* Kopie fuer den CRM-Container (F-0022, 18.10.2026) - wortgleich zur Studio-Fassung. */

:root {
  /* Fonts */
  --obs-font-sans: 'Plus Jakarta Sans', system-ui, sans-serif;
  --obs-font-mono: 'IBM Plex Mono', ui-monospace, monospace;

  /* Colors – light */
  --obs-bg: #F4F4F9;
  --obs-surface: #FFFFFF;
  --obs-surface-2: #EEEEF5;
  --obs-border: #E0E1EC;
  --obs-border-strong: #C9CBDB;
  --obs-text: #0F1024;
  --obs-text-muted: #474966;
  --obs-text-faint: #6E7090;
  --obs-primary: #5048E5;
  --obs-on-primary: #FFFFFF;
  --obs-primary-soft: #ECEBFF;
  --obs-ok: #0B7A52;      --obs-ok-soft: #D9F5E8;
  --obs-warn: #945200;    --obs-warn-soft: #FFEFD3;
  --obs-error: #BE2A24;   --obs-error-soft: #FFE4E1;
  --obs-nav: #14152B;
  --obs-nav-text: #B4B6D6;
  --obs-nav-muted: #7C7EA6;

  --obs-dot-ok: #10B981;
  --obs-dot-warn: #F59E0B;
  --obs-dot-error: #E5484D;
  --obs-primary-gradient: linear-gradient(180deg, #6A63FF, #4C44E0);

  /* Areas (gradient tiles + nav icon color) */
  --obs-area-heute: linear-gradient(135deg, #8B86FF, #4C44E0);        --obs-area-heute-icon: #9C97FF;
  --obs-area-landschaften: linear-gradient(135deg, #2DD4BF, #0E9F9A); --obs-area-landschaften-icon: #2DD4BF;
  --obs-area-features: linear-gradient(135deg, #A78BFA, #7C3AED);     --obs-area-features-icon: #C4B5FD;
  --obs-area-tickets: linear-gradient(135deg, #7DD3FC, #0284C7);      --obs-area-tickets-icon: #38BDF8;
  --obs-area-freigaben: linear-gradient(135deg, #FCD34D, #F59E0B);    --obs-area-freigaben-icon: #FBBF24;
  --obs-area-bauten: linear-gradient(135deg, #FDBA74, #F97316);       --obs-area-bauten-icon: #FB923C;
  --obs-area-carlos: linear-gradient(135deg, #F9A8D4, #EC4899);       --obs-area-carlos-icon: #F472B6;

  /* Roles */
  --obs-role-e-bg: #ECEBFF; --obs-role-e-fg: #4338CA;
  --obs-role-q-bg: #FFEFD3; --obs-role-q-fg: #92400E;
  --obs-role-p-bg: #D9F5E8; --obs-role-p-fg: #065F46;

  /* Spacing */
  --obs-space-1: 4px; --obs-space-2: 8px; --obs-space-3: 12px; --obs-space-4: 16px;
  --obs-space-5: 20px; --obs-space-6: 24px; --obs-space-7: 32px; --obs-space-8: 48px;

  /* Radii */
  --obs-radius-sm: 8px; --obs-radius-md: 10px; --obs-radius-lg: 14px;
  --obs-radius-card: 16px; --obs-radius-sheet: 24px; --obs-radius-pill: 999px;

  /* Shadows */
  --obs-shadow-card: 0 1px 2px rgba(15,16,36,.05), 0 6px 20px rgba(15,16,36,.06);
  --obs-shadow-raised: 0 14px 34px rgba(20,21,43,.28);
  --obs-shadow-primary: inset 0 1px 0 rgba(255,255,255,.25), 0 4px 14px rgba(80,72,229,.35);
}

/* Dark: follows the system unless data-theme="light" is set; data-theme="dark" forces it */
:root[data-theme="dark"] {
  --obs-bg: #0B0C18; --obs-surface: #14152A; --obs-surface-2: #1D1E37;
  --obs-border: #2A2C4E; --obs-border-strong: #3A3C64;
  --obs-text: #F0F0FA; --obs-text-muted: #B3B5D3; --obs-text-faint: #8486AE;
  --obs-primary: #8F8AFF; --obs-on-primary: #0B0B24; --obs-primary-soft: #27265A;
  --obs-ok: #3DDC97; --obs-ok-soft: #0F2E22;
  --obs-warn: #F5B544; --obs-warn-soft: #33260C;
  --obs-error: #FF7D74; --obs-error-soft: #3A1615;
  --obs-nav: #07081A; --obs-nav-text: #9EA0C6;
  --obs-role-e-bg: #27265A; --obs-role-e-fg: #C7C4FF;
  --obs-role-q-bg: #33260C; --obs-role-q-fg: #FCD34D;
  --obs-role-p-bg: #0F2E22; --obs-role-p-fg: #6EE7B7;
  --obs-shadow-card: 0 1px 2px rgba(0,0,0,.4);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --obs-bg: #0B0C18; --obs-surface: #14152A; --obs-surface-2: #1D1E37;
    --obs-border: #2A2C4E; --obs-border-strong: #3A3C64;
    --obs-text: #F0F0FA; --obs-text-muted: #B3B5D3; --obs-text-faint: #8486AE;
    --obs-primary: #8F8AFF; --obs-on-primary: #0B0B24; --obs-primary-soft: #27265A;
    --obs-ok: #3DDC97; --obs-ok-soft: #0F2E22;
    --obs-warn: #F5B544; --obs-warn-soft: #33260C;
    --obs-error: #FF7D74; --obs-error-soft: #3A1615;
    --obs-nav: #07081A; --obs-nav-text: #9EA0C6;
    --obs-role-e-bg: #27265A; --obs-role-e-fg: #C7C4FF;
    --obs-role-q-bg: #33260C; --obs-role-q-fg: #FCD34D;
    --obs-role-p-bg: #0F2E22; --obs-role-p-fg: #6EE7B7;
    --obs-shadow-card: 0 1px 2px rgba(0,0,0,.4);
  }
}