@import url('https://fonts.googleapis.com/css2?family=Cinzel+Decorative:wght@400;700;900&family=Outfit:wght@300;400;600;800&display=swap');

/* =========================================
   1. LE FOND MAGIQUE
   ========================================= */
body {
    margin: 0; 
    min-height: 100vh;
    background: radial-gradient(ellipse at bottom, #1B2735 0%, #090A0F 100%);
    background-attachment: fixed; /* La seule ligne propre pour fixer le fond */
    color: #e2e8f0; 
    font-family: 'Outfit', sans-serif; 
    overflow-x: hidden;
}

/* =========================================
   2. TYPOGRAPHIE & TITRES
   ========================================= */
.magical-title {
    font-family: 'Cinzel Decorative', serif;
    background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
    -webkit-background-clip: text; background-clip: text; color: transparent;
    text-shadow: 0px 4px 20px rgba(252, 246, 186, 0.2); letter-spacing: 2px;
}

/* =========================================
   3. LE VERRE MAGIQUE (Glassmorphism)
   ========================================= */
.glass-panel {
    background: rgba(255, 255, 255, 0.03); backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px);
    border: 1px solid rgba(255, 215, 0, 0.15); border-radius: 24px;
    box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4), inset 0 1px 0 rgba(255, 255, 255, 0.1);
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}
.glass-panel:hover {
    transform: translateY(-5px);
    box-shadow: 0 20px 40px rgba(212, 175, 55, 0.15), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

/* =========================================
   4. BOUTONS & FORMULAIRES MAGIQUES
   ========================================= */
.btn-magic {
    background: linear-gradient(135deg, #D4AF37 0%, #AA771C 100%); color: #090A0F !important;
    font-family: 'Outfit', sans-serif; font-weight: 800; text-transform: uppercase; letter-spacing: 1px;
    border: none; border-radius: 50px; box-shadow: 0 0 15px rgba(212, 175, 55, 0.4);
    transition: all 0.3s ease; cursor: pointer; display: inline-block; text-align: center;
}
.btn-magic:hover { transform: scale(1.05); box-shadow: 0 0 30px rgba(252, 246, 186, 0.7); }

form input:not([type="hidden"]):not([type="file"]), form select {
    height: 56px !important; background: rgba(255, 255, 255, 0.05) !important; 
    border: 1px solid rgba(255, 215, 0, 0.3) !important; color: white !important; border-radius: 12px !important; padding: 0 16px !important; 
    transition: all 0.3s ease; width: 100%; font-size: 1.1rem; box-sizing: border-box; line-height: normal !important;
}
form textarea {
    min-height: 120px; background: rgba(255, 255, 255, 0.05) !important; border: 1px solid rgba(255, 215, 0, 0.3) !important;
    color: white !important; border-radius: 12px !important; padding: 16px !important;
    transition: all 0.3s ease; width: 100%; font-size: 1.1rem; box-sizing: border-box; line-height: 1.5;
}
form input:focus, form select:focus, form textarea:focus {
    outline: none; background: rgba(255, 255, 255, 0.1) !important;
    border-color: #D4AF37 !important; box-shadow: 0 0 15px rgba(212, 175, 55, 0.3);
}
option { background: #090A0F; color: white; }

/* =========================================
   5. LA ROUE DES FILMS
   ========================================= */
canvas {
    border-radius: 50%; box-shadow: 0 0 40px rgba(212, 175, 55, 0.5), inset 0 0 20px rgba(212, 175, 55, 0.5);
    border: 4px solid rgba(252, 246, 186, 0.8); transition: transform 4s cubic-bezier(0.25, 0.1, 0.15, 1); will-change: transform;
}

/* =========================================
   6. CALENDRIER FLATPICKR
   ========================================= */
.flatpickr-calendar {
    background: rgba(15, 17, 21, 0.98) !important; backdrop-filter: blur(20px); border: 1px solid rgba(212, 175, 55, 0.5) !important; box-shadow: 0 20px 50px rgba(0, 0, 0, 0.9) !important;
    border-radius: 16px !important; color: #fff !important; font-family: 'Outfit', sans-serif !important; padding: 15px !important; width: 320px !important;
}
.flatpickr-months { height: 45px !important; display: flex !important; align-items: center !important; margin-bottom: 10px !important; }
.flatpickr-current-month { font-size: 1.3rem !important; padding: 0 !important; height: auto !important; display: flex; align-items: center; justify-content: center; }
.flatpickr-current-month input.cur-year { font-weight: 800 !important; background: transparent !important; border: none !important; color: #fff !important; height: auto !important; padding: 0 !important; }
.flatpickr-day { color: #e2e8f0 !important; border-radius: 12px !important; transition: all 0.2s; }
.flatpickr-day:hover { background: rgba(212, 175, 55, 0.3) !important; border-color: transparent !important; }
.flatpickr-day.selected { background: linear-gradient(135deg, #D4AF37 0%, #AA771C 100%) !important; border-color: transparent !important; color: #000 !important; font-weight: bold; box-shadow: 0 0 15px rgba(212, 175, 55, 0.6); }
.flatpickr-months .flatpickr-month { color: #D4AF37 !important; fill: #D4AF37 !important; font-weight: bold; }
.flatpickr-current-month .flatpickr-monthDropdown-months { background: #0f1115 !important; border-radius: 8px; padding: 4px; border: 1px solid rgba(212, 175, 55, 0.3); }
.flatpickr-weekdays .flatpickr-weekday { color: #D4AF37 !important; opacity: 0.8; font-weight: bold; }

/* =========================================
   7. LES AURAS DES HÔTELS (disneyland.php)
   ========================================= */
.theme-extreme-dlp { border-color: rgba(255, 143, 177, 0.6) !important; box-shadow: 0 10px 30px rgba(255, 143, 177, 0.3) !important; }
.theme-extreme-dlp h2, .theme-extreme-dlp h3 { color: #ff8fb1; font-family: 'Cinzel Decorative', serif; }
.theme-extreme-marvel { border-color: rgba(226, 54, 54, 0.5) !important; box-shadow: 0 10px 30px rgba(226, 54, 54, 0.2) !important; }
.theme-extreme-marvel h2, .theme-extreme-marvel h3 { color: #e23636; text-transform: uppercase; font-weight: 900; }
.theme-extreme-newport { border-color: rgba(30, 58, 138, 0.6) !important; box-shadow: 0 10px 30px rgba(30, 58, 138, 0.3) !important; }
.theme-extreme-newport h2, .theme-extreme-newport h3 { color: #60a5fa; font-family: 'Outfit', sans-serif; }
.theme-extreme-sequoia { border-color: rgba(139, 90, 43, 0.5) !important; box-shadow: 0 10px 30px rgba(139, 90, 43, 0.2) !important; }
.theme-extreme-sequoia h2, .theme-extreme-sequoia h3 { color: #dcb36b; font-family: 'Cinzel Decorative', serif; }
.theme-extreme-cheyenne { border-color: rgba(166, 123, 91, 0.5) !important; box-shadow: 0 10px 30px rgba(166, 123, 91, 0.2) !important; }
.theme-extreme-cheyenne h2, .theme-extreme-cheyenne h3 { color: #f4a460; }
.theme-extreme-santafe { border-color: rgba(43, 140, 190, 0.5) !important; box-shadow: 0 10px 30px rgba(43, 140, 190, 0.2) !important; }
.theme-extreme-santafe h2, .theme-extreme-santafe h3 { color: #4fc3f7; }
.theme-extreme-davy { border-color: rgba(85, 139, 47, 0.5) !important; box-shadow: 0 10px 30px rgba(85, 139, 47, 0.2) !important; }
.theme-extreme-davy h2, .theme-extreme-davy h3 { color: #aed581; }
.theme-extreme-parcs { border-color: rgba(255, 215, 0, 0.5) !important; box-shadow: 0 10px 30px rgba(255, 215, 0, 0.2) !important; }

/* =========================================
   8. IMMERSIONS TOTALES PAR HÔTEL (visit.php)
   ========================================= */
body.body-theme-dlp {
    background: linear-gradient(135deg, #ffe4e1 0%, #ffb6c1 50%, #f8bbd0 100%);
    background-image: radial-gradient(circle at center, rgba(255,255,255,0.8) 0%, transparent 60%), repeating-linear-gradient(45deg, rgba(255, 105, 180, 0.05) 0px, rgba(255, 105, 180, 0.05) 2px, transparent 2px, transparent 15px);
    background-attachment: fixed;
    color: #880e4f; font-family: 'Cinzel Decorative', serif;
}
.body-theme-dlp .glass-panel { background: rgba(255, 255, 255, 0.75); backdrop-filter: blur(25px); border: 2px solid rgba(255, 182, 193, 0.8); box-shadow: 0 15px 40px rgba(255, 105, 180, 0.2), inset 0 0 20px rgba(255,255,255,1); color: #880e4f; position: relative; overflow: hidden; }
.body-theme-dlp .glass-panel::before { content: ''; position: absolute; top: -50%; left: -50%; width: 200%; height: 200%; background: linear-gradient(to bottom right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.8) 50%, rgba(255,255,255,0) 100%); transform: rotate(45deg) translate(-50%, -50%); transition: transform 0.8s ease; pointer-events: none; z-index: 1; }
.body-theme-dlp .glass-panel:hover::before { transform: rotate(45deg) translate(50%, 50%); }
.body-theme-dlp .magical-title { background: none; color: #d81b60; text-shadow: 2px 2px 5px rgba(255,255,255,0.8); font-weight: 900; }
.body-theme-dlp form input:not([type="hidden"]):not([type="file"]), .body-theme-dlp form select, .body-theme-dlp form textarea { background: rgba(255,255,255,0.9) !important; color: #880e4f !important; border-color: #ffb6c1 !important; font-family: 'Outfit', sans-serif; color-scheme: light; }
.body-theme-dlp option { background: #ffe4e1; color: #880e4f; }
.body-theme-dlp .btn-magic { background: linear-gradient(135deg, #ff80ab 0%, #f50057 100%); color: #fff !important; text-shadow: 1px 1px 2px rgba(0,0,0,0.2); box-shadow: 0 0 15px rgba(245, 0, 87, 0.4); }

body.body-theme-marvel { background: radial-gradient(circle at center, #2a2d34 0%, #0d0f12 100%); background-attachment: fixed; color: #e2e8f0; font-family: 'Outfit', sans-serif; }
.body-theme-marvel .glass-panel { background: rgba(15, 17, 21, 0.8); border: 2px solid #e23636; border-radius: 8px; box-shadow: 0 10px 40px rgba(226, 54, 54, 0.15); }
.body-theme-marvel .magical-title { background: none; color: #e23636; text-transform: uppercase; font-weight: 900; letter-spacing: 4px; font-family: 'Outfit', sans-serif; }
.body-theme-marvel .btn-magic { background: #e23636; color: white !important; border-radius: 4px; box-shadow: 0 0 15px rgba(226, 54, 54, 0.4); }

body.body-theme-newport { background: linear-gradient(135deg, #f0f4f8 0%, #d9e2ec 100%); background-attachment: fixed; color: #102a43; font-family: 'Outfit', sans-serif; }
.body-theme-newport .glass-panel { background: rgba(255, 255, 255, 0.8); border: 2px solid #243b53; border-radius: 12px; box-shadow: 0 10px 30px rgba(16, 42, 67, 0.1); }
.body-theme-newport .magical-title { background: none; color: #243b53; font-weight: 800; text-transform: uppercase; letter-spacing: 3px; }
.body-theme-newport form input:not([type="hidden"]):not([type="file"]), .body-theme-newport form select, .body-theme-newport form textarea { background: #fff !important; color: #102a43 !important; border-color: #bcccdc !important; color-scheme: light; }
.body-theme-newport option { background: #fff; color: #102a43; }
.body-theme-newport .btn-magic { background: #102a43; color: #fff !important; border-radius: 4px; box-shadow: 0 5px 15px rgba(16, 42, 67, 0.2); }

body.body-theme-sequoia { background: linear-gradient(to bottom, #1e3522, #0a140b); background-attachment: fixed; color: #dcb36b; font-family: 'Outfit', sans-serif; }
.body-theme-sequoia .glass-panel { background: rgba(139, 90, 43, 0.15); border: 2px solid #8b5a2b; border-radius: 8px; box-shadow: inset 0 0 20px rgba(0,0,0,0.5); }
.body-theme-sequoia .magical-title { background: none; color: #dcb36b; font-family: 'Outfit', sans-serif; }
.body-theme-sequoia .btn-magic { background: #8b5a2b; color: #f4ebd8 !important; box-shadow: none; border: 1px solid #dcb36b; }

body.body-theme-cheyenne { background: #e8dcc4; background-attachment: fixed; color: #4a2e15; font-family: 'Courier Prime', Courier, monospace; }
.body-theme-cheyenne .glass-panel { background: rgba(255, 255, 255, 0.6); border: 3px dashed #a67b5b; border-radius: 0; box-shadow: 5px 5px 0px rgba(166, 123, 91, 0.3); color: #4a2e15; }
.body-theme-cheyenne .magical-title { background: none; color: #8b2500; font-family: 'Courier Prime', Courier, monospace; font-weight: bold; }
.body-theme-cheyenne form input:not([type="hidden"]):not([type="file"]), .body-theme-cheyenne form select, .body-theme-cheyenne form textarea { background: rgba(255,255,255,0.8) !important; color: #4a2e15 !important; border-color: #a67b5b !important; color-scheme: light; }
.body-theme-cheyenne option { background: #e8dcc4; color: #4a2e15; }
.body-theme-cheyenne .btn-magic { background: #8b2500; color: #e8dcc4 !important; border-radius: 0; box-shadow: none; }

body.body-theme-santafe { background: linear-gradient(to bottom, #f7e6d9, #d86c4f); background-attachment: fixed; color: #fff; font-family: 'Outfit', sans-serif; }
.body-theme-santafe .glass-panel { background: rgba(0, 0, 0, 0.2); border: none; border-top: 5px solid #4fc3f7; border-radius: 0; box-shadow: 0 10px 20px rgba(0,0,0,0.2); }
.body-theme-santafe .magical-title { background: none; color: #4fc3f7; text-transform: uppercase; font-weight: 900; }
.body-theme-santafe .btn-magic { background: #4fc3f7; color: #000 !important; border-radius: 0; }

body.body-theme-davy { background: linear-gradient(to bottom, #2d4a22, #15260f); background-attachment: fixed; color: #cddc39; font-family: 'Outfit', sans-serif; }
.body-theme-davy .glass-panel { background: rgba(0,0,0,0.4); border: 2px solid #8bc34a; border-radius: 16px; }
.body-theme-davy .magical-title { background: none; color: #cddc39; font-weight: 600; }
.body-theme-davy .btn-magic { background: #8bc34a; color: #15260f !important; }

/* =========================================
   9. ETOILES ANIMÉES
   ========================================= */
.star { position: absolute; background: white; border-radius: 50%; animation: twinkle infinite alternate; opacity: 0; pointer-events: none; z-index: -1; }
@keyframes twinkle { 0% { opacity: 0; transform: scale(0.5); } 100% { opacity: 0.8; transform: scale(1.5); box-shadow: 0 0 10px #fff, 0 0 20px #D4AF37; } }