/* ═══════════════════════════════════════════════════════════
   WEG-Verwaltung – Design-Tokens
   ═══════════════════════════════════════════════════════════ */

:root {
    /* Brand */
    --clr-primary:       #2563eb;
    --clr-primary-h:     #1d4ed8;
    --clr-accent:        #10b981;
    --clr-danger:        #ef4444;
    --clr-warning:       #f59e0b;

    /* Dark Theme (default) */
    --clr-bg:            #0c0e14;
    --clr-surface:       #151823;
    --clr-card:          rgba(21, 24, 35, .82);
    --clr-border:        rgba(255, 255, 255, .07);
    --clr-text:          #7a8299;
    --clr-text-light:    #e2e5ed;
    --clr-heading:       #ffffff;
    --clr-overlay:       rgba(255, 255, 255, .04);
    --clr-overlay-hover: rgba(255, 255, 255, .07);
    --clr-shadow:        rgba(0, 0, 0, .5);
    --clr-scrollbar:       rgba(255, 255, 255, .12);
    --clr-scrollbar-hover: rgba(255, 255, 255, .22);

    /* Typography */
    --font: 'Inter', system-ui, -apple-system, sans-serif;
    --radius: 12px;
    --shadow: 0 8px 32px var(--clr-shadow);
}

[data-theme="light"] {
    --clr-bg:            #f0f2f5;
    --clr-surface:       #ffffff;
    --clr-card:          rgba(255, 255, 255, .9);
    --clr-border:        rgba(0, 0, 0, .08);
    --clr-text:          #6b7280;
    --clr-text-light:    #1a1d2e;
    --clr-heading:       #111827;
    --clr-overlay:       rgba(0, 0, 0, .03);
    --clr-overlay-hover: rgba(0, 0, 0, .06);
    --clr-shadow:        rgba(0, 0, 0, .08);
    --clr-scrollbar:       rgba(0, 0, 0, .18);
    --clr-scrollbar-hover: rgba(0, 0, 0, .3);
}