/* ════════════════════════════════════════════════════════════════════
   Fix toggle remove invisible — override 11309 .mini_cart_item.mini_cart_item
   (spec [0,4,2]) qui écrasait la transition opacity/height du .eds-leaving.
   Double-class boost sur eds-leaving/removing/prev-leaving.
   ════════════════════════════════════════════════════════════════════ */
#cart-drawer ul.woocommerce-mini-cart .mini_cart_item.mini_cart_item.eds-leaving {
    opacity: 0 !important;
    height: 0 !important;
    min-height: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    border-top-width: 0 !important;
    border-bottom-width: 0 !important;
    overflow: hidden !important;
    transition: opacity 0.25s ease-out,
        height 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        margin 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        padding 0.4s cubic-bezier(0.4, 0, 0.2, 1),
        border 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}
#cart-drawer ul.woocommerce-mini-cart .mini_cart_item.mini_cart_item.eds-removing > *:not(.blockUI) {
    opacity: 0.55 !important;
    transition: opacity 0.3s ease-out !important;
}
#cart-drawer ul.woocommerce-mini-cart .mini_cart_item.mini_cart_item.eds-prev-leaving {
    border-bottom-color: transparent !important;
    transition: border-bottom-color 0.4s cubic-bezier(0.4, 0, 0.2, 1) !important;
}


/* ════════════════════════════════════════════════════════════════════
   Source : eds_snippet 11317
   */
/* Mini cart remove overlay — rounded corners via LI clip.
   The LI has overflow:hidden already. We add border-radius:8 to the LI during
   eds-removing state. The LI clips ALL children (including the overlay) to a
   rounded shape regardless of the overlay's own rendering. */

html body #cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item.eds-removing {
    border-radius: 8px !important;
}

/* Overlay aligne sur le drawer-content visible : 24px du bord drawer-inner
   a gauche (= padding-right) et 24px a droite (= LI-right - 16, puisque le UL
   s'etend 16px past le bord visible via margin-right:-16px). Inclut la trash
   et reste aligne avec sous-total, separateurs, boutons. */
html body #cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item .blockUI.blockOverlay,
html body #cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item div.blockUI.blockOverlay {
    border-radius: 8px !important;
    left: 0 !important;
    right: 16px !important;
}


/* ════════════════════════════════════════════════════════════════════
   Source : eds_snippet 11320
   */
/* Sur mobile/tablette (pointer coarse), timing asymetrique de l'opacite du drawer :
   - Ouverture : opacite atteint 1 plus tot (0.25s, aucun delay)
   - Fermeture : opacite reste a 1 quasi tout le slide ET au-dela (delay 0.70s puis
     fade snap 0.05s). Le snap final fade le backdrop apres que le drawer (slide) soit
     deja offscreen depuis longtemps, ce qui laisse au regard le temps de se reposer
     sur la page revelee avant que le backdrop ne s'efface completement.
   - Box-shadow du panneau drawer : fade synchrone avec le slide (0.6s) declenchee par
     le retrait de .active (synchrone du clic, vs .show-drawer qui a 280ms de delai
     interne Kadence). Sans ce fade, l'ombre portee restait visible (-8px 24px) apres
     que le drawer soit offscreen, produisant un halo residuel a droite de l'ecran
     suivi d'un snap brutal au moment du fade backdrop.

   Sur mobile strict (max-width: 767px) : backdrop drawer-overlay supprime
   completement. Raison : le bandeau systeme Android (One UI / Pixel) reste de la
   couleur du fond de page (creme) alors que le backdrop dimme le reste — discordance
   visuelle qu'on ne peut pas resoudre fiablement. Plutot que de garder ce voile
   imparfait, on l'enleve sur telephone. La cart garde deux mecanismes de fermeture
   autonomes : la croix + le swipe-to-close (snippet 11319), donc la perte du
   tap-outside-to-close du backdrop n'est pas un manque.

   IMPORTANT specificite : on doit battre le snippet "Header + drawer minicarte"
   - opacity wrapper : leur regle (0,1,1,0) -> ma regle (0,1,1,2) via "html body"
   - box-shadow inner : leur regle (0,1,3,0) -> ma regle (0,1,3,2) via "html body" + :not */

