/*
Theme Name: Keral Core
Theme URI: https://keral.co
Template: generatepress
Author: Michael Dhifi
Author URI: https://keral.co/about
Description: Keral Core is a WordPress theme developed by Keral to deliver a fast, modern, and highly controlled web experience. Built with a strong focus on performance and flexibility, it ensures optimized loading times and a lightweight structure aligned with today's web standards. Designed following best coding practices, Keral Core fully leverages the power of the block editor (Gutenberg) while remaining compatible with leading page builders. It seamlessly integrates with essential plugins such as WooCommerce, providing scalability for a wide range of digital projects. Fully responsive and SEO-optimized, Keral Core features a modular architecture that allows advanced customization, including color management, dynamic typography, flexible layouts, and multiple widget areas. Developed by Keral, this theme reflects a commitment to performance, simplicity, and digital efficiency. Learn more: https://keral.co
Tags: two-columns,three-columns,one-column,right-sidebar,left-sidebar,footer-widgets,blog,e-commerce,flexible-header,full-width-template,buddypress,custom-header,custom-background,custom-menu,custom-colors,sticky-post,threaded-comments,translation-ready,rtl-language-support,featured-images,theme-options
Version: 3.6.1.1778608692
Updated: 2026-05-12 17:58:12
*/

/* 
==========================================================================
   0 — VARIABLES & CONFIGURATION
========================================================================== */
:root {
    --font-heading: "Cormorant Garamond Light", Georgia, serif;
    --font-body: "Inter", -apple-system, sans-serif;

    --color-primary: #000000;         
    --color-accent-1: #8c5a2a;        
    --color-accent-2: #c9a961;        
    --color-accent-3: #4a2c1a;        
    --color-bg-dark: #0d1419;         
    --color-active-line: rgba(224, 198, 149, 0.35); 
    
    --fs-tagline: 1.85rem;
    --fs-menu-link: 0.95rem;
    --fs-btn-small: 11px;
}

/* ==========================================================================
   1 — EFFETS GLOBAUX & BLUR HEADERS
   ========================================================================== */
html, body {
  overflow-x: hidden;
  max-width: 100%;
}

.main-header-block {
  transition: background-color 0.3s ease-in-out, backdrop-filter 0.3s ease-in-out;
  background: transparent;
  will-change: background-color, backdrop-filter;
  transform: translateZ(0);	
}

.main-header-block.scrolled {
  background: rgba(44, 40, 37, 0.6);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
}

.skip-link {
  position: absolute;
  left: -9999px;
  top: -9999px;
  z-index: 999999;
}

.skip-link:focus {
  left: 10px;
  top: 10px;
  background: var(--color-primary);
  color: #fff;
  padding: 10px 20px;
  text-decoration: none;
}

/* ==========================================================================
   2 — ACCORDÉONS
   ========================================================================== */

/* Conteneur du contenu de l'accordéon */
.dd-accord-body {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    overflow: hidden;
}

/* Astuce technique pour permettre l'animation du Grid */
.dd-accord-body > * { 
    min-height: 0; 
    overflow: hidden; 
}

/* État ouvert : on passe à 1fr pour occuper tout l'espace nécessaire */
.dd-accord-item.open .dd-accord-body { 
    grid-template-rows: 1fr; 
}

/* En-tête cliquable */
.dd-accord-header { 
    cursor: pointer; 
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Icône de rotation (le "+" qui devient un "x") */
.dd-accord-header .dd-accord-icon {
    transition: transform 0.5s cubic-bezier(0.4, 0, 0.2, 1);
    display: inline-block;
}

/* Rotation de 45 degrés quand l'élément est ouvert */
.dd-accord-item.open .dd-accord-icon { 
    transform: rotate(45deg); 
}

/* ==========================================================================
   3 — MENU MOBILE FULLSCREEN (OVERLAY & ORBES)
   ========================================================================== */

/* 3.1 — Conteneur Principal */
#mobile-sidebar.fullscreen-menu {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100vw;
    height: 100dvh;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 35px 24px;
    box-sizing: border-box;
    background: transparent;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.02);
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0.4s;
}

#mobile-sidebar.fullscreen-menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0s;
}

body.menu-open {
    overflow: hidden;
}

/* 3.2 — Fond Animé & Orbes */

#mobile-sidebar.fullscreen-menu,
body #mobile-sidebar.fullscreen-menu {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100vh !important;
    height: 100dvh !important;
    margin: 0 !important;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
    padding: 35px 24px;
    box-sizing: border-box;
    background: transparent;
    overflow: hidden;
    opacity: 0;
    visibility: hidden;
    transform: scale(1.02);
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0.4s;
}

