/* ================================================================
   VENETE Burger Menu — v2.0.0 — Beekom Studio
   Safari-compatible : transform translateY au lieu de clip-path
================================================================ */

.venete-burger-widget {
    display: inline-flex;
    align-items: center;
}

/* ================================================================
   BOUTON BURGER — z-index max pour rester cliquable au-dessus des panneaux
================================================================ */
.venete-burger-trigger,
button.venete-burger-trigger {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 0 !important; /* carré — configurable via border-radius Elementor */
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    cursor: pointer !important;
    padding: 0 !important;
    box-sizing: content-box !important; /* le padding agrandit le fond autour de l'icône */
    flex-shrink: 0 !important;
    /* z-index local dans le header — le vrai fix est via html.venete-menu-open */
    z-index: 100001;
    position: relative;
    width: 42px;
    height: 42px;
    background-color: #cf1f74;
    border-color: transparent; /* overridé par le control Elementor */
    -webkit-transition: background-color 0.3s ease, border-color 0.3s ease;
    transition: background-color 0.3s ease, border-color 0.3s ease;
}

.venete-burger-icon {
    display: block;
    overflow: visible;
    pointer-events: none;
}

.venete-bar {
    fill: #ffffff;
    /* Les transforms des barres sont gérées en JS pur (RAF) pour
       garantir la compatibilité navigateurs/Elementor */
}


/* ================================================================
   FIX Z-INDEX HEADER
   Quand le menu est ouvert, le header entier (burger + Réserver)
   passe AU-DESSUS des panneaux (z-index 99998/99999).
   Cible Elementor Pro, Astra et les structures header standard.
================================================================ */
html.venete-menu-open .elementor-location-header,
html.venete-menu-open [data-elementor-type="header"],
html.venete-menu-open #masthead,
html.venete-menu-open .ast-desktop-header-main,
html.venete-menu-open header.site-header,
html.venete-menu-open header {
    z-index: 99997 !important; /* En JS aussi pour fiabilité */
}

/* ================================================================
   PANNEAU DROIT
   Safari fix : transform translateY au lieu de clip-path
   translateY(-100%) = panneau au-dessus du viewport (caché)
   translateY(0)     = panneau en place (visible)
================================================================ */
.venete-panel-right {
    position: fixed;
    right: 0;
    top: 0;
    height: 100%;
    overflow: hidden;
    background-color: #bfbaaa;
    z-index: 999992;
    will-change: transform;
    pointer-events: none; /* Pas d'interférence avec la page quand fermé */
    /* Caché au-dessus du viewport */
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
    -webkit-transition: -webkit-transform 0.9s cubic-bezier(.77,0,.175,1);
    transition: transform 0.9s cubic-bezier(.77,0,.175,1);
}
/* admin-bar : panneaux à top:0 pour éviter le bleed */
@media screen and (max-width: 782px) {
}

/* SVG overlay */
.venete-bird-svg {
    position: absolute;
    inset: 0;
    top: 0; left: 0; right: 0; bottom: 0; /* fallback inset */
    width: 100%;
    height: 100%;
    display: block;
    background: transparent;
}

/* Photos dans le SVG */
.venete-photo {
    opacity: 0;
    -webkit-transition: opacity 0.5s ease;
    transition: opacity 0.5s ease;
}
.venete-photo-default {
    opacity: 0; /* Démarre à 0 — JS fait le fade-in après le reveal du panneau */
}

/* Override thème sur les paths SVG */
.venete-bird-svg path {
    fill: #bfbaaa; /* Valeur de secours, écrasée par inline style PHP */
}