@media (pointer: coarse) {

    /* === Etat FERME (defaut) — transition utilisee lors de la FERMETURE === */
    html body #cart-drawer.popup-drawer {
        transition: opacity 0.05s ease-out 0.70s, visibility 0s linear 0.75s !important;
    }
    html body #cart-drawer.popup-drawer .drawer-overlay {
        transition: opacity 0.05s ease-in-out 0.70s !important;
    }
    /* Box-shadow inner : alpha 0 quand .active retire, transition synchro slide */
    html body #cart-drawer.popup-drawer:not(.active) .drawer-inner {
        box-shadow: -8px 0 24px rgba(42, 26, 8, 0) !important;
        transition:
            transform 0.6s ease-out,
            width 0.4s ease-out,
            box-shadow 0.6s ease-out !important;
    }

    /* === Etat OUVERT — transition utilisee lors de l'OUVERTURE === */
    html body #cart-drawer.popup-drawer.show-drawer {
        transition: opacity 0.25s ease-out, visibility 0s linear 0s !important;
    }
    html body #cart-drawer.popup-drawer.show-drawer .drawer-overlay {
        transition: opacity 0.25s ease-in-out !important;
    }
    /* Box-shadow inner : alpha 0.18 quand .active present */
    html body #cart-drawer.popup-drawer.active .drawer-inner {
        box-shadow: -8px 0 24px rgba(42, 26, 8, 0.18) !important;
        transition:
            transform 0.6s ease-out,
            width 0.4s ease-out,
            box-shadow 0.6s ease-out !important;
    }
}

/* Mobile strict : pas de backdrop sur la minicarte (eviter la discordance
   avec le bandeau systeme Android qui reste de la couleur de fond de page). */
@media (max-width: 767px) {
    html body #cart-drawer.popup-drawer .drawer-overlay {
        display: none !important;
    }
}


/* ════════════════════════════════════════════════════════════════════
   Source : eds_snippet 11314
   */
/* ===== PANIER VIDE ===== */
/* :has(empty-message) garantit aucun effet sur le panier avec articles. */
#cart-drawer .drawer-content:has(.woocommerce-mini-cart__empty-message) {
  padding-right: 24px !important;
}
#cart-drawer .kadence-mini-cart-refresh:has(.woocommerce-mini-cart__empty-message) {
  justify-content: center !important;
  align-items: center !important;
}

/* ===== PANIER AVEC ARTICLES =====
   Objectif : apparence 24px a gauche ET a droite (sous-total, separateurs, trash,
   boutons) sans deplacer la scrollbar (qui reste a ~8px du bord droit).

   Mecanique :
   1. drawer-content : padding-right passe de 8px -> 24px -> tous ses enfants
      (sous-total, boutons) s'arretent a 24px du bord droit.
   2. UL.woocommerce-mini-cart : margin-right: -16px -> le UL s'etend de 16px
      vers la droite pour compenser le nouveau padding-right. Sa position
      relative au drawer-inner reste identique (8px), donc la scrollbar
      (calculee d'apres ulRect.right par snippet 11309) ne bouge pas.
   3. Trash icon : right: 20px -> 16px (depuis le bord droit de l'item) ->
      apparait a 24px du bord droit du drawer-inner (8 + 16).
   4. Separateurs : border-bottom native 1px (pixel-snappee par le moteur,
      uniforme sur tout DPR). Un ::after rectangle de couleur fond #fff9ef
      masque les 16px droits de chaque border pour l'aligner a 24px du bord
      droit du drawer-inner (comme sous-total/boutons).
*/