#mobile-sidebar.fullscreen-menu.is-open {
    opacity: 1;
    visibility: visible;
    transform: scale(1);
    transition: opacity 0.4s ease, transform 0.4s ease, visibility 0s linear 0s;
}

body.menu-open {
    overflow: hidden;
}

/* ===== Fond animé : base sombre + orbes flottantes ===== */
.menu-bg {
    position: absolute;
    inset: 0;
    z-index: -2;
    overflow: hidden;
	background: #0d1419;
}

.menu-bg::after {
    content: '';
    position: absolute;
    inset: 0;
    backdrop-filter: blur(60px);
    -webkit-backdrop-filter: blur(60px);
    background: rgba(13, 20, 25, 0.35);
    z-index: 1;
}

.orb {
    position: absolute;
    border-radius: 50%;
    filter: blur(60px);
    opacity: 0; 
    will-change: transform, opacity;
    mix-blend-mode: screen;
    animation-play-state: paused;
    transition: opacity 0.5s ease;
}

#mobile-sidebar.is-open .orb {
    opacity: 0.55;
    animation-play-state: running;
}

.orb-1 {
    width: 380px;
    height: 380px;
    background: #8c5a2a;
    top: -10%;
    left: -15%;
    animation: drift1 22s ease-in-out infinite;
}

.orb-2 {
    width: 320px;
    height: 320px;
    background: #c9a961;
    bottom: -10%;
    right: -10%;
    animation: drift2 28s ease-in-out infinite;
}

.orb-3 {
    width: 280px;
    height: 280px;
    background: #4a2c1a;
    top: 40%;
    right: 20%;
    animation: drift3 25s ease-in-out infinite;
}

@keyframes drift1 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(60px, 80px, 0) scale(1.15); }
}

@keyframes drift2 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    50%      { transform: translate3d(-70px, -60px, 0) scale(1.2); }
}

@keyframes drift3 {
    0%, 100% { transform: translate3d(0, 0, 0) scale(1); }
    33%      { transform: translate3d(-40px, 50px, 0) scale(0.9); }
    66%      { transform: translate3d(50px, -40px, 0) scale(1.1); }
}

@media (prefers-reduced-motion: reduce) {
    .orb { animation: none; }
}

/* 3.4 — Contenu (Logo, Tagline, Nav) */
.sidebar-branding {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    gap: 10px;
    margin-bottom: 0px;
    z-index: 2;
}

#mobile-sidebar .menu-logo {
	width: 60px;
    height: auto;
    display: block;
    margin: 0 auto;
}

#mobile-sidebar .menu-hotel-name {
    color: #ffffff;
    font-family: var(--font-heading);
    font-size: 22px;
    text-align: center;
    margin: 0;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}



#mobile-sidebar nav {
    display: flex;
    flex-direction: column;
    gap: 0.85rem;
    align-items: center;
    position: relative;
    z-index: 2;
}

#mobile-sidebar nav a {
    color: #ffffff;
    font-family: var(--font-body);
    font-size: var(--fs-menu-link); /* 0.95rem */
    text-decoration: none;
    transition: opacity 0.25s;
}

/* 3.5 — Bouton Fermeture (Structure HTML ::before/::after intégrée) */
#close-sidebar {
    background: #ffffff;
    border: none;
    width: 52px;
    height: 52px;
    border-radius: 10px;
    color: var(--color-primary); 
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
    transition: transform 0.2s;
    position: relative;
    z-index: 2;
}
#close-sidebar:hover { transform: scale(1.06); }

/*==========================================================================
   4 — CALENDRIER MOBILE (FIX GRILLE & TAILLES)
 ========================================================================== */

/* 4.1 — Structure du Tiroir (Modal) */
.dd-modal {
    position: fixed; 
    inset: 0; 
    z-index: 99999;
    visibility: hidden; 
    pointer-events: none; 
    height: 100dvh;
}
.dd-modal.is-open { 
    visibility: visible; 
    pointer-events: auto; 
}

.dd-modal-content {
    position: fixed; 
    bottom: 0; 
    left: 0; 
    width: 100%; 
    height: 92dvh;
    background: #fff; 
    border-radius: 32px 32px 0 0;
    transform: translateY(100%); 
    transition: transform 0.4s cubic-bezier(0.25, 1, 0.5, 1);
    display: flex;
    flex-direction: column;
    padding: 0; /* Respect de ton padding: 0 */
}
.dd-modal.is-open .dd-modal-content { 
    transform: translateY(0); 
}

