@font-face {
    font-family: 'Montserrat';
    src: url('../../Montserrat-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
}

/* GLOBAL RESET */
*,
*::before,
*::after {
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;
}

/* ========================================
   CSS VARIABLES - Design Tokens
   ======================================== */
:root {
    /* Couleurs principales */
    --resca-primary: #006255;
    --resca-dark: #062D28;
    --resca-accent: #A6F2E8;
    --resca-bg-light: #F2F7F7;
    --resca-white: #FFFFFF;
    --resca-grey: #F8F8F8;
    --resca-text-muted: #666666;
    --resca-text-main: #000000;
    --resca-header-simple-color: #000000;

    /* UI Specific Colors */
    --resca-skeleton-bg: rgba(135, 135, 140, 0.3);
    --resca-skeleton-shimmer: rgba(255, 255, 255, 0.4);
    --resca-input-bg: var(--resca-grey);

    /* Couleurs secondaires */
    --resca-border: #DDDDDD;
    --resca-border-light: #F0F0F0;
    --resca-error: #C62828;
    --resca-success: #155724;
    --resca-warning: #856404;

    /* Arrondis */
    --radius-sm: 6px;
    --radius-md: 12px;
    --radius-lg: 20px;
    --radius-pill: 50px;

    /* Transitions */
    --transition-fast: 0.2s ease;
    --transition-normal: 0.3s ease;
    --transition-smooth: 0.3s cubic-bezier(0.2, 0.9, 0.3, 1);

    /* Shadows */
    --shadow-sm: 0 2px 5px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 5px 20px rgba(0, 0, 0, 0.15);
    --shadow-soft: 0 4px 12px rgba(0, 0, 0, 0.05);
    --shadow-btn: 0 4px 10px rgba(0, 0, 0, 0.1);
}

/* ========================================
   CSS VARIABLES - Dark Mode
   ======================================== */
:root[data-theme="dark"] {
    --resca-primary: #A6F2E8;
    --resca-dark: #E8FFFC;
    /* Inverted: Dark becomes Accent */
    --resca-title-color: var(--resca-primary);
    --resca-header-simple-color: #FFFFFF;
    --resca-accent: #062D28;
    /* Inverted: Accent becomes Dark */
    --resca-bg-light: #000000;
    --resca-white: #101010;
    --resca-grey: #151515;
    --resca-text-muted: #AAAAAA;
    --resca-text-main: #FFFFFF;
    --resca-border: #333333;
    --resca-border-light: #222222;

    /* UI Specific Dark Overrides */
    --resca-skeleton-bg: rgba(255, 255, 255, 0.1);
    --resca-skeleton-shimmer: rgba(232, 255, 252, 0.15);
    /* Subtle tinted white shimmer for dark mode */
    --resca-input-bg: #1A1A1A;
}