#cart-drawer.popup-drawer .drawer-content:has(.mini_cart_item) {
  padding-right: 24px !important;
}

#cart-drawer.popup-drawer:has(.mini_cart_item) ul.woocommerce-mini-cart {
  margin-right: -16px !important;
}

#cart-drawer.popup-drawer .mini_cart_item a.remove,
#cart-drawer.popup-drawer .mini_cart_item a.remove_from_cart_button {
  right: 16px !important;
}

#cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item.mini_cart_item {
  border-bottom: 1px solid rgba(184, 146, 74, 0.32) !important;
  position: relative !important;
}
#cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item:last-child {
  border-bottom: 0 !important;
}
#cart-drawer.popup-drawer ul.woocommerce-mini-cart .mini_cart_item:not(:last-child)::after {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  bottom: -1px !important;
  right: 0 !important;
  left: auto !important;
  width: 16px !important;
  height: 1px !important;
  background-color: #fff9ef !important;
  pointer-events: none !important;
}

/* ===== FIX OMBRES BOUTONS MINICART =====
   Les 2 boutons (Voir le panier / Commander) ont des box-shadow qui debordent
   ~14px a gauche et ~12px a droite. Or .kadence-mini-cart-refresh et
   .mini-cart-container sont forces a overflow:hidden par 11309 (systeme scroll).
   Bascule en overflow:clip + overflow-clip-margin:16px : meme layout, mais 16px
   d'air avant clip -> ombres entieres, largeur des boutons inchangee.

   Spec boostee par double-classe car 11309 charge apres et a meme specificite
   par defaut.
*/
#cart-drawer .kadence-mini-cart-refresh.kadence-mini-cart-refresh,
#cart-drawer .mini-cart-container.mini-cart-container {
  overflow: clip !important;
  overflow-clip-margin: 16px !important;
}


/* ════════════════════════════════════════════════════════════════════
   Source : eds_snippet 11312
   */
@keyframes eds-nav-in {
  0%   { clip-path: inset(0 -40px 100% -40px); opacity: 0; }
  25%  { opacity: 1; }
  100% { clip-path: inset(0 -40px -40px -40px); opacity: 1; }
}
@keyframes eds-nav-out {
  0%   { clip-path: inset(0 -40px -40px -40px); opacity: 1; }
  75%  { opacity: 1; }
  100% { clip-path: inset(0 -40px 100% -40px); opacity: 0; }
}

@media screen and (max-width: 1024px) {
  .popup-drawer.popup-mobile-drawer-side-right.active .drawer-inner {
    transform: translateX(0%) !important;
    opacity: 1 !important;
  }
}