/* 4.2 — Handle & Header */
.dd-handle {
    width: 40px;
    height: 4px;
    background: #E5E5E5;
    border-radius: 10px;
    margin: 10px auto 0;
}

.dd-header-top {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 25px 24px 15px 24px;
}

#dd-calendar-title {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--color-primary);
    margin: 0;
}

/* 4.3 — Bouton Fermer (Structure Before/After) */
#dd-close-calendar {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 20px;
    height: 20px;
    position: relative;
    flex-shrink: 0;
}

#dd-close-calendar::before,
#dd-close-calendar::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 18px;
    height: 1px;
    background: var(--color-primary);
}
#dd-close-calendar::before { transform: translate(-50%, -50%) rotate(45deg); }
#dd-close-calendar::after  { transform: translate(-50%, -50%) rotate(-45deg); }

/* 4.4 — Grilles (Jours & Chiffres) */
.dd-weekdays {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    text-align: center;
    padding: 10px 20px;
    border-bottom: 1px solid #f9f9f9;
}
.dd-weekdays span {
    font-size: 10px;
    font-weight: 600;
    color: #9ca3af;
}

.dd-calendar-body {
    flex: 1;
    overflow-y: auto;
    padding: 10px 20px 80px;
}

.dd-days-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 4px;
}

.dd-day {
    height: 40px;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    border-radius: 50%;
    margin: 0 auto;
}

/* États de sélection */
.dd-day.is-selected { 
    background: var(--color-primary); 
    color: #fff; 
}
.dd-day.in-range { 
    background: #f3f4f6; 
    border-radius: 0; 
}

/* 4.5 — Bouton de validation */
#dd-calendar-btn-next {
    display: block;
    width: 90%;
    margin: 10px auto 20px;
    background: var(--color-primary);
    color: #fff;
    height: 52px;
    border-radius: 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: var(--fs-btn-small);
    border: none;
    cursor: pointer;
    transition: opacity 0.3s ease;
}
/* ==========================================================================
   5 — GUESTS (VOYAGEURS)
   ========================================================================== */

/* 5.1 — Conteneur & Rangées */
.guest-container {
    padding: 24px;
    background: #ffffff;
    height: 100%;
}

.guest-row {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    padding: 22px 0;
    border-bottom: 0.5px solid #eeeeee;
}

.guest-row:last-child {
    border-bottom: none;
}

.guest-ctrl {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 15px;
}

/* 5.2 — Boutons Compteur */
.cnt-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 0.5px solid #ccc;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #fff;
    cursor: pointer;
    font-size: 18px;
    font-weight: 200;
    color: var(--color-primary);
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
    box-sizing: border-box;
}

.cnt-val {
    font-family: var(--font-heading);
    font-weight: 400;
    font-size: 16px;
    min-width: 20px;
    text-align: center;
}

/* 5.3 — Titres & En-têtes */
#dd-guests-title {
    font-family: var(--font-heading);
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0.25em;
    text-transform: uppercase;
    color: var(--color-primary);
    margin: 0;
}

.dd-header-center {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
}

#dd-guests-dates {
    font-family: var(--font-heading);
    font-style: italic;
    font-size: 17px;
    color: #999;
    margin: 0 0 12px 0;
    text-align: center;
    letter-spacing: 0.05em;
}

/* 5.4 — Navigation & Icônes Ultra-fines */

/* Croix fermer */
#dd-close-guests {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 20px;
    height: 20px;
    position: relative;
    flex-shrink: 0;
}
#dd-close-guests::before,
#dd-close-guests::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 18px;
    height: 1px;
    background: var(--color-primary);
}
#dd-close-guests::before { transform: translate(-50%, -50%) rotate(45deg); }
#dd-close-guests::after  { transform: translate(-50%, -50%) rotate(-45deg); }

/* Flèche retour */
#dd-back-to-calendar {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 20px;
    height: 20px;
    position: relative;
    flex-shrink: 0;
}
#dd-back-to-calendar::before,
#dd-back-to-calendar::after {
    content: '';
    position: absolute;
    left: 4px;
    width: 10px;
    height: 1px;
    background: var(--color-primary);
}
#dd-back-to-calendar::before { top: calc(50% - 4px); transform: rotate(-45deg); }
#dd-back-to-calendar::after  { top: calc(50% + 4px);  transform: rotate(45deg); }

/* 5.5 — Bouton Final */
#dd-btn-final-verify {
    display: block;
    width: 90%;
    margin: 10px auto 20px;
    background: var(--color-primary);
    color: #fff;
    height: 52px;
    border-radius: 0;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.2em;
    font-size: var(--fs-btn-small);
    border: none;
    cursor: pointer;
    transition: opacity 0.3s ease;
}

