:root {
    color-scheme: light;
    --bg: #f8fafc;
    --surface-1: #ffffff;
    --surface-2: #f1f5f9;
    --surface-3: #e2e8f0;
    --text: #0f172a;
    --text-muted: #475569;
    --text-subtle: #64748b;
    --border: #e2e8f0;
    --border-strong: #cbd5f5;
    --accent: #2563eb;
    --success: #059669;
    --warning: #d97706;
    --danger: #e11d48;
    --chart-1: rgb(37, 99, 235);
    --chart-2: rgb(139, 92, 246);
    --chart-3: rgb(15, 118, 110);
    --chart-4: rgb(34, 197, 94);
    --chart-5: rgb(2, 132, 199);
    --chart-6: rgb(217, 119, 6);
    --loader-bg: radial-gradient(circle at top, #f8fafc 0%, #e2e8f0 40%, #cbd5f5 100%);
    --loader-ring-1: rgba(37, 99, 235, 0.9);
    --loader-ring-2: rgba(16, 185, 129, 0.9);
    --loader-ring-3: rgba(217, 119, 6, 0.9);
}

body[data-theme="dark"] {
    color-scheme: dark;
    --bg: #0b1220;
    --surface-1: #0f172a;
    --surface-2: #111c2f;
    --surface-3: #1b2a44;
    --text: #e2e8f0;
    --text-muted: #94a3b8;
    --text-subtle: #64748b;
    --border: #1f2a44;
    --border-strong: #2b3b5a;
    --accent: #60a5fa;
    --success: #34d399;
    --warning: #fbbf24;
    --danger: #fb7185;
    --chart-1: rgb(96, 165, 250);
    --chart-2: rgb(167, 139, 250);
    --chart-3: rgb(45, 212, 191);
    --chart-4: rgb(74, 222, 128);
    --chart-5: rgb(56, 189, 248);
    --chart-6: rgb(251, 191, 36);
    --loader-bg: radial-gradient(circle at top, #0b1220 0%, #0f172a 45%, #1b2a44 100%);
    --loader-ring-1: rgba(96, 165, 250, 0.9);
    --loader-ring-2: rgba(74, 222, 128, 0.9);
    --loader-ring-3: rgba(251, 191, 36, 0.9);
}

@media (prefers-color-scheme: dark) {
    body[data-theme="system"] {
        color-scheme: dark;
        --bg: #0b1220;
        --surface-1: #0f172a;
        --surface-2: #111c2f;
        --surface-3: #1b2a44;
        --text: #e2e8f0;
        --text-muted: #94a3b8;
        --text-subtle: #64748b;
        --border: #1f2a44;
        --border-strong: #2b3b5a;
        --accent: #60a5fa;
        --success: #34d399;
        --warning: #fbbf24;
        --danger: #fb7185;
        --chart-1: rgb(96, 165, 250);
        --chart-2: rgb(167, 139, 250);
        --chart-3: rgb(45, 212, 191);
        --chart-4: rgb(74, 222, 128);
        --chart-5: rgb(56, 189, 248);
        --chart-6: rgb(251, 191, 36);
        --loader-bg: radial-gradient(circle at top, #0b1220 0%, #0f172a 45%, #1b2a44 100%);
        --loader-ring-1: rgba(96, 165, 250, 0.9);
        --loader-ring-2: rgba(74, 222, 128, 0.9);
        --loader-ring-3: rgba(251, 191, 36, 0.9);
    }
}

html,
body {
    background-color: var(--bg);
    color: var(--text);
}

[data-theme="dark"] .bg-white,
[data-theme="system"] .bg-white {
    background-color: var(--surface-1);
}

[data-theme="dark"].bg-white,
[data-theme="system"].bg-white {
    background-color: var(--surface-1);
}

[data-theme="dark"] .bg-white\/80,
[data-theme="system"] .bg-white\/80 {
    background-color: rgba(15, 23, 42, 0.8);
}

[data-theme="dark"].bg-white\/80,
[data-theme="system"].bg-white\/80 {
    background-color: rgba(15, 23, 42, 0.8);
}

[data-theme="dark"] .bg-slate-50,
[data-theme="system"] .bg-slate-50 {
    background-color: var(--surface-2);
}

[data-theme="dark"].bg-slate-50,
[data-theme="system"].bg-slate-50 {
    background-color: var(--surface-2);
}

[data-theme="dark"] .bg-slate-100,
[data-theme="system"] .bg-slate-100 {
    background-color: var(--surface-3);
}

[data-theme="dark"].bg-slate-100,
[data-theme="system"].bg-slate-100 {
    background-color: var(--surface-3);
}

[data-theme="dark"] .text-slate-900,
[data-theme="system"] .text-slate-900 {
    color: var(--text);
}

[data-theme="dark"] .text-slate-800,
[data-theme="system"] .text-slate-800 {
    color: var(--text);
}

[data-theme="dark"] .text-slate-700,
[data-theme="system"] .text-slate-700 {
    color: var(--text-muted);
}

[data-theme="dark"] .text-slate-600,
[data-theme="system"] .text-slate-600 {
    color: var(--text-muted);
}

[data-theme="dark"] .text-slate-500,
[data-theme="system"] .text-slate-500 {
    color: var(--text-subtle);
}

[data-theme="dark"] .text-slate-400,
[data-theme="system"] .text-slate-400 {
    color: var(--text-subtle);
}

[data-theme="dark"] .text-slate-300,
[data-theme="system"] .text-slate-300 {
    color: var(--text-subtle);
}

[data-theme="dark"] .border-slate-100,
[data-theme="system"] .border-slate-100,
[data-theme="dark"] .border-slate-200,
[data-theme="system"] .border-slate-200 {
    border-color: var(--border);
}

[data-theme="dark"] .border-slate-50 {
    border-color: rgb(59, 79, 98);
}

[data-theme="dark"] .ring-slate-100,
[data-theme="system"] .ring-slate-100,
[data-theme="dark"] .ring-slate-200,
[data-theme="system"] .ring-slate-200 {
    --tw-ring-color: var(--border);
}

[data-theme="dark"] .divide-slate-100,
[data-theme="system"] .divide-slate-100,
[data-theme="dark"] .divide-slate-200,
[data-theme="system"] .divide-slate-200 {
    --tw-divide-color: var(--border);
}

[data-theme="dark"] .hover\:bg-slate-50:hover,
[data-theme="system"] .hover\:bg-slate-50:hover {
    background-color: var(--surface-2);
}

[data-theme="dark"] .hover\:bg-slate-100:hover,
[data-theme="system"] .hover\:bg-slate-100:hover {
    background-color: var(--surface-3);
}

[data-theme="dark"] .hover\:bg-blue-50:hover,
[data-theme="system"] .hover\:bg-blue-50:hover {
    background-color: rgba(96, 165, 250, 0.12);
}

[data-theme="dark"] .hover\:bg-emerald-50:hover,
[data-theme="system"] .hover\:bg-emerald-50:hover {
    background-color: rgba(52, 211, 153, 0.12);
}

[data-theme="dark"] .hover\:bg-amber-100:hover,
[data-theme="system"] .hover\:bg-amber-100:hover {
    background-color: rgba(251, 191, 36, 0.16);
}

[data-theme="dark"] .bg-emerald-100,
[data-theme="system"] .bg-emerald-100 {
    background-color: rgba(52, 211, 153, 0.16);
}

[data-theme="dark"] .bg-rose-100,
[data-theme="system"] .bg-rose-100 {
    background-color: rgba(251, 113, 133, 0.16);
}

[data-theme="dark"] .bg-amber-100,
[data-theme="system"] .bg-amber-100 {
    background-color: rgba(251, 191, 36, 0.16);
}

[data-theme="dark"] .bg-blue-50,
[data-theme="system"] .bg-blue-50 {
    background-color: rgba(96, 165, 250, 0.12);
}

[data-theme="dark"] .bg-rose-50,
[data-theme="system"] .bg-rose-50 {
    background-color: rgba(251, 113, 133, 0.12);
}

[data-theme="dark"] .text-emerald-700,
[data-theme="system"] .text-emerald-700 {
    color: #34d399;
}

[data-theme="dark"] .text-amber-700,
[data-theme="system"] .text-amber-700 {
    color: #fbbf24;
}

[data-theme="dark"] .text-rose-700,
[data-theme="system"] .text-rose-700 {
    color: #fb7185;
}

[data-theme="dark"] input,
[data-theme="dark"] select,
[data-theme="dark"] textarea,
[data-theme="system"] input,
[data-theme="system"] select,
[data-theme="system"] textarea {
    background-color: var(--surface-1);
    color: var(--text);
    border-color: var(--border);
}

[data-theme="dark"] input::placeholder,
[data-theme="dark"] textarea::placeholder,
[data-theme="system"] input::placeholder,
[data-theme="system"] textarea::placeholder {
    color: var(--text-subtle);
}

[data-theme="dark"] .shadow-sm,
[data-theme="system"] .shadow-sm {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.2);
}

[data-theme="dark"] .shadow-lg,
[data-theme="system"] .shadow-lg {
    box-shadow: 0 18px 40px rgba(8, 15, 30, 0.35);
}