/**
 * Variables CSS Globales
 * Fichier principal contenant toutes les variables du projet
 * À inclure en premier dans tous les thèmes
 */

:root {
    /* ========================================
       COULEURS PRINCIPALES
       ======================================== */

    /* Couleur primaire */
    --primary-color: #e63946;
    --primary-color-light: rgba(230, 57, 70, 0.51);
    --primary-hover: var(--primary-color);
    --primary-active: var(--primary-color);
    --primary-rgb: 230, 57, 70;

    /* Couleur secondaire */
    --secondary-color: #457b9d;
    --secondary-hover: #365f7d;
    --secondary-active: #2b4c63;
    --secondary-rgb: 69, 123, 157;

    /* Couleur d'accent */
    --accent-color: #ffc107;
    --accent-hover: #f7b500;
    --accent-active: #e0a800;

    /* ========================================
       COULEURS DE TEXTE
       ======================================== */

    --text-dark: #0f1115;
    --text-900: #0f1115;
    --text-600: #5b6270;
    --text-light: #bfc3cc;
    --btn-text-color: #fff;

    /* ========================================
       SURCHARGES DE COULEURS POUR LIENS ET TEXTE
       ======================================== */

    /* Couleur pour .link-light */
    --link-light-color: #f8f9fa;
    --link-light-underline-opacity: 1;

    /* Couleur pour .text-primary */
    --text-primary-color: var(--primary-color);

    /* ========================================
       COULEURS DE FOND
       ======================================== */

    --background: #ffffff;
    --background-light: #f8fbff;
    --background-gradient: linear-gradient(180deg, #fff, #f8fbff);

    /* ========================================
       EFFETS GLASS / GLASSMORPHISM
       ======================================== */

    --glass-bg: rgba(255, 255, 255, 0.8);
    --glass-brd: rgba(13, 110, 253, .15);
    --glass-shadow-light: rgba(13, 110, 253, .12);
    --glass-shadow: 0 8px 30px var(--glass-shadow-light);

    /* ========================================
       BORDURES & OMBRES
       ======================================== */

    --border-light: rgba(0, 0, 0, .08);
    --shadow-light: rgba(0, 0, 0, .06);
    --card-shadow: 0 14px 35px var(--border-light);
    --card-shadow-hover: 0 20px 45px var(--glass-brd);

    /* ========================================
       BORDER RADIUS
       ======================================== */

    --border-radius-sm: 0.5rem;
    --border-radius-md: 0.75rem;
    --border-radius-lg: 1rem;
    --border-radius-xl: 1.5rem;
    --border-radius-pill: 999px;

    /* ========================================
       ESPACEMENTS
       ======================================== */

    --spacing-xs: 0.25rem;
    --spacing-sm: 0.5rem;
    --spacing-md: 1rem;
    --spacing-lg: 1.5rem;
    --spacing-xl: 2rem;
    --spacing-2xl: 3rem;

    /* ========================================
       LAYOUT
       ======================================== */

    --nav-height: 64px;
    --footer-height: 64px;

    /* ========================================
       GRADIENTS
       ======================================== */

    --primary-gradient: linear-gradient(135deg, #e63946 0%, #c1121f 100%);
    --secondary-gradient: linear-gradient(135deg, #457b9d 0%, #2b4c63 100%);
    --success-gradient: linear-gradient(135deg, #11998e 0%, #38ef7d 100%);
    --warning-gradient: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);
    --info-gradient: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%);

    /* ========================================
       TRANSITIONS
       ======================================== */

    --transition-fast: 0.15s ease;
    --transition-base: 0.25s ease;
    --transition-slow: 0.35s ease;

    /* ========================================
       Z-INDEX
       ======================================== */

    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;

    /* ========================================
       COMPOSANTS SPÉCIFIQUES
       ======================================== */

    /* Badges de statut */
    --badge-success: #28a745;
    --badge-warning: #ffc107;
    --badge-danger: #dc3545;
    --badge-info: #17a2b8;
    --badge-secondary: #6c757d;

    --cta-bg-color: #cfe2ff;
    --card-bg-color: #cfe2ff;
    --feature-card-bg-color: #cfe2ff;
    --bs-primary-bg-subtle: #cfe2ff;

    /* ========================================
       COMPATIBILITÉ BOOTSTRAP
       ======================================== */

    --bs-primary: var(--primary-color);
    --bs-primary-rgb: var(--primary-rgb);
    --bs-secondary: var(--secondary-color);
    --bs-secondary-rgb: var(--secondary-rgb);

    --bs-link-color: var(--primary-color);
    --bs-link-color-rgb: var(--primary-rgb);
    --bs-link-hover-color: var(--primary-hover);
    --bs-link-hover-color-rgb: 214, 40, 57;

    /* ========================================
          HEADER
    ======================================== */

    --header-bg: #fff;
    --header-text: #000;

    /* ========================================
           FOOTER
    ======================================== */

    --footer-bg: #0f1115;
    --footer-text: #fff;

    /* ========================================
       BODY
    ======================================== */

    --body-bg: #ffffff;

    /* ========================================
           PAGE TITLE
    ======================================== */
    --page-title-bg : var(--primary-color-light);
    --page-title-text: #fff;

    /* ========================================
           BREADCRUMB
    ======================================== */
    --breadcrumb-bg : var(--primary-color-light);
    --breadcrumb-text: #fff;

    /* ========================================
          RESERVATION + MON COMPTE
          ======================================== */
    --main-color: var(--primary-color);
    --back-color: #f7ddc0;
    --swiper-color: #ffeaab;

    --cookie-banner-bg: #f8f9fa;
    --cookie-banner-text: #212529;
    --cookie-banner-accept-bg: #0d6efd;
    --cookie-banner-accept-text: #ffffff;
    --cookie-banner-accept-hover: #0b5ed7;
    --cookie-banner-decline-bg: transparent;
    --cookie-banner-decline-text: #6c757d;
    --cookie-banner-decline-border: #dee2e6;
    --cookie-banner-decline-hover-bg: rgba(0, 0, 0, 0.05);

}

/* ========================================
   DARK MODE (optionnel)
   ======================================== */

@media (prefers-color-scheme: dark) {
    :root {
        --text-dark: #ffffff;
        --text-900: #ffffff;
        --text-light: #6c757d;
        --background: #1a1d23;
        --background-light: #2a2d33;
        --glass-bg: rgba(0, 0, 0, 0.8);
        --border-light: rgba(255, 255, 255, .08);
    }
}

/* ========================================
   MEDIA QUERIES
   ======================================== */

/* Tablettes */
@media (max-width: 991.98px) {
    :root {
        --nav-height: 64px;
    }
}

/* Mobile */
@media (max-width: 575.98px) {
    :root {
        --nav-height: 56px;
        --spacing-xl: 1.5rem;
        --spacing-2xl: 2rem;
    }
}