#dd-btn-final-verify:hover {
    opacity: 0.85;
}
/* ==========================================================================
   6 — BARRE D'ACTION COLLÉE (STICKY CHECK RATES MOBILE)
   ========================================================================= */

/* Masqué par défaut sur Desktop */
.check-rates-wrapper {
    display: none;
}

@media (max-width: 767px) {
    .check-rates-wrapper {
        display: block;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9990;
        background: #ffffff;
        padding: 10px;
        box-shadow: 0 -2px 15px rgba(0, 0, 0, 0.12);
    }

    .check-rates-btn {
        display: block;
        width: 100%;
        background-color: var(--color-primary);
        color: #ffffff;
        text-align: center;
        padding: 14px 20px;
        font-family: var(--font-body);
        font-size: 16px;
        font-weight: 500;
        text-transform: uppercase;
        letter-spacing: 2px;
        text-decoration: none;
        transition: background-color 0.3s ease;
    }
}


/* ==========================================================================
   7 — DROPDOWNS DESKTOP (CALENDRIER & VOYAGEURS)
   ========================================================================== */

/* 7.1 — Positionnement des colonnes */
#bb-dates-field {
    position: relative;
    z-index: 50;
}

#bb-guests-field {
    position: relative;
    z-index: 49;
}

/* 7.2 — Base des Dropdowns */
#bb-calendar-dropdown,
#bb-guests-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 0;
    background: #ffffff;
    border: 1px solid #e5e7eb;
    box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.20);
    z-index: 9999;
    opacity: 0;
    transform: scale(0.97) translateY(-4px);
    transform-origin: top left;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
}

#bb-calendar-dropdown.is-open,
#bb-guests-dropdown.is-open {
    opacity: 1;
    transform: scale(1) translateY(0);
    pointer-events: auto;
}

/* 7.3 — Calendrier Desktop (Double Mois) */
#bb-calendar-dropdown {
    padding: 28px;
    min-width: 720px;
	will-change: transform, opacity;
    backface-visibility: hidden;
}

.bb__calendar-months {
    display: flex;
    gap: 40px;
    justify-content: center;
}

.bb__cal-month { flex: 1; }

.bb__cal-month-header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 24px;
    margin-bottom: 14px;
}

.bb__cal-month-title {
    font-size: 11px;
    font-weight: 700;
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.4em;
    color: var(--color-primary);
}

.bb__cal-nav {
    position: absolute;
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    font-size: 28px;
    font-weight: 200;
    line-height: 1;
    color: var(--color-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    transition: opacity 0.2s ease;
}

.bb__cal-nav:hover { opacity: 0.5; }
.bb__cal-nav--prev { left: 0; }
.bb__cal-nav--next { right: 0; }

.bb__cal-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
}

.bb__cal-weekday {
    font-size: 9px;
    font-weight: 700;
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: #9ca3af;
    text-align: center;
    padding: 4px 0 10px;
}

/* 7.4 — Footer & Bouton "Done" */
.bb__calendar-footer {
    margin-top: 20px;
    padding-top: 20px;
    border-top: 1px solid #f3f4f6;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.bb__calendar-hint {
    font-size: 10px;
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: #9ca3af;
    min-height: 16px;
}

.bb__done-btn,
.bb__confirm-btn {
    background: var(--color-primary);
    color: #ffffff;
    border: none;
    padding: 14px 36px;
    font-size: 9px;
    font-weight: 400;
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.35em;
    cursor: pointer;
    border-radius: 0;
	transition: background-color 0.3s ease, opacity 0.3s ease, transform 0.2s ease;
    will-change: opacity, transform;
}

/* 7.5 — Guest Picker Desktop */
#bb-guests-dropdown {
    padding: 24px;
    width: 280px;
	will-change: transform, opacity;
}

.bb__guest-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 0;
    border-bottom: 1px solid #f3f4f6;
}

.bb__guest-row:last-of-type { border-bottom: none; }

.bb__guest-label {
    font-size: 10px;
    font-weight: 700;
    font-family: var(--font-body);
    text-transform: uppercase;
    letter-spacing: 0.15em;
    color: #9ca3af;
}

.bb__guest-ctrl {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
}

.bb__counter-btn {
    width: 28px;
    height: 28px;
    display: flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #f3f4f6;
    background: #ffffff;
    color: var(--color-primary);
    font-size: 16px;
    font-weight: 300;
    line-height: 0;
    padding: 0;
    cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease, transform 0.1s ease;
}

