/* =====================================================================
   RKSAM design tokens
   ---------------------------------------------------------------------
   Single source of truth for colors, spacing, radii, typography,
   shadows and motion. Consumed by:
     - rksam-app-shell.css  (sidebar, topbar, page, cards, table, stats)
     - rksam-command-palette.css (palette overlay + context chip)

   Two token prefixes are exported from the same values:
     --rksam-*   stable API used by the command palette CSS
     (no prefix) short aliases used by the app shell
   ===================================================================== */

:root,
[data-theme="light"] {
    /* Neutrals */
    --n-50:  #F8FAFC;
    --n-100: #F1F5F9;
    --n-200: #E2E8F0;
    --n-300: #CBD5E1;
    --n-400: #94A3B8;
    --n-500: #64748B;
    --n-600: #475569;
    --n-700: #334155;
    --n-800: #1E293B;
    --n-900: #0F172A;
    --n-950: #020617;

    /* Accent (indigo) */
    --a-400: #818CF8;
    --a-500: #6366F1;
    --a-600: #4F46E5;
    --a-700: #4338CA;

    /* Status */
    --success: #10B981;
    --warning: #F59E0B;
    --error:   #F43F5E;
    --info:    #0EA5E9;

    /* Surfaces */
    --bg:             var(--n-50);
    --bg-subtle:      var(--n-100);
    --surface:        #FFFFFF;
    --surface-hover:  var(--n-100);
    --text-primary:   var(--n-900);
    --text-secondary: var(--n-500);
    --text-tertiary:  var(--n-400);
    --border:         var(--n-200);
    --border-strong:  var(--n-300);

    /* Typography */
    --font-sans: Geist, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
    --font-mono: "Geist Mono", "JetBrains Mono", ui-monospace, SFMono-Regular, Consolas, monospace;

    /* Radii */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 8px;
    --radius-xl: 12px;

    /* Shadows */
    --shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --shadow-md: 0 2px 4px -1px rgb(0 0 0 / 0.06), 0 1px 2px -1px rgb(0 0 0 / 0.04);
    --shadow-lg: 0 4px 8px -2px rgb(0 0 0 / 0.08), 0 2px 4px -2px rgb(0 0 0 / 0.06);
    --shadow-xl: 0 20px 40px -12px rgb(0 0 0 / 0.22), 0 8px 16px -8px rgb(0 0 0 / 0.12);
    --shadow-focus: 0 0 0 3px rgb(99 102 241 / 0.25);

    /* Motion */
    --duration: 200ms;
    --duration-fast: 120ms;
    --duration-normal: 200ms;
    --easing: cubic-bezier(0.4, 0, 0.2, 1);

    /* ---- rksam-* aliases consumed by the command palette CSS ---- */
    --rksam-space-1: 4px;
    --rksam-space-2: 8px;
    --rksam-space-3: 12px;
    --rksam-space-4: 16px;
    --rksam-space-10: 40px;
    --rksam-radius-sm: var(--radius-sm);
    --rksam-radius-md: var(--radius-md);
    --rksam-radius-xl: var(--radius-xl);
    --rksam-font-sans: var(--font-sans);
    --rksam-font-mono: var(--font-mono);
    --rksam-fs-xs: 11px;
    --rksam-fs-sm: 13px;
    --rksam-duration-fast: var(--duration-fast);
    --rksam-duration-normal: var(--duration-normal);
    --rksam-easing: var(--easing);
    --rksam-shadow-focus: var(--shadow-focus);
    --rksam-surface: var(--surface);
    --rksam-surface-hover: var(--surface-hover);
    --rksam-bg-subtle: var(--bg-subtle);
    --rksam-border: var(--border);
    --rksam-border-strong: var(--border-strong);
    --rksam-text-primary: var(--text-primary);
    --rksam-text-secondary: var(--text-secondary);
    --rksam-text-tertiary: var(--text-tertiary);
    --rksam-accent-500: var(--a-500);
    --rksam-warning: var(--warning);
}

[data-theme="dark"] {
    --bg:             var(--n-950);
    --bg-subtle:      var(--n-900);
    --surface:        var(--n-900);
    --surface-hover:  var(--n-800);
    --text-primary:   var(--n-50);
    --text-secondary: var(--n-400);
    --text-tertiary:  var(--n-500);
    --border:         var(--n-800);
    --border-strong:  var(--n-700);
    --shadow-focus:   0 0 0 3px rgb(129 140 248 / 0.30);
    --shadow-xl:      0 20px 40px -12px rgb(0 0 0 / 0.5), 0 8px 16px -8px rgb(0 0 0 / 0.3);
}
