/* =================================================================== */
/* === STYLES POUR LE SYSTÈME DE RÉSERVATION (PANNEAU + MENU MOBILE) === */
/* =================================================================== */

/* --- Styles pour le panneau principal glissant --- */
.resa {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1010; /* Augmenté pour être au-dessus de tout */
    background-color: #fff;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    max-height: 95vh;
    overflow-y: auto;
    
    /* Par défaut, le panneau est caché HORS de l'écran et invisible */
    transform: translateY(-100%);
    visibility: hidden;
    /* Transition pour l'animation de glissement */
    transition: transform 0.5s ease-in-out, visibility 0s 0.5s;
}

.fbw-calendar {

	margin: 10px auto 10px !important;



}
.fbw-calendar--month-name[data-v-415ce852] {
	
	margin: 0 0 25px !important;

}
.fbw-calendar--month-bloc:nth-child(3) .fbw-calendar--month-name[data-v-415ce852] {
	margin: 0 0 25px auto !important;
}

/* Classe ajoutée par JS pour faire apparaître le panneau */
.resa.resa-active {
    /* On force l'élément à être affiché pour contrer un "display: none;" externe */
    display: block !important; 
    
    transform: translateY(0);
    visibility: visible;
    /* La transition est plus simple lors de l'apparition */
    transition: transform 0.5s ease-in-out;
}

/* Espacement interne pour le widget */
.resa #fb-widget-1 {
	padding: 20px;
	box-sizing: border-box;
	background-color: #ffffff;
}
.fbw-calendar--container[data-v-0acc4d3f] {
	background-color: #f6f4ee !important;

}


/* Correction pour les labels du widget */
.adult--label, .child--label, .promo--label {
    margin-top: -2% !important;
}


/* --- Styles pour le menu d'options de réservation mobile --- */

/* Le bouton fixe "Réservation" */
#booking-btn {
    z-index: 1000;
}

/* Le conteneur du menu d'options qui apparaît */
.booking-options-mobile {
    position: fixed;
    /* Positionné juste au-dessus du bouton #booking-btn */
    bottom: 80px; 
    left: 50%;
    transform: translateX(-50%);
    width: 90%;
    max-width: 300px;
    background-color: #fff;
    border-radius: 0px;
   /* box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);*/
    z-index: 1001; /* Doit être au-dessus du bouton */
    
    /* Par défaut, le menu est caché et légèrement décalé */
    opacity: 0;
    visibility: hidden;
    transform: translate(-50%, 15px);
    transition: opacity 0.3s ease, visibility 0.3s ease, transform 0.3s ease;
}

/* Classe 'active' pour faire apparaître le menu */
.booking-options-mobile.active {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, 0); /* Remonte à sa position finale */
}

/* Style des liens à l'intérieur du menu */
.booking-options-mobile a {
    display: block;
    padding: 11px 20px;
    text-align: center;
    color: #151344; /* La couleur bleue du logo */
    font-family: "Termina", sans-serif;
    text-decoration: none;
    font-size: 16px;
    border-bottom: 1px solid #e0e0e0;
}

/* On enlève la bordure du dernier lien */
.booking-options-mobile a:last-child {
    border-bottom: none;
}