/* =====================================================================
   tokens.css
   Aus sentra-design-system v3.8.1 — HIER NICHT BEARBEITEN.

   Aenderungen gehoeren ins Design-System und kommen ueber ./sync.sh
   zurueck. Eine lokale Aenderung macht aus der Kopie einen Fork, und
   die Produkte sehen wieder unterschiedlich aus. Der Stempel
   .kumo-version wird von der Testsuite geprueft und schlaegt an.
   ===================================================================== */
/* ============================================================
   SentraAI Design-Tokens — die Identität aller Produkte
   Farben, Schrift, Radien, Schatten, Fokus. Sonst nichts.

   Diese Datei ist bewusst frei von Komponenten: ein Produkt kann
   sie allein einbinden und bekommt Marke, Schrift und Flaechen,
   ohne seine Klassennamen aufzugeben (Uebergangsstufe).

   Voraussetzung beim Konsumenten: html { font-size: 14px }
   Die Komponenten in components.css rechnen in rem auf dieser Basis.
   ============================================================ */

:root {
    /* --- Akzent-Blau (Toggles / Links / Progress / Info) — Tailwind blue --- */
    --cf-blue-50:  #EFF6FF;
    --cf-blue-100: #DBEAFE;
    --cf-blue-300: #93C5FD;
    --cf-blue-500: #3B82F6;
    --cf-blue-600: #2563EB;   /* Accent */
    --cf-blue-700: #1D4ED8;   /* Accent hover/active */
    --cf-blue-900: #1E3A8A;

    /* --- Pines Primary (CTA = near-black, shadcn/Pines-Signatur) --- */
    --cf-primary:        #0A0A0A;   /* neutral-950 */
    --cf-primary-hover:  #262626;   /* neutral-800 */

    /* --- True Gray / Neutral (Pines neutral-*) --- */
    --cf-gray-50:  #FAFAFA;
    --cf-gray-100: #F5F5F5;
    --cf-gray-200: #E5E5E5;
    --cf-gray-300: #D4D4D4;
    --cf-gray-400: #A3A3A3;
    --cf-gray-500: #737373;
    --cf-gray-600: #525252;
    --cf-gray-700: #404040;
    --cf-gray-800: #262626;
    --cf-gray-900: #0A0A0A;

    /* --- Brand --- */
    --cf-orange:       #F6821F;  /* nur Akzent/Logo */
    --cf-orange-light: #FBAD41;

    /* --- Semantik (Light-BG / Default / Dark-FG Paare) --- */
    --cf-success-bg:   #D0FAE5;
    --cf-success:      #009966;
    --cf-success-fg:   #006045;
    --cf-danger-bg:    #FFE2E2;
    --cf-danger:       #FB2C36;
    --cf-danger-fg:    #C10007;
    --cf-warning-bg:   #FEF9C2;
    --cf-warning:      #F0B100;
    --cf-warning-fg:   #894B00;
    --cf-info-bg:      #DBEAFE;
    --cf-info:         #00A6F4;
    --cf-info-fg:      #193CB8;

    /* --- Flaechen & Linien (weiss + Border, Cards mit shadow-sm) --- */
    --cf-bg:        #FFFFFF;
    --cf-bg-subtle: var(--cf-gray-50);
    --cf-surface:   #FFFFFF;
    --cf-border:    var(--cf-gray-200);   /* 1px Standard-Border */
    --cf-divider:   var(--cf-gray-100);
    --cf-ring:      rgba(10, 10, 10, 0.10);
    /* Verdunkelung hinter Modal und Drawer — ein Ton fuer beide. */
    --cf-scrim:     rgba(10, 10, 10, 0.45);

    /* --- Text --- */
    --cf-text:        var(--cf-gray-900);
    --cf-text-muted:  var(--cf-gray-500);
    --cf-text-subtle: var(--cf-gray-400);

    /* --- Sekundaerakzent Violett (Demo-Lizenzen, Regel-Kategorien) --- */
    --cf-violet-bg: #F3E8FF;
    --cf-violet:    #9333EA;
    --cf-violet-fg: #7E22CE;
    /* Wie bei den uebrigen Semantiken: heller Grund + eigener Rand. Ohne das
       Paar faellt der Rand einer Violett-Pille mit ihrer Flaeche zusammen. */
    --cf-violet-tint: #FAF5FF;  --cf-violet-line: #E9D5FF;

    /* --- Marken-Badge: Orange als Flaeche, nur zur Kennzeichnung --- */
    --cf-brand-bg: #FDF1E7;
    --cf-brand-fg: #A24F0B;

    /* --- Callout-Toene: heller Grund + eigener Rand je Semantik.
           Bewusst heller als die *-bg der Badges: ein Callout ist eine
           Flaeche, ein Badge ein Fleck. --- */
    --cf-success-tint: #F0FDF7;  --cf-success-line: #C6F1DD;
    --cf-warning-tint: #FFFBEB;  --cf-warning-line: #F5E9B8;
    --cf-danger-tint:  #FEF2F2;  --cf-danger-line:  #F8D4D6;

    /* --- Radien (Pines: rounded-md 6 / lg 8 / Cards 10) --- */
    --cf-radius-sm: 6px;
    --cf-radius-md: 6px;     /* Buttons / Inputs */
    --cf-radius-lg: 8px;     /* Dropdowns / Modals */
    --cf-radius-xl: 14px;    /* Cards (luftig/schwebend) */

    /* --- Schatten (Pines: Cards shadow-sm, Popover md, Modal xl) --- */
    --cf-shadow-sm:    0 1px 2px 0 rgba(10, 10, 10, 0.04), 0 6px 16px -4px rgba(10, 10, 10, 0.10);
    --cf-shadow-pop:   0 4px 6px -1px rgba(10, 10, 10, 0.10), 0 2px 4px -2px rgba(10, 10, 10, 0.08);
    --cf-shadow-modal: 0 20px 25px -5px rgba(10, 10, 10, 0.12), 0 8px 10px -6px rgba(10, 10, 10, 0.10);

    /* --- Fokus (Pines: neutraler Ring mit Offset) --- */
    --cf-focus-ring: 0 0 0 2px var(--cf-surface), 0 0 0 4px rgba(163, 163, 163, 0.55);

    /* --- Typo --- */
    --cf-font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --cf-font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
    /* Seitenhintergrund hinter weissen Karten (Pines: neutral-50-Canvas) */
    --cf-canvas: #F1F2F5;
}
