/* ================================================================
   Theme Base — Design Tokens (Phase 1)
   Zero-damage: no existing styles affected
   ================================================================ */

:root {
    /* ── Colors ── */
    --color-primary: #2563eb;
    --color-primary-hover: #1d4ed8;
    --color-primary-light: #eff6ff;
    --color-primary-dark: #1e40af;

    --color-danger: #ef4444;
    --color-danger-hover: #dc2626;
    --color-danger-light: #fee2e2;
    --color-danger-dark: #991b1b;

    --color-success: #22c55e;
    --color-success-light: #dcfce7;
    --color-success-dark: #166534;

    --color-warning: #f59e0b;
    --color-warning-light: #fef3c7;
    --color-warning-dark: #92400e;

    --color-purple: #8b5cf6;
    --color-purple-light: #ede9fe;
    --color-purple-dark: #6d28d9;

    --color-gray-50: #f9fafb;
    --color-gray-100: #f1f5f9;
    --color-gray-200: #e5e7eb;
    --color-gray-300: #d1d5db;
    --color-gray-400: #9ca3af;
    --color-gray-500: #6b7280;
    --color-gray-600: #475569;
    --color-gray-700: #334155;
    --color-gray-800: #1e293b;
    --color-gray-900: #111827;

    --color-bg: #f8fafc;
    --color-card: #ffffff;
    --color-sidebar: #1e293b;
    --color-text: #1e293b;
    --color-text-secondary: #64748b;
    --color-text-muted: #9ca3af;
    --color-border: #e5e7eb;
    --color-border-light: #f0f0f0;

    /* ── Spacing ── */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 12px;
    --space-lg: 16px;
    --space-xl: 20px;
    --space-2xl: 24px;

    /* ── Typography ── */
    --font-sm: 12px;
    --font-md: 13px;
    --font-base: 14px;
    --font-lg: 15px;
    --font-xl: 16px;
    --font-2xl: 18px;
    --font-weight-normal: 400;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;

    /* ── Borders & Radius ── */
    --radius-sm: 4px;
    --radius-md: 6px;
    --radius-lg: 10px;
    --radius-xl: 12px;
    --radius-full: 9999px;

    /* ── Input ── */
    --input-padding-y: 10px;
    --input-padding-x: 10px;
    --input-border: 1px solid var(--color-border);
    --input-radius: var(--radius-md);
    --input-focus-ring: 0 0 0 2px rgba(37, 99, 235, 0.15);

    /* ── Shadows ── */
    --shadow-sm: 0 1px 4px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.14);
    --shadow-modal: 0 10px 40px rgba(0, 0, 0, 0.2);

    /* ── Transitions ── */
    --transition-fast: 0.15s;
    --transition-normal: 0.2s;
}
