/* ========================================
   MISSION EAU - DESIGN TOKENS
======================================== */

:root {

    /* COLORS */

    --color-primary: #00b1eb;
    --color-primary-dark: #0b2731;

    --color-secondary: #1798A5;
    --color-success: #1fc227;
    --color-success-bg: #DDEBDE;

    --color-warning: #8B5408;
    --color-warning-bg: #F5E8D2;

    --color-danger: #dd221e;
    --color-danger-bg: #F8E1DF;

    --color-info: #2957A4;
    --color-info-bg: #DCE9F8;

    --color-background: #EEF2F7;
    --color-surface: #FFFFFF;

    --color-text: #17346B;
    --color-text-light: #566885;
    --color-border: #C8D4E4;

    /* SHADOWS */

    --shadow-soft:
        0 12px 30px rgba(32, 58, 95, 0.08);

    --shadow-button:
        0 18px 40px rgba(41, 87, 164, 0.18);

    /* RADIUS */

    --radius-xs: 12px;
    --radius-sm: 18px;
    --radius-md: 24px;
    --radius-lg: 32px;
    --radius-xl: 40px;
    --radius-pill: 999px;

    /* SPACING */

    --space-xs: 8px;
    --space-sm: 12px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;
    --space-2xl: 40px;

    /* TYPO */

    --font-family:
        "Inter",
        "Segoe UI",
        sans-serif;

    --text-xs: 12px;
    --text-sm: 14px;
    --text-md: 18px;
    --text-lg: 24px;
    --text-xl: 40px;

    --font-bold: 700;
    --font-semi: 600;
}