/* ============================================================
   SpeedyInv Admin — Theme Variables (Light + Dark)
   ============================================================ */

/* --- Light Theme (default) --- */
:root,
[data-bs-theme="light"] {
    /* Surfaces */
    --si-bg-body:         #f4f6f9;
    --si-bg-surface:      #ffffff;
    --si-bg-surface-alt:  #f8f9fb;
    --si-bg-hover:        #f0f2f5;
    --si-bg-active:       #eef2ff;
    --si-bg-input:        #ffffff;
    --si-bg-sidebar:      #ffffff;
    --si-bg-topbar:       #ffffff;
    --si-bg-modal:        #ffffff;
    --si-bg-dropdown:     #ffffff;
    --si-bg-badge:        #f0f2f5;
    --si-bg-code:         #f4f6f9;

    /* Borders */
    --si-border:          #e2e6ed;
    --si-border-light:    #edf0f4;
    --si-border-focus:    #6366f1;

    /* Text */
    --si-text:            #1a1d26;
    --si-text-secondary:  #5f6778;
    --si-text-muted:      #8b93a7;
    --si-text-inverse:    #ffffff;

    /* Brand */
    --si-primary:         #6366f1;
    --si-primary-hover:   #5457e5;
    --si-primary-subtle:  #eef2ff;
    --si-primary-text:    #4f46e5;

    /* Semantic */
    --si-success:         #22c55e;
    --si-success-subtle:  #f0fdf4;
    --si-success-text:    #15803d;
    --si-warning:         #f59e0b;
    --si-warning-subtle:  #fffbeb;
    --si-warning-text:    #b45309;
    --si-danger:          #ef4444;
    --si-danger-subtle:   #fef2f2;
    --si-danger-text:     #dc2626;
    --si-info:            #3b82f6;
    --si-info-subtle:     #eff6ff;
    --si-info-text:       #2563eb;

    /* Sidebar */
    --si-sidebar-text:        #5f6778;
    --si-sidebar-text-active: #6366f1;
    --si-sidebar-hover-bg:    #f4f6f9;
    --si-sidebar-active-bg:   #eef2ff;
    --si-sidebar-section:     #8b93a7;
    --si-sidebar-border:      #e2e6ed;

    /* Shadows */
    --si-shadow-sm:   0 1px 2px rgba(0,0,0,0.04);
    --si-shadow:      0 1px 3px rgba(0,0,0,0.06), 0 1px 2px rgba(0,0,0,0.04);
    --si-shadow-md:   0 4px 6px rgba(0,0,0,0.05), 0 2px 4px rgba(0,0,0,0.04);
    --si-shadow-lg:   0 10px 15px rgba(0,0,0,0.06), 0 4px 6px rgba(0,0,0,0.04);

    /* Scrollbar */
    --si-scrollbar-thumb:       #cdd3de;
    --si-scrollbar-thumb-hover: #b0b8c9;

    /* Table */
    --si-table-header-bg:   #f8f9fb;
    --si-table-hover:       #f8f9fb;
    --si-table-stripe:      #fcfcfd;

    /* Chart colors */
    --si-chart-1: #6366f1;
    --si-chart-2: #8b5cf6;
    --si-chart-3: #ec4899;
    --si-chart-4: #f59e0b;
    --si-chart-5: #22c55e;
    --si-chart-6: #3b82f6;
}

/* --- Dark Theme --- */
[data-bs-theme="dark"] {
    /* Surfaces */
    --si-bg-body:         #0f1117;
    --si-bg-surface:      #181b23;
    --si-bg-surface-alt:  #1e2130;
    --si-bg-hover:        #252838;
    --si-bg-active:       #272a3a;
    --si-bg-input:        #1e2130;
    --si-bg-sidebar:      #14161e;
    --si-bg-topbar:       #14161e;
    --si-bg-modal:        #1e2130;
    --si-bg-dropdown:     #1e2130;
    --si-bg-badge:        #252838;
    --si-bg-code:         #1e2130;

    /* Borders */
    --si-border:          #2a2d3a;
    --si-border-light:    #222538;
    --si-border-focus:    #818cf8;

    /* Text */
    --si-text:            #e8eaf0;
    --si-text-secondary:  #9ca3b8;
    --si-text-muted:      #6b7290;
    --si-text-inverse:    #ffffff;

    /* Brand */
    --si-primary:         #818cf8;
    --si-primary-hover:   #6d78f5;
    --si-primary-subtle:  rgba(129,140,248,0.12);
    --si-primary-text:    #a5b4fc;

    /* Semantic */
    --si-success:         #4ade80;
    --si-success-subtle:  rgba(74,222,128,0.1);
    --si-success-text:    #4ade80;
    --si-warning:         #fbbf24;
    --si-warning-subtle:  rgba(251,191,36,0.1);
    --si-warning-text:    #fbbf24;
    --si-danger:          #f87171;
    --si-danger-subtle:   rgba(248,113,113,0.1);
    --si-danger-text:     #f87171;
    --si-info:            #60a5fa;
    --si-info-subtle:     rgba(96,165,250,0.1);
    --si-info-text:       #60a5fa;

    /* Sidebar */
    --si-sidebar-text:        #9ca3b8;
    --si-sidebar-text-active: #a5b4fc;
    --si-sidebar-hover-bg:    #1e2130;
    --si-sidebar-active-bg:   rgba(129,140,248,0.1);
    --si-sidebar-section:     #6b7290;
    --si-sidebar-border:      #222538;

    /* Shadows */
    --si-shadow-sm:   0 1px 2px rgba(0,0,0,0.2);
    --si-shadow:      0 1px 3px rgba(0,0,0,0.3), 0 1px 2px rgba(0,0,0,0.2);
    --si-shadow-md:   0 4px 6px rgba(0,0,0,0.3), 0 2px 4px rgba(0,0,0,0.2);
    --si-shadow-lg:   0 10px 15px rgba(0,0,0,0.35), 0 4px 6px rgba(0,0,0,0.2);

    /* Scrollbar */
    --si-scrollbar-thumb:       #2a2d3a;
    --si-scrollbar-thumb-hover: #3a3d4e;

    /* Table */
    --si-table-header-bg:   #1a1d28;
    --si-table-hover:       #1e2130;
    --si-table-stripe:      #16181f;

    /* Chart colors */
    --si-chart-1: #818cf8;
    --si-chart-2: #a78bfa;
    --si-chart-3: #f472b6;
    --si-chart-4: #fbbf24;
    --si-chart-5: #4ade80;
    --si-chart-6: #60a5fa;
}

/* --- Global Transitions --- */
*,
*::before,
*::after {
    transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}

/* --- Base Body --- */
body {
    background: var(--si-bg-body);
    color: var(--si-text);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

/* --- Scrollbar --- */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--si-scrollbar-thumb); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--si-scrollbar-thumb-hover); }

/* --- Selection --- */
::selection {
    background: var(--si-primary);
    color: var(--si-text-inverse);
}