/* ═══════════════════════════════════════════════════════════
   atlas-tokens.css — Atlas Design System: Design Tokens
   Single source of truth for colors, spacing, type, radii.
   Load order: vendors.min.css → app.css → atlas-tokens.css
                → atlas-components.css → RefCommand.css
   SAFE: only declares CSS variables. Adds nothing visual until
   referenced. Existing RefCommand.css continues to win all cascades.
   ═══════════════════════════════════════════════════════════ */

:root {
    /* ── Brand ─────────────────────────────────────────── */
    --ds-color-brand-red: #c62828;
    --ds-color-brand-hover: #a91f1f;
    --ds-color-atlas-blue: #4a90d9;
    --ds-color-accent: #4a90d9;
    --ds-color-accent-hover: #3a78bd;
    /* ── Neutrals ──────────────────────────────────────── */
    --ds-color-bg: #f5f7fa;
    --ds-color-surface: #ffffff;
    --ds-color-surface-alt: #f8f9fb;
    --ds-color-border: #e6e9ef;
    --ds-color-border-strong: #d4d8e0;
    --ds-color-text: #1f2937;
    --ds-color-text-muted: #6b7280;
    --ds-color-text-subtle: #9ca3af;
    /* ── Semantic ──────────────────────────────────────── */
    --ds-color-success: #198754;
    --ds-color-success-bg: #d1f2e1;
    --ds-color-warning: #f59e0b;
    --ds-color-warning-bg: #fef3c7;
    --ds-color-danger: #dc3545;
    --ds-color-danger-bg: #fde2e4;
    --ds-color-info: #0dcaf0;
    --ds-color-info-bg: #cff4fc;
    /* ── Typography ────────────────────────────────────── */
    --ds-font-sans: "Inter", system-ui, -apple-system, sans-serif;
    --ds-font-size-xxs: 0.625rem; /* 10px */
    --ds-font-size-xs: 0.6875rem; /* 11px */
    --ds-font-size-sm: 0.75rem; /* 12px - body baseline */
    --ds-font-size-md: 0.8125rem; /* 13px */
    --ds-font-size-lg: 0.875rem; /* 14px */
    --ds-font-size-xl: 1rem; /* 16px */
    --ds-font-size-2xl: 1.125rem; /* 18px */
    --ds-font-size-3xl: 1.25rem; /* 20px */
    --ds-font-weight-regular: 400;
    --ds-font-weight-medium: 500;
    --ds-font-weight-semibold: 600;
    --ds-font-weight-bold: 700;
    --ds-line-height-tight: 1.2;
    --ds-line-height-normal: 1.5;
    /* ── Spacing (4-pt scale) ──────────────────────────── */
    --ds-space-0: 0;
    --ds-space-1: 0.25rem;
    --ds-space-2: 0.5rem;
    --ds-space-3: 0.75rem;
    --ds-space-4: 1rem;
    --ds-space-5: 1.5rem;
    --ds-space-6: 2rem;
    --ds-space-7: 3rem;
    --ds-space-8: 4rem;
    /* ── Radius ────────────────────────────────────────── */
    --ds-radius-sm: 4px;
    --ds-radius-md: 8px;
    --ds-radius-lg: 12px;
    --ds-radius-xl: 16px;
    --ds-radius-pill: 999px;
    /* ── Elevation ─────────────────────────────────────── */
    --ds-shadow-xs: 0 1px 2px rgba(15, 23, 42, 0.04);
    --ds-shadow-sm: 0 2px 4px rgba(15, 23, 42, 0.06);
    --ds-shadow-md: 0 4px 12px rgba(15, 23, 42, 0.08);
    --ds-shadow-lg: 0 12px 28px rgba(15, 23, 42, 0.12);
    /* ── Motion ────────────────────────────────────────── */
    --ds-transition-fast: 120ms ease;
    --ds-transition-base: 200ms ease;
    --ds-transition-slow: 320ms ease;
    /* ── Z-index ───────────────────────────────────────── */
    --ds-z-dropdown: 1000;
    --ds-z-sticky: 1020;
    --ds-z-overlay: 1040;
    --ds-z-modal: 1050;
    --ds-z-toast: 1080;
    /* ── Layout (mirror existing RefCommand.css values) ─────── */
    --ds-topbar-height: 70px;
    --ds-nav-height: 60px;
    --ds-sidebar-width: 260px;
    --ds-content-padding: 2rem;
    /* Accounting (amber) */
    --ds-module-accounting-accent: #e6a817;
    --ds-module-accounting-accent-strong: #ca8a04;
    --ds-module-accounting-icon-bg: #fefce8;
    --ds-module-accounting-icon-bg-hover: #fef3c7;
    --ds-module-accounting-icon-color: #d4a017;
    --ds-module-accounting-tile-hover-bg: #fffbeb;
    --ds-module-accounting-badge-gradient: linear-gradient(135deg, #e6a817, #ca8a04);
    /* Inventory (green) */
    --ds-module-inventory-accent: #22c55e;
    --ds-module-inventory-accent-strong: #15803d;
    --ds-module-inventory-icon-bg: #f0fdf4;
    --ds-module-inventory-icon-bg-hover: #dcfce7;
    --ds-module-inventory-icon-color: #16a34a;
    --ds-module-inventory-tile-hover-bg: #f0fdf4;
    --ds-module-inventory-badge-gradient: linear-gradient(135deg, #22c55e, #16a34a);
    /* Sales (blue) */
    --ds-module-sales-accent: #3b82f6;
    --ds-module-sales-accent-strong: #1d4ed8;
    --ds-module-sales-icon-bg: #eff6ff;
    --ds-module-sales-icon-bg-hover: #dbeafe;
    --ds-module-sales-icon-color: #2563eb;
    --ds-module-sales-tile-hover-bg: #eff6ff;
    --ds-module-sales-badge-gradient: linear-gradient(135deg, #3b82f6, #2563eb);
    /* Executive (violet) */
    --ds-module-executive-accent: #8b5cf6;
    --ds-module-executive-accent-strong: #6d28d9;
    --ds-module-executive-icon-bg: #f5f3ff;
    --ds-module-executive-icon-bg-hover: #ede9fe;
    --ds-module-executive-icon-color: #7c3aed;
    --ds-module-executive-tile-hover-bg: #f5f3ff;
    --ds-module-executive-badge-gradient: linear-gradient(135deg, #8b5cf6, #7c3aed);
    /* Admin (slate) */
    --ds-module-admin-accent: #475569;
    --ds-module-admin-accent-strong: #1e293b;
    --ds-module-admin-icon-bg: #f1f5f9;
    --ds-module-admin-icon-bg-hover: #e2e8f0;
    --ds-module-admin-icon-color: #334155;
    --ds-module-admin-tile-hover-bg: #f8fafc;
    --ds-module-admin-badge-gradient: linear-gradient(135deg, #64748b, #334155);
    /* Reports (red) */
    --ds-module-reports-accent: #dc2626;
    --ds-module-reports-accent-strong: #b91c1c;
    --ds-module-reports-icon-bg: #fef2f2;
    --ds-module-reports-icon-bg-hover: #fee2e2;
    --ds-module-reports-icon-color: #dc2626;
    --ds-module-reports-tile-hover-bg: #fef2f2;
    --ds-module-reports-badge-gradient: linear-gradient(135deg, #ef4444, #dc2626);
    /* IT (red, distinct hover from Reports) */
    --ds-module-it-accent: #ef4444;
    --ds-module-it-accent-strong: #dc2626;
    --ds-module-it-icon-bg: #fef2f2;
    --ds-module-it-icon-bg-hover: #fee2e2;
    --ds-module-it-icon-color: #dc2626;
    --ds-module-it-tile-hover-bg: #fef2f2;
    --ds-module-it-badge-gradient: linear-gradient(135deg, #ef4444, #dc2626);
    /* Sage (purple) */
    --ds-module-sage-accent: #8b5cf6;
    --ds-module-sage-accent-strong: #6d28d9;
    --ds-module-sage-icon-bg: #f5f3ff;
    --ds-module-sage-icon-bg-hover: #ede9fe;
    --ds-module-sage-icon-color: #7c3aed;
    --ds-module-sage-tile-hover-bg: #f5f3ff;
    --ds-module-sage-badge-gradient: linear-gradient(135deg, #8b5cf6, #7c3aed);
    /* AutoPart (teal) */
    --ds-module-autopart-accent: #14b8a6;
    --ds-module-autopart-accent-strong: #0f766e;
    --ds-module-autopart-icon-bg: #f0fdfa;
    --ds-module-autopart-icon-bg-hover: #ccfbf1;
    --ds-module-autopart-icon-color: #0d9488;
    --ds-module-autopart-tile-hover-bg: #f0fdfa;
    --ds-module-autopart-badge-gradient: linear-gradient(135deg, #14b8a6, #0d9488);
}





/* ── Demo Layout tokens ─────────────────────────────────────────────────── */
html[data-bs-theme="light"],
html:not([data-bs-theme="dark"]) {
    --demo-topbar-bg: #1f4e79;
    --demo-topbar-fg: #f0f4ff;
    --demo-topbar-border: #183d61;
    --demo-nav-hover-bg: rgba(255,255,255,0.12);
    --demo-nav-active-bg: rgba(255,255,255,0.22);
    --demo-main-bg: #f4f6fb;
    --demo-main-fg: #1a2333;
    --demo-footer-bg: #e8ecf4;
    --demo-footer-fg: #6b7a99;
    --demo-shadow: 0 2px 12px rgba(31,78,121,0.12);
    --demo-topbar-h: 60px;
}

html[data-bs-theme="dark"] {
    --demo-topbar-bg: #1e2433;
    --demo-topbar-fg: #c8d6f0;
    --demo-topbar-border: #0a1628;
    --demo-nav-hover-bg: rgba(255,255,255,0.08);
    --demo-nav-active-bg: rgba(255,255,255,0.15);
    --demo-main-bg: #111827;
    --demo-main-fg: #e2e8f0;
    --demo-footer-bg: #0d1526;
    --demo-footer-fg: #4a5878;
    --demo-shadow: 0 2px 12px rgba(0,0,0,0.35);
    --demo-topbar-h: 60px;
}