.bb__counter-btn:hover { 
    background: #f3f4f6; 
    border-color: #9ca3af; 
}

.bb__guest-count {
    font-size: 13px;
    font-weight: 400;
    font-family: var(--font-body);
    color: var(--color-primary);
    min-width: 24px;
    text-align: center;
    display: inline-block;
}

.bb__confirm-btn {
    width: 100%;
    margin-top: 20px;
}


/* ── Overlay ── */
#bb-overlay {
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(0,0,0,0.04);
  display: none;
  cursor: default;
}
#bb-overlay.is-visible { display: block; }

/*
========================================================
SUBMENU OVERLAY BAR - SUBMENU ACTIVE STATE
========================================================
Uses WordPress "page-id-*" classes
Each section is linked to a specific page.

Seminars  -> page-id-3323
Events     -> page-id-4752
Quote      -> page-id-5607

IMPORTANT:
- These IDs are site-specific (WordPress generates them)
- They must be updated for each hotel installation
========================================================
*/

.submenu-bar-overlay {
    position: fixed;
    z-index: 999;
    width: 100%;
}

.page-id-3156 .submenu-bar-overlay .submenu-meetings,
.page-id-3323 .submenu-bar-overlay .submenu-seminars,
.page-id-5730 .submenu-bar-overlay .submenu-quote
{
    display: inline-block;
	color: #F2F2F2;
    position: relative;
    border-bottom: none;
}


/* On crée le trait avec un élément virtuel */
.page-id-3156 .submenu-bar-overlay .submenu-meetings::after,
.page-id-3323 .submenu-bar-overlay .submenu-seminars::after,
.page-id-5730 .submenu-bar-overlay .submenu-quote::after
{
    content: "";
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 3px;
   background-color: rgba(224, 198, 149, 0.35);
}



/* Désactive le grid sur la liste des chambres en mobile */
@media (max-width: 768px) {
    body .wp-block-post-template.is-layout-grid {
        display: flex;
        flex-direction: column;
        gap: 2rem;
    }
}

/* ============================================================
   8 — FLUENT FORMS
   ============================================================ */

/* 8.1 — Conteneur global */
.frm-fluent-form {
    background: #fff;
    margin: 0 auto;
}

/* 8.2 — Champs de saisie (Inputs, Selects, Textarea) */
.frm-fluent-form input[type="text"],
.frm-fluent-form input[type="email"],
.frm-fluent-form input[type="tel"],
.frm-fluent-form input[type="number"],
.frm-fluent-form input[type="date"],
.frm-fluent-form input[type="url"],
.frm-fluent-form textarea,
.ff-default .ff-el-form-control,
.ff-default select.ff-el-form-control,
.frm-fluent-form select {
    width: 100% !important;
    background: #f0f0f0 !important;
    border: none !important;
    border-bottom: 1px solid var(--color-primary) !important;
    border-radius: 0 !important;
    padding: 16px 14px !important;
    font-family: var(--font-heading) !important;
    font-size: 14px !important;
    color: #606266 !important;
    -webkit-text-fill-color: #606266 !important;
    height: 52px !important;
    box-sizing: border-box;
    outline: none !important;
    box-shadow: none !important;
    appearance: none !important;
    -webkit-appearance: none !important;
}

/* 8.3 — Spécificités pour les menus déroulants (Select) */
.frm-fluent-form select,
.ff-default select.ff-el-form-control {
    background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3e%3cpath fill='%23606266' d='M6 8L0 0h12z'/%3e%3c/svg%3e") !important;
	background-size: 10px 6px !important;
    background-repeat: no-repeat !important;
    background-position: right 14px center !important;
    padding-right: 40px !important;
}

/* 8.4 — États Focus & Placeholder */
.frm-fluent-form input:focus,
.frm-fluent-form select:focus,
.frm-fluent-form textarea:focus {
    background: #ebebeb !important;
}

.frm-fluent-form input::placeholder,
.frm-fluent-form textarea::placeholder {
    color: #888;
    font-style: italic;
    opacity: 0.7;
    font-family: var(--font-heading);
}

/* 8.5 — Bouton Soumettre */
.frm-fluent-form .ff-btn-submit,
.frm-fluent-form button[type="submit"],
form.fluent_form_7 .ff-btn-submit:not(.ff_btn_no_style) {
    background: var(--color-primary) !important;
    color: #fff !important;
    font-family: var(--font-body) !important;
    font-size: var(--fs-btn-small) !important;
    letter-spacing: 0.2em !important;
    text-transform: uppercase !important;
    padding: 18px 56px !important;
    border: none !important;
    border-radius: 0 !important;
    cursor: pointer !important;
    display: block !important;
    margin: 0 auto !important;
    width: auto;
    transition: background 0.2s;
}

