/* ============================
   DESIGN TOKENS
   ============================ */

:root {
    /* ========= COLORS ========= */

    --color-primary: #ff6b00;
    --color-primary-light: #ff8c3a;
    --color-accent: #3b82f6;
    --color-success: #16a34a;
    --color-warning: #f59e0b;
    --color-danger: #dc2626;
    --color-text-main: #ffffff;
    --color-text-muted: rgba(255,255,255,0.7);
    /* ========= GLASS UI ========= */

    --glass-bg: rgba(255,255,255,0.06);
    --glass-border: rgba(255,255,255,0.15);
    /* ========= BACKGROUND ========= */

    --app-background: linear-gradient(120deg, rgba(0,0,0,0.88), rgba(0,0,0,0.88)), url('../fondogeneral.jpg');
    /* ========= LAYOUT ========= */

    --container-max-width: 1400px;
    /* ========= SPACING ========= */

    --space-xs: 6px;
    --space-sm: 12px;
    --space-md: 20px;
    --space-lg: 32px;
    --space-xl: 60px;
    /* ========= BORDER RADIUS ========= */

    --radius-sm: 10px;
    --radius-md: 18px;
    --radius-lg: 30px;
    /* ========= HEADER / FOOTER ========= */

    --header-height: 80px;
    --footer-height: 60px;
}