@media (max-width: 980px) {
  .nav-toggle {
    width: 32px !important;
    height: 32px !important;
    color: #5b5046 !important;
    margin-left: -12px !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .nav-toggle:hover,
  .nav-toggle:focus,
  .nav-toggle:active,
  .nav-toggle[aria-expanded="true"] {
    background: transparent !important;
    box-shadow: none !important;
    color: #5b5046 !important;
  }
  .nav-toggle .bar {
    width: 24px !important;
    height: 2px !important;
    background-color: #5b5046 !important;
    left: 50% !important;
    transform: translate3d(-50%, 0, 0) !important;
    will-change: transform !important;
  }
  .nav-toggle .bar:nth-of-type(1) { top: 9px !important; }
  .nav-toggle .bar:nth-of-type(2) { top: 15px !important; }
  .nav-toggle .bar:nth-of-type(3) { top: 21px !important; }
  .nav-toggle[aria-expanded="true"] .bar:nth-child(1) {
    top: 50% !important;
    transform: translate3d(-50%, -50%, 0) rotate(45deg) !important;
  }
  .nav-toggle[aria-expanded="true"] .bar:nth-child(2) {
    opacity: 0 !important;
  }
  .nav-toggle[aria-expanded="true"] .bar:nth-child(3) {
    top: 50% !important;
    transform: translate3d(-50%, -50%, 0) rotate(-45deg) !important;
  }
  .header-cart-wrap,
  .nav-toggle { align-self: center !important; }
  .site-header .site-container,
  .site-header .container {
    padding-left: 64px !important;
    padding-right: 64px !important;
  }

  .nav-list:not(.is-open):not(.is-closing) {
    display: none !important;
  }

  .nav-list.is-open,
  .nav-list.is-closing {
    margin: 0 !important;
    left: 0 !important;
    right: 0 !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 0 !important;
    padding: var(--sp-5, 1.25rem) !important;
    background: #f3efe6 !important;
    box-shadow: 0 6px 16px rgba(42, 26, 8, 0.12), 0 2px 6px rgba(42, 26, 8, 0.05) !important;
  }

  .nav-list.is-open li,
  .nav-list.is-closing li {
    border-bottom: 1px solid var(--gold-border, rgba(139,100,42,0.18)) !important;
  }
  .nav-list.is-open li:last-child,
  .nav-list.is-closing li:last-child {
    border-bottom: 0 !important;
  }
  .nav-list.is-open a,
  .nav-list.is-closing a {
    display: block !important;
    padding: 0.9em 0 !important;
  }

  .nav-list.is-open {
    animation: eds-nav-in 0.55s ease-out 0.15s both !important;
  }
  .nav-list.is-closing {
    display: flex !important;
    animation: eds-nav-out 0.45s ease-out both !important;
  }
}

@media (min-width: 586px) and (max-width: 980px) {
  .nav-list.is-open,
  .nav-list.is-closing {
    left: auto !important;
    right: 0 !important;
    width: 100% !important;
    max-width: 400px !important;
  }
}

@media (max-width: 585px) {
  html header.site-header .nav-toggle .bar { width: 24px !important; }
  html header.site-header .nav-toggle .bar:nth-of-type(1) { top: 7px !important; }
  html header.site-header .nav-toggle .bar:nth-of-type(2) { top: 13px !important; }
  html header.site-header .nav-toggle .bar:nth-of-type(3) { top: 19px !important; }
  html header.site-header .nav-toggle[aria-expanded="true"] .bar:nth-of-type(1) { top: 50% !important; }
  html header.site-header .nav-toggle[aria-expanded="true"] .bar:nth-of-type(2) { opacity: 0 !important; }
  html header.site-header .nav-toggle[aria-expanded="true"] .bar:nth-of-type(3) { top: 50% !important; }

  .nav-list.is-open,
  .nav-list.is-closing {
    padding-left: 2.6rem !important;
    padding-right: 2.6rem !important;
  }
}

@media (max-width: 485px) {
  .site-header .site-container,
  .site-header .container {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }
}


/* ════════════════════════════════════════════════════════════════════
   Source : eds_snippet 11248 (CSS pur — JS armTransitions dans drawer.js)
   === HEADER + DRAWER MINICARTE STYLE DIVI ===
   ════════════════════════════════════════════════════════════════════ */

header.site-header {
    z-index: 1000 !important;
    position: fixed !important;
}

@media (max-width: 980px) {
    header.site-header .nav-toggle { margin-left: 8px; }
}

header.site-header .header-cart-total,
header.site-header .header-cart-button .header-cart-total,
header.site-header span.header-cart-total {
    background-color: #b8924a !important;
    color: #fff9ef !important;
    border-radius: 50% !important;
    font-family: "Montserrat", sans-serif !important;
    font-weight: 600 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    min-width: 30px !important;
    min-height: 30px !important;
    width: 30px !important;
    height: 30px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    position: relative !important;
    margin-left: 6px !important;
    padding: 0 !important;
    overflow: hidden;
    transform: scale(1);
    opacity: 1;
    transition: none !important;
}

header.site-header .header-cart-total.eds-tr-ready,
header.site-header .header-cart-button .header-cart-total.eds-tr-ready,
header.site-header span.header-cart-total.eds-tr-ready {
    transition: width 0.4s ease, min-width 0.4s ease, padding 0.4s ease, margin 0.4s ease, opacity 0.6s ease-out, transform 0.6s ease-out !important;
}

header.site-header span.header-cart-total.header-cart-is-empty-true,
header.site-header .header-cart-button span.header-cart-total.header-cart-is-empty-true {
    opacity: 0 !important;
    transform: scale(0.85) !important;
}

@media (max-width: 980px) {
    header.site-header span.header-cart-total.header-cart-is-empty-true,
    header.site-header .header-cart-button span.header-cart-total.header-cart-is-empty-true,
    header.site-header .header-cart-wrap span.header-cart-total.header-cart-is-empty-true {
        width: 0 !important;
        min-width: 0 !important;
        padding: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        opacity: 0 !important;
    }
}

@media (max-width: 685px) {
    header.site-header .header-cart-total,
    header.site-header .header-cart-button .header-cart-total {
        min-width: 27px !important;
        min-height: 27px !important;
        width: 27px !important;
        height: 27px !important;
        font-size: 16px !important;
        margin-right: 0 !important;
    }
}

@media (max-width: 585px) {
    header.site-header,
    header.site-header .container {
        height: 56px !important;
        min-height: 56px !important;
    }
    header.site-header .brand,
    header.site-header .brand-logo {
        max-height: 40px !important;
        height: auto !important;
        width: auto !important;
    }
    header.site-header .nav-toggle {
        width: 28px !important;
        height: 28px !important;
        margin-left: 0 !important;
    }
    header.site-header .nav-toggle .bar {
        width: 20px !important;
        height: 2px !important;
    }
    header.site-header .nav-toggle .bar:nth-child(1) { top: calc(50% - 6px) !important; }
    header.site-header .nav-toggle .bar:nth-child(3) { top: calc(50% + 6px) !important; }
    html body header.site-header .container,
    html body header#header.site-header .container { gap: 10px !important; }
}

/* === DRAWER MINICARTE === */

#cart-drawer.popup-drawer {
    display: block !important;
    z-index: 100 !important;
    transition: opacity 0.3s ease-out, visibility 0s linear 0.3s !important;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
#cart-drawer.popup-drawer.show-drawer {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition: opacity 0.3s ease-out, visibility 0s linear 0s !important;
}