.frm-fluent-form .ff-btn-submit:hover {
    background: #333 !important; /* Couleur de repli sombre pour le hover */
}

/* 8.6 — Mobile (Adaptations ergonomiques) */
@media (max-width: 767px) {
    .frm-fluent-form { 
        padding: 30px 20px; 
    }
    
    /* 16px minimum pour éviter le zoom iOS forcé sur les champs */
    .frm-fluent-form input, 
    .frm-fluent-form select, 
    .frm-fluent-form textarea { 
        font-size: 16px !important; 
    }
    
    /* Le bouton prend toute la largeur pour faciliter le clic au pouce */
    .frm-fluent-form .ff-btn-submit { 
        width: 100% !important; 
    }
}

/* ==========================================================================
   PREFIXE GLOBAL POUR LES SLIDERS SWIPER (Thème Enfant)
   ========================================================================== */

.dd-accommodations-wrap {
  width: 100%;
  background: #ffffff;
  text-align: center;
  box-sizing: border-box;
  overflow: visible;
  position: relative;
  display: flex;
  flex-direction: column;
}

.dd-swiper {
  width: 100%;
  height: 535px; 
  padding: 20px 0 0 0;
  overflow: visible;
}

.dd-swiper .swiper-wrapper { 
  align-items: flex-start; 
}

.dd-swiper .swiper-slide {
  width: 380px; 
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  opacity: 0.6 !important;
  transform: scale(0.85) !important;
  transition: transform 0.8s ease, opacity 0.8s ease;
  will-change: transform, opacity;
}

.dd-slide__img-container {
  width: 100%;
  max-width: 380px;
  height: 280px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
}

.dd-slide__img-container::after {
  content: '';
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  box-shadow: 0 20px 50px rgba(0,0,0,0.12);
  opacity: 0;
  transition: opacity 0.8s ease;
  pointer-events: none;
  z-index: -1;
}

.dd-swiper .swiper-slide .dd-slide__img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.dd-swiper .swiper-slide-active { 
  transform: scale(1)!important;
  opacity: 1 !important;
  z-index: 10 !important; 
}

.dd-swiper .swiper-slide-active .dd-slide__img-container::after {
  opacity: 1;
}

.dd-slide__label {
  position: absolute; 
  bottom: 20px; 
  left: 0; 
  right: 0;
  font-family: var(--font-heading), serif; 
  font-size: 11px;
  letter-spacing: 0.2em; 
  text-transform: uppercase; 
  color: #ffffff;
  transition: opacity 0.3s;
}

.swiper-slide-active .dd-slide__label { 
  opacity: 0; 
}

.dd-slide__content {
  width: 100%;
  background: #faf8f5;
  padding: 24px;
  box-sizing: border-box;
  height: 210px;
  opacity: 0;
  transform: translateY(-10px);
  pointer-events: none;
  transition: opacity 0.5s ease, transform 0.5s ease;
  box-shadow: 0 20px 60px rgba(44, 40, 37, 0.12);
  will-change: opacity, transform;
}