/* ================================================================
   PANNEAU GAUCHE
   translateY(100%) = panneau en dessous du viewport (caché)
   translateY(0)    = panneau en place (visible)
================================================================ */
.venete-panel-left {
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    background: #ffffff;
    z-index: 999994;
    display: flex;
    flex-direction: column;
    padding: 48px 52px 52px;
    box-sizing: border-box;
    will-change: transform;
    pointer-events: none; /* Pas d'interférence avec la page quand fermé */
    /* Caché en dessous du viewport */
    -webkit-transform: translateY(100%);
    transform: translateY(100%);
    -webkit-transition: -webkit-transform 0.9s cubic-bezier(.77,0,.175,1);
    transition: transform 0.9s cubic-bezier(.77,0,.175,1);
}

@media screen and (max-width: 782px) {
}

/* ================================================================
   NAVIGATION
================================================================ */
.venete-nav { margin: auto 0; }

.venete-nav-list { list-style: none; padding: 0; margin: 0; }
.venete-nav-list li { margin-bottom: 22px; }
.venete-nav-list li:last-child { margin-bottom: 0; }

.venete-nav-list li a {
    display: inline-block;
    text-decoration: none;
    font-size: clamp(0.85rem, 1.2vw, 1.1rem);
    font-weight: 300;
    letter-spacing: 0.13em;
    text-transform: uppercase;
    color: #c2bdb4;
    -webkit-transition: color 0.25s ease;
    transition: color 0.25s ease;
}
.venete-nav-list li a:hover,
.venete-nav-list li.venete-item-active a {
    color: #1a1a1a;
    font-weight: 400;
}
.venete-nav-list .sub-menu { display: none; }

/* ================================================================
   VISIBILITÉ PAR DEVICE
================================================================ */
@media (min-width: 1025px) {
    .venete-hide-desktop { display: none !important; }
}
@media (min-width: 768px) and (max-width: 1024px) {
    .venete-hide-tablet { display: none !important; }
}
@media (max-width: 767px) {
    .venete-hide-mobile { display: none !important; }
}

/* ================================================================
   RÉSEAUX SOCIAUX
================================================================ */
.venete-social {
    display: flex;
    gap: 10px;
    margin-top: auto;
    padding-top: 40px;
}
.venete-social-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: #1a1a1a;
    color: #ffffff;
    text-decoration: none;
    -webkit-transition: background 0.2s ease;
    transition: background 0.2s ease;
    flex-shrink: 0;
}
.venete-social-link:hover { background: #444; }
.venete-social-link i,
.venete-social-link svg { font-size: 0.9rem; width: 1em; height: 1em; fill: #ffffff; }

/* ================================================================
   RESPONSIVE
================================================================ */
@media (max-width: 768px) {
    .venete-panel-left  { width: 100% !important; padding: 32px 28px 40px; }
    .venete-panel-right, .venete-reserve-trigger[data-wid="8f47342"] { display: none !important; }
}

/* Croix visible sur fond blanc quand menu ouvert
   (override par le control Elementor burger_bar_open_color) */
.venete-burger-trigger.is-open .venete-bar {
    fill: #1a1a1a !important;
}

/* ================================================================
   BACKDROP — couvre tout le contenu de la page quand le menu est ouvert
   (barre de réservation, sticky bars, etc.)
   z-index 99990 < panneaux (99992/99994) < header (99997)
================================================================ */
.venete-backdrop {
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    z-index: 999990;
    background: transparent;
    display: none;
    pointer-events: auto; /* bloque les clics sur la page derrière */
}
.venete-backdrop.is-visible {
    display: block;
}

/* ================================================================
   BOUTON FERMER dans le panneau gauche
   (le header n'est plus boosté → logo + réservation restent derrière)
================================================================ */
.venete-close-btn {
    background: none !important;
    border: none !important;
    outline: none !important;
    box-shadow: none !important;
    cursor: pointer !important;
    font-size: 1.1rem;
    color: #333;
    padding: 0 !important;
    margin-bottom: 48px;
    align-self: flex-start;
    line-height: 1;
    -webkit-transition: opacity 0.2s ease;
    transition: opacity 0.2s ease;
}
.venete-close-btn:hover { opacity: 0.5; }
