/* ── OS / System Theme ───────────────────────────────────── */
/*
   Follows the OS preference via prefers-color-scheme.
   Light values are identical to light.css; dark values to dark.css.
*/

/* Light (default) */
:root,
[data-theme="os"] {
    --color-bg:        #f1f5f9;
    --color-surface:   #ffffff;
    --color-border:    #cbd5e1;
    --color-text:      #1e293b;
    --color-text-muted:#64748b;
    --color-primary:   #2563eb;
    --color-primary-h: #1d4ed8;
    --color-secondary: #64748b;
    --color-danger:    #dc2626;
    --color-success:   #16a34a;
    --color-warning:   #d97706;
    --color-nav-bg:    #1e293b;
    --color-nav-text:  #e2e8f0;
    --color-nav-hover: #3b82f6;
}

/* Dark (system preference) */
@media (prefers-color-scheme: dark) {
    :root,
    [data-theme="os"] {
        --color-bg:        #0f172a;
        --color-surface:   #1e293b;
        --color-border:    #334155;
        --color-text:      #e2e8f0;
        --color-text-muted:#94a3b8;
        --color-primary:   #3b82f6;
        --color-primary-h: #2563eb;
        --color-secondary: #64748b;
        --color-danger:    #f87171;
        --color-success:   #4ade80;
        --color-warning:   #fbbf24;
        --color-nav-bg:    #020617;
        --color-nav-text:  #cbd5e1;
        --color-nav-hover: #3b82f6;
    }

    [data-theme="os"] .alert-success { background: #14532d; color: #bbf7d0; }
    [data-theme="os"] .alert-error   { background: #7f1d1d; color: #fecaca; }
    [data-theme="os"] .alert-warning { background: #78350f; color: #fde68a; }
    [data-theme="os"] .alert-info    { background: #1e3a8a; color: #bfdbfe; }
    [data-theme="os"] .badge-success { background: #14532d; color: #4ade80; }
    [data-theme="os"] .badge-danger  { background: #7f1d1d; color: #f87171; }
    [data-theme="os"] .badge-info    { background: #1e3a8a; color: #60a5fa; }
}