.swiper-slide-active .dd-slide__content {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

.dd-slide__name { 
  font-family: var(--font-heading), serif; 
  font-size: 12px; 
  font-weight: 600; 
  letter-spacing: 0.2em; 
  text-transform: uppercase; 
  margin: 0 0 10px 0; 
  color: #000; 
}

.dd-slide__divider { 
  width: 30px; 
  height: 1px; 
  background: #000; 
  margin: 0 auto 14px; 
}

.dd-slide__desc { 
  font-family: var(--font-heading), serif; 
  font-size: 13px; 
  font-style: italic; 
  color: #555; 
  line-height: 1.7; 
  margin: 0 0 20px 0; 
}

.dd-slide__buttons { 
  display: flex;
  justify-content: center; 
}
.dd-slide__buttons a {
  margin: 0 5px; 
}

.dd-slide__btn-primary { 
  padding: 11px 18px; 
  background: #000; 
  color: #fff; 
  font-family: var(--font-body);
  font-size: 9px; 
  letter-spacing: 0.2em; 
  text-transform: uppercase; 
  text-decoration: none; 
}

.dd-slide__btn-secondary { 
  padding: 11px 18px; 
  border: 1px solid #000; 
  color: #000; 
  font-family: var(--font-body); 
  font-size: 9px; 
  letter-spacing: 0.2em; 
  text-transform: uppercase; 
  text-decoration: none; 
}

.dd-swiper-nav { 
  display: flex; 
  align-items: center; 
  justify-content: center;  
  padding: 20px 0 30px 0; 
  height: 50px; 
}

.dd-swiper-nav button,
.dd-swiper-nav .dd-counter {
  margin: 0 12px; 
}

.dd-swiper-nav button { 
  background: none; 
  border: none; 
  cursor: pointer; 
  font-size: 20px; 
  color: #000; 
  transition: 0.3s; 
  padding: 10px; 
}

.dd-counter { 
  font-family: var(--font-heading), serif; 
  font-size: 14px; 
  color: #000; 
  min-width: 60px; 
}

/* ==========================================================================
   VERSION MOBILE GLOBAL
   ========================================================================== */
@media (max-width: 768px) {
  .dd-swiper { 
    height: 515px; 
    padding-bottom: 0; 
  }
  .dd-swiper .swiper-slide { 
    width: 85vw; 
    transform: scale(0.9); 
  }
  .dd-swiper .swiper-slide-active { 
    transform: scale(1); 
  }
  .dd-slide__img-container,
  .dd-swiper .swiper-slide-active .dd-slide__img-container { 
    height: 220px; 
  }
  .dd-slide__content {
    height: 260px;
    padding: 20px 15px;
  }
  .dd-slide__buttons { 
    flex-direction: column;  
  }
	
  .dd-slide__buttons a:first-child {
  margin-bottom: 8px; 
}
  .dd-slide__btn-primary, 
  .dd-slide__btn-secondary { 
    width: 100%; 
    box-sizing: border-box; 
  }
}
/* ==========================================================================
   PREFIXE GLOBAL : SLIDER RESTAURATION / SERVICES (Thème Enfant)
   ========================================================================== */

.dr-services-wrap {
  width: 100%;
  background: #ffffff;
  text-align: center;
  box-sizing: border-box;
  overflow: visible;
  position: relative;
  display: flex;
  flex-direction: column;
}

.dr-swiper {
  width: 100%;
  height: 580px; 
  padding: 20px 0 0 0;
  overflow: visible;
}

.dr-swiper .swiper-wrapper { 
  align-items: flex-start; 
}

.dr-swiper .swiper-slide {
  width: 320px; 
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  cursor: pointer;
  opacity: 0.5 !important;
  transform: scale(0.88) !important;
  transition: transform 0.8s ease, opacity 0.8s ease;
  will-change: transform, opacity;
  z-index: 1;
}

/* Image INACTIVE — haute */
.dr-slide__img-container {
  width: 100%;
  max-width: 320px;
  height: 380px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  transition: height 0.8s ease, box-shadow 0.8s ease;
}

.dr-swiper .swiper-slide .dr-slide__img-container img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

/* Slide ACTIVE */
.dr-swiper .swiper-slide-active {
  transform: scale(1) !important;
  opacity: 1 !important;
  z-index: 10;
}

/* Image ACTIVE — réduite, le texte monte */
.dr-swiper .swiper-slide-active .dr-slide__img-container {
  height: 220px;
  box-shadow: 0 20px 50px rgba(0,0,0,0.15);
}

/* Label sur slides inactives */
.dr-slide__label {
  position: absolute;
  bottom: 20px;
  left: 0;
  right: 0;
  font-family: var(--font-heading);
  font-size: 11px;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  color: #ffffff;
  transition: opacity 0.3s;
}

.dr-swiper .swiper-slide-active .dr-slide__label { 
  opacity: 0; 
}

/* Contenu texte */
.dr-slide__content {
  width: 100%;
  background: #ffffff;
  padding: 0 24px;
  box-sizing: border-box;
  opacity: 0;
  height: 0;
  overflow: hidden;
  transition: opacity 0.5s ease, height 0.5s ease, padding 0.5s ease;
  box-shadow: 0 20px 60px rgba(44, 40, 37, 0.12);
}

.dr-swiper .swiper-slide-active .dr-slide__content {
  opacity: 1;
  height: 230px;
  padding: 28px 24px;
}

/* Typographie */
.dr-slide__category {
  font-family: var(--font-heading);
  font-size: 13px;
  font-style: italic;
  color: #888;
  margin: 0 0 8px 0;
}

.dr-slide__name {
  font-family: var(--font-heading);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.15em !important;
  text-transform: uppercase;
  margin: 0 0 12px 0;
  color: #000;
}

.dr-slide__divider {
  width: 30px;
  height: 1px;
  background: #000;
  margin: 0 auto 16px;
}

.dr-slide__desc {
  font-family: var(--font-heading);
  font-size: 13px;
  color: #555;
  line-height: 1.7;
  margin: 0 0 20px 0;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.dr-slide__buttons { 
  display: flex; 
  justify-content: center; 
}

.dr-slide__btn-primary {
  padding: 13px 32px;
  background: #000;
  color: #fff;
  font-family: var(--font-body); 
  font-size: 9px;
  letter-spacing: 0.2em !important;
  text-transform: uppercase;
  text-decoration: none;
  display: inline-block;
}

/* Navigation sécurisée sans gap */
.dr-swiper-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0 30px 0;
  height: 50px;
}

.dr-swiper-nav button {
  background: none;
  border: none;
  cursor: pointer;
  font-size: 20px;
  color: #000;
  transition: 0.3s;
  padding: 10px;
}

.dr-swiper-nav button,
.dr-swiper-nav .dr-counter {
  margin: 0 12px !important;
}

.dr-counter {
  font-family: var(--font-heading);
  font-size: 14px;
  color: #000;
  min-width: 60px;
}

/* ==========================================================================
   VERSION MOBILE RESTAURATION
   ========================================================================== */
@media (max-width: 768px) {
  .dr-swiper { 
    height: 580px; 
  }
  .dr-swiper .swiper-slide { 
    width: 85vw; 
    transform: scale(0.9) !important; 
  }
  .dr-swiper .swiper-slide-active { 
    transform: scale(1) !important; 
  }
  .dr-slide__img-container { 
    height: 280px; 
  }
  .dr-swiper .swiper-slide-active .dr-slide__img-container { 
    height: 180px; 
  }
  .dr-swiper .swiper-slide-active .dr-slide__content { 
    height: 260px; 
    padding: 20px 15px; 
  }
  .dr-slide__btn-primary { 
    width: 100%; 
    box-sizing: border-box; 
    text-align: center; 
  }
}

/* ==========================================================================
   PREFIXE GLOBAL : GALERIE MULTIMEDIA (Thème Enfant)
   ========================================================================== */

.dg-media-slider-wrap { 
  position: relative; 
}

.dg-media-swiper { 
  width: 100%; 
  height: auto; 
  overflow: visible; 
  padding: 0; 
  position: relative; 
}

.dg-media-swiper .swiper-wrapper { 
  align-items: flex-start; 
}

.dg-media-swiper .swiper-slide { 
  width: 700px; 
  cursor: pointer; 
  opacity: 0.35 !important; 
  transition: opacity 0.8s ease; 
  will-change: opacity; 
  z-index: 1;
}

.dg-media-swiper .swiper-slide-active { 
  opacity: 1 !important; 
  z-index: 10; 
}

.dg-media__container { 
  width: 100%; 
  aspect-ratio: 16 / 9; 
  overflow: hidden; 
  position: relative; 
  background: #111; 
}

.dg-media-swiper .swiper-slide .dg-media__container img { 
  width: 100%; 
  height: 100%; 
  object-fit: cover; 
  display: block; 
}

.dg-media__desc {
  text-align: center;
  padding: 30px 20px 0;
  opacity: 0;
  height: 90px;
  transition: opacity 0.5s ease;
}

.dg-media-swiper .swiper-slide-active .dg-media__desc { 
  opacity: 1; 
}

.dg-media__desc p { 
  font-family: var(--font-heading); 
  font-size: 15px; 
  font-style: italic; 
  color: #aaa; 
  line-height: 1.8; 
  margin: 0; 
}

/* Flèches de navigation positionnées en absolu */
.dg-media-nav { 
  position: absolute; 
  top: 40%; 
  transform: translateY(-50%); 
  width: 100%; 
  left: 0; 
  display: flex; 
  justify-content: space-between; 
  padding: 0 20px; 
  box-sizing: border-box; 
  pointer-events: none; 
  z-index: 20; 
}

.dg-media-nav button { 
  pointer-events: all; 
  background: none; 
  border: none; 
  color: #ffffff; 
  font-size: 48px; 
  cursor: pointer; 
  padding: 10px 20px; 
  transition: opacity 0.3s; 
  opacity: 0.6; 
  font-family: var(--font-heading); 
  line-height: 1; 
}

.dg-media-nav button:hover { 
  opacity: 1; 
}

/* ==========================================================================
   VERSION MOBILE GALERIE
   ========================================================================== */
@media (max-width: 768px) {
  .dg-media-swiper .swiper-slide { 
    width: 90vw; 
  }
  .dg-media-swiper .swiper-slide-active .dg-media__desc { 
    height: 110px; 
  }
  .dg-media-nav button { 
    font-size: 32px; 
    padding: 10px; 
  }
}