#cart-drawer .drawer-overlay {
    top: 80px !important;
    transition: opacity 0.3s ease-out !important;
}

#cart-drawer.popup-drawer.popup-drawer .drawer-inner,
#cart-drawer.popup-drawer.show-drawer.show-drawer .drawer-inner {
    top: 80px !important;
    bottom: 0 !important;
    height: auto !important;
    max-height: none !important;
    width: 380px !important;
    max-width: calc(100vw - 16px) !important;
    background: #fff9ef !important;
    border-radius: 0 !important;
    box-shadow: -8px 0 24px rgba(42, 26, 8, 0.18) !important;
    opacity: 1 !important;
    transition: transform 0.6s ease-out, width 0.4s ease-out !important;
}

@media (max-width: 980px) {
    #cart-drawer.popup-drawer.popup-drawer .drawer-inner,
    #cart-drawer.popup-drawer.show-drawer.show-drawer .drawer-inner {
        width: 360px !important;
    }
}

@media (max-width: 585px) {
    #cart-drawer .drawer-overlay { top: 56px !important; }
    #cart-drawer.popup-drawer.popup-drawer .drawer-inner,
    #cart-drawer.popup-drawer.show-drawer.show-drawer .drawer-inner {
        top: 56px !important;
        width: 100vw !important;
        max-width: none !important;
    }
}

body.showing-popup-drawer-from-right,
body.kadence-scrollbar-fixer {
    overflow: visible !important;
    padding-right: 0 !important;
}