/* =======================================================
   LIGHT THEME
======================================================= */

:root[data-theme="light"] {

    --color-primary: #0690CF;
    --color-secondary: #0cacb8;

    --color-success: #198754;
    --color-danger: #dc3545;
    --color-warning: #f5a623;
    --color-info: #0d6efd;

    --color-primary-soft: rgba(6,144,207,0.12);
    --color-success-soft: rgba(25,135,84,0.12);
    --color-danger-soft: rgba(220,53,69,0.12);
    --color-warning-soft: rgba(245,166,35,0.15);
    --color-info-soft: rgba(13,110,253,0.12);

    --color-text-inverse: #ffffff;
    --color-on-primary: #ffffff;

    --color-bg: #f5f5f5;
    --color-bg-soft: #ffffff;
    --color-card: #e8e8e8;

    --color-text: #111827;
    --color-text-muted: rgba(17,24,39,0.7);
    --color-text-soft: rgba(17,24,39,0.5);

    --color-border: rgba(0,0,0,0.08);

    --shadow-sm: 0 4px 12px rgba(0,0,0,0.08);
    --shadow-md: 0 10px 30px rgba(0,0,0,0.08);
    --shadow-lg: 0 20px 40px rgba(0,0,0,0.15);

    --gradient-primary:
        linear-gradient(135deg, #0690CF, #0cacb8);
}


/* =======================================================
   DARK THEME
======================================================= */

:root[data-theme="dark"] {

    --color-primary: #0690CF;
    --color-secondary: #0cacb8;

    --color-success: #22c55e;
    --color-danger: #dc2626;
    --color-warning: #f59e0b;
    --color-info: #2563eb;

    --color-primary-soft: rgba(6,144,207,0.20);
    --color-success-soft: rgba(34,197,94,0.20);
    --color-danger-soft: rgba(220,38,38,0.20);
    --color-warning-soft: rgba(245,158,11,0.20);
    --color-info-soft: rgba(37,99,235,0.20);

    --color-text-inverse: #ffffff;
    --color-on-primary: #ffffff;

    --color-bg: #0b0b0f;
    --color-bg-soft: #111118;
    --color-card: #15151d;

    --color-text: #ffffff;
    --color-text-muted: rgba(255,255,255,0.7);
    --color-text-soft: rgba(255,255,255,0.5);

    --color-border: rgba(255,255,255,0.08);

    --shadow-sm: 0 4px 12px rgba(0,0,0,0.30);
    --shadow-md: 0 10px 30px rgba(0,0,0,0.25);
    --shadow-lg: 0 20px 40px rgba(0,0,0,0.40);

    --gradient-primary:
        linear-gradient(135deg, #0690CF, #0cacb8);
}


/* =======================================================
   TOKENS GLOBAIS
======================================================= */

:root {

    /* ESPAÇAMENTO */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;

    /* RADIUS */
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;

    /* GRADIENTES DE STAT CARD */
    --gradient-blue: linear-gradient(135deg, #0690CF 0%, #0cacb8 100%);
    --gradient-green: linear-gradient(135deg, #0f9d58 0%, #30c47a 100%);
    --gradient-success: linear-gradient(135deg, #16a34a 0%, #4ade80 100%);
    --gradient-yellow: linear-gradient(135deg, #f5a623 0%, #f7c948 100%);
    --gradient-info: linear-gradient(135deg, #0690CF 0%, #3b8fd4 100%);
    --gradient-purple: linear-gradient(135deg, #7c3aed 0%, #a78bfa 100%);
    --gradient-dark: linear-gradient(135deg, #374151 0%, #6b7280 100%);
    --gradient-orange: linear-gradient(135deg, #ea580c 0%, #fb923c 100%);
    --gradient-red: linear-gradient(135deg, #dc2626 0%, #f87171 100%);
    --gradient-silver: linear-gradient(135deg, #9ca3af 0%, #d1d5db 100%);
    --gradient-bronze: linear-gradient(135deg, #cd7f32 0%, #e8a87c 100%);

}