/* ============================================
   PATCH - Page produit mobile : galerie stable
   Scope : mobile uniquement
   ============================================ */

@media (max-width: 768px) {
    body.single-product .product-gallery-summary {
        display: flex !important;
        flex-direction: column !important;
        gap: 22px !important;
    }

    body.single-product .woocommerce-product-gallery {
        position: relative !important;
        top: auto !important;
        inset: auto !important;

        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        padding: 0 !important;
        margin: 0 0 22px !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;

        overflow: visible !important;
        transform: none !important;
        contain: none !important;
    }

    body.single-product .woocommerce-product-gallery__wrapper,
    body.single-product .woocommerce-product-gallery__slider,
    body.single-product .woocommerce-product-gallery .swiper-wrapper {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        background: transparent !important;
        border: 0 !important;
        border-radius: 0 !important;

        overflow: visible !important;
        transform: none;
    }

    body.single-product .woocommerce-product-gallery__image,
    body.single-product .woocommerce-product-gallery__image.swiper-slide {
        width: 100% !important;
        height: auto !important;
        min-height: 0 !important;

        background: #111111 !important;
        border: 1px solid #252525 !important;
        border-radius: 16px !important;

        overflow: hidden !important;
    }

    body.single-product .woocommerce-product-gallery__image a {
        display: block !important;
        width: 100% !important;
        height: auto !important;

        background: #111111 !important;
        pointer-events: none !important;
    }

    body.single-product .woocommerce-product-gallery__image img {
        display: block !important;

        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
        max-height: none !important;

        object-fit: contain !important;

        background: #111111 !important;
        border: 0 !important;
        border-radius: 16px !important;
    }

    /* Désactive les éléments lightbox/zoom mobiles qui déclenchent PhotoSwipe */
    body.single-product .glozin-button--product-lightbox,
    body.single-product .woocommerce-product-gallery__trigger {
        display: none !important;
        pointer-events: none !important;
        visibility: hidden !important;
    }

    /* Les miniatures verticales Glozin sont souvent instables sur mobile */
    body.single-product .glozin-product-gallery-thumbnails {
        display: none !important;
    }

    /* Flèches/fraction : pas de couche flottante agressive */
    body.single-product .woocommerce-product-gallery .swiper-button,
    body.single-product .woocommerce-product-gallery .swiper-fraction {
        z-index: 2 !important;
    }
}



/* ============================================
   HEADER MOBILE + MENU MOBILE - FUSIONNE
   Quality CBD ByNiko
   ============================================ */

@media (max-width: 768px) {
    /* Header mobile */
    body .site-header {
        margin-bottom: 20px !important;
        background: #111111 !important;
        border-bottom: 0 !important;
        box-shadow: none !important;
    }

    body .header-mobile-main,
    body .site-header .header-mobile-main {
        --gz-header-mobile-main-border-color: #252525 !important;
        --gz-border-color: #252525 !important;

        background: #111111 !important;
        border-bottom: 1px solid #252525 !important;
        border-top-color: #252525 !important;
        box-shadow: none !important;
    }

    body .site-header::before,
    body .site-header::after,
    body .site-header__container::before,
    body .site-header__container::after {
        content: none !important;
        display: none !important;
    }

    body .header-mobile-main::before,
    body .header-mobile-main::after {
        background: #252525 !important;
        border-color: #252525 !important;
        box-shadow: none !important;
    }

    body .header-mobile-main .site-header__container,
    body .site-header__container {
        min-height: 72px !important;
        padding-bottom: 8px !important;
        color: #f5ecd6 !important;
        border-bottom: 0 !important;
    }

    body .site-header .header-logo img {
        max-height: 42px !important;
        width: auto !important;
    }

    /* Icones header */
    body .site-header .header-hamburger,
    body .site-header .header-search__icon,
    body .site-header .header-cart .header-counter-content {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        padding: 0 !important;
        margin: 0 !important;

        background: #0d0d0d !important;
        border: 1px solid #252525 !important;
        border-radius: 999px !important;

        color: #f5ecd6 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    body .site-header .header-hamburger:hover,
    body .site-header .header-search__icon:hover,
    body .site-header .header-cart:hover .header-counter-content {
        background: #181818 !important;
        border-color: #3a3a3a !important;
        color: #f5ecd6 !important;
    }

    /* Burger centre */
    body .site-header .header-hamburger .hamburger__icon,
    body .site-header .header-hamburger .glozin-svg-icon--hamburger {
        width: 22px !important;
        height: 14px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 !important;
        line-height: 1 !important;
        transform: none !important;
    }

    body .site-header .header-hamburger svg {
        display: block !important;
        width: 22px !important;
        height: 14px !important;
        margin: 0 !important;
        transform: translateY(0) !important;
    }

    body .site-header .header-hamburger svg,
    body .site-header .header-search__icon svg,
    body .site-header .header-cart svg,
    body .site-header .header-hamburger svg path,
    body .site-header .header-search__icon svg path,
    body .site-header .header-cart svg path {
        color: currentColor !important;
        fill: currentColor !important;
    }

    /* Pastille panier */
    body .site-header .header-cart__counter {
        min-width: 18px !important;
        height: 18px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: #ddab2c !important;
        border: 0 !important;
        border-radius: 999px !important;

        color: #000000 !important;

        font-size: 0.68rem !important;
        font-weight: 900 !important;
        line-height: 1 !important;

        box-shadow: none !important;
        outline: 0 !important;
    }

    body .site-header .header-cart:hover .header-cart__counter {
        background: #ddab2c !important;
        border: 0 !important;
        color: #000000 !important;
    }

    /* Panneau menu mobile */
    .panel__content:has(nav.main-navigation.hambuger-navigation),
    .panel__content-items:has(nav.main-navigation.hambuger-navigation) {
        background: #111111 !important;
        color: #f5ecd6 !important;
    }

    nav.main-navigation.hambuger-navigation,
    nav.main-navigation.hambuger-navigation ul.menu {
        margin: 0 !important;
        padding: 0 !important;

        background: #111111 !important;
        color: #f5ecd6 !important;

        list-style: none !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation ul.menu > li,
    nav.main-navigation.hambuger-navigation .sub-menu > li,
    .panel__content-items .sub-menu > li,
    .panel__content-items.active .sub-menu > li {
        margin: 0 !important;
        padding: 0 !important;

        background: #111111 !important;
        border: 0 !important;
        border-bottom: 1px solid #252525 !important;

        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation ul.menu > li > a,
    nav.main-navigation.hambuger-navigation .sub-menu > li > a,
    .panel__content-items .sub-menu > li > a,
    .panel__content-items.active .sub-menu > li > a {
        min-height: 56px !important;
        padding: 0 22px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        background: #111111 !important;
        border: 0 !important;

        color: #f5ecd6 !important;
        text-decoration: none !important;

        font-family: Arial, Helvetica, sans-serif !important;
        font-size: 0.9rem !important;
        font-weight: 850 !important;
        letter-spacing: 0.07em !important;
        text-transform: uppercase !important;

        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation ul.menu > li > a:hover,
    nav.main-navigation.hambuger-navigation ul.menu > li.current-menu-item > a,
    nav.main-navigation.hambuger-navigation ul.menu > li.current-menu-parent > a,
    nav.main-navigation.hambuger-navigation ul.menu > li.current-product-parent > a,
    nav.main-navigation.hambuger-navigation ul.menu > li.current-product-ancestor > a,
    nav.main-navigation.hambuger-navigation .sub-menu > li > a:hover,
    nav.main-navigation.hambuger-navigation .sub-menu > li.current-menu-item > a,
    nav.main-navigation.hambuger-navigation .sub-menu > li.current-product-parent > a,
    nav.main-navigation.hambuger-navigation .sub-menu > li.current-product-ancestor > a,
    .panel__content-items .sub-menu > li > a:hover,
    .panel__content-items .sub-menu > li.current-menu-item > a,
    .panel__content-items .sub-menu > li.current-product-parent > a,
    .panel__content-items .sub-menu > li.current-product-ancestor > a {
        background: #181818 !important;
        color: #f5ecd6 !important;
    }

    /* Sous-menu Boutique */
    nav.main-navigation.hambuger-navigation .sub-menu,
    nav.main-navigation.hambuger-navigation ul.sub-menu,
    .panel__content-items .sub-menu,
    .panel__content-items.active .sub-menu {
        background: #111111 !important;
        color: #f5ecd6 !important;
        border: 0 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation .sub-menu > li > a,
    .panel__content-items .sub-menu > li > a,
    .panel__content-items.active .sub-menu > li > a {
        justify-content: flex-start !important;
        min-height: 54px !important;
        font-size: 0.88rem !important;
        font-weight: 800 !important;
        letter-spacing: 0.06em !important;
    }

    /* Header du sous-menu */
    nav.main-navigation.hambuger-navigation .submenu-items--heading,
    .panel__content-items .submenu-items--heading,
    .panel__content-items.active .submenu-items--heading {
        min-height: 62px !important;
        padding: 0 18px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: space-between !important;

        background: #0d0d0d !important;
        border: 0 !important;
        border-bottom: 1px solid #252525 !important;

        color: #f5ecd6 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation .submenu-items--title,
    nav.main-navigation.hambuger-navigation .submenu-items--title-text,
    .panel__content-items .submenu-items--title,
    .panel__content-items .submenu-items--title-text {
        color: #f5ecd6 !important;
        font-family: Arial, Helvetica, sans-serif !important;
    }

    nav.main-navigation.hambuger-navigation .submenu__button-back,
    nav.main-navigation.hambuger-navigation .panel__button-close,
    .panel__content-items .submenu__button-back,
    .panel__content-items .panel__button-close {
        width: 40px !important;
        height: 40px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: #111111 !important;
        border: 1px solid #252525 !important;
        border-radius: 999px !important;

        color: #f5ecd6 !important;
        box-shadow: none !important;
        outline: 0 !important;
    }

    nav.main-navigation.hambuger-navigation .submenu__button-back:hover,
    nav.main-navigation.hambuger-navigation .panel__button-close:hover,
    .panel__content-items .submenu__button-back:hover,
    .panel__content-items .panel__button-close:hover {
        background: #181818 !important;
        border-color: #3a3a3a !important;
        color: #f5ecd6 !important;
    }

    nav.main-navigation.hambuger-navigation .submenu__button-back svg,
    nav.main-navigation.hambuger-navigation .panel__button-close svg,
    nav.main-navigation.hambuger-navigation .submenu__button-back svg path,
    nav.main-navigation.hambuger-navigation .panel__button-close svg path,
    .panel__content-items .submenu__button-back svg,
    .panel__content-items .panel__button-close svg,
    .panel__content-items .submenu__button-back svg path,
    .panel__content-items .panel__button-close svg path {
        color: currentColor !important;
        fill: currentColor !important;
    }

    /* Libelle Menu */
    body .panel__menu-items,
    body .panel__menu-items li,
    body .panel__menu-items li a,
    body .panel__menu-items li a.active {
        font-family: Arial, Helvetica, sans-serif !important;
        font-style: normal !important;
        font-size: 0.82rem !important;
        font-weight: 900 !important;
        line-height: 1 !important;
        letter-spacing: 0.12em !important;
        text-transform: uppercase !important;
        color: #f5ecd6 !important;
    }

    /* Supprime les traits blancs generes */
    nav.main-navigation.hambuger-navigation li::before,
    nav.main-navigation.hambuger-navigation li::after,
    nav.main-navigation.hambuger-navigation a::before,
    nav.main-navigation.hambuger-navigation a::after,
    nav.main-navigation.hambuger-navigation .sub-menu::before,
    nav.main-navigation.hambuger-navigation .sub-menu::after {
        content: none !important;
        display: none !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
}

/* ============================================
   PATCH - Menu mobile : poids typo plus léger
   ============================================ */

@media (max-width: 768px) {
    nav.main-navigation.hambuger-navigation ul.menu > li > a,
    nav.main-navigation.hambuger-navigation .sub-menu > li > a,
    .panel__content-items .sub-menu > li > a,
    .panel__content-items.active .sub-menu > li > a {
        font-weight: 500 !important;
        letter-spacing: 0.06em !important;
    }

    body .panel__menu-items,
    body .panel__menu-items li,
    body .panel__menu-items li a,
    body .panel__menu-items li a.active {
        font-weight: 500 !important;
        letter-spacing: 0.08em !important;
    }
}


/* ============================================
   TOPBAR PROMO - Livraison gratuite
   ============================================ */

.qcb-topbar {
    width: 100%;
    background: #ddab2c;
    color: #000000;
    border-bottom: 1px solid rgba(0, 0, 0, 0.18);
    position: relative;
    z-index: 9999;
}

.qcb-topbar__inner {
    min-height: 34px;
    padding: 6px 16px;

    display: flex;
    align-items: center;
    justify-content: center;

    text-align: center;
}

.qcb-topbar__text {
    color: #000000;

    font-family: Arial, Helvetica, sans-serif;
    font-size: 0.85rem;
    font-weight: 500;
    line-height: 1.25;
    letter-spacing: 0.04em;
}

@media (max-width: 768px) {
    .qcb-topbar__inner {
        min-height: 32px;
        padding: 6px 12px;
    }

    .qcb-topbar__text {
        font-size: 0.7rem;
        font-weight: 500;
        letter-spacing: 0.03em;
    }
}



/* ============================================
   PATCH - Topbar sous le menu mobile Glozin
   ============================================ */

/* La topbar reste visible dans le flux normal, mais ne passe plus au-dessus des menus */
.qcb-topbar {
    position: relative !important;
    z-index: 5 !important;
}

/* Le header reste au-dessus du bandeau */
#site-header,
.site-header {
    position: relative !important;
    z-index: 100 !important;
}

/* Les panneaux mobiles Glozin passent toujours devant la topbar */
.panel,
.panel__container,
.panel__wrapper,
.panel__content,
.panel__content-items,
.panel__content-items.active,
nav.main-navigation.hambuger-navigation,
nav.main-navigation.hambuger-navigation .sub-menu,
nav.main-navigation.hambuger-navigation ul.sub-menu {
    z-index: 10000 !important;
}

/* Spécifique mobile : sécurise l'empilement du sous-menu */
@media (max-width: 768px) {
    .qcb-topbar {
        z-index: 1 !important;
    }

    .site-header,
    #site-header {
        z-index: 100 !important;
    }

    .panel,
    .panel__container,
    .panel__wrapper,
    .panel__content,
    .panel__content-items,
    .panel__content-items.active {
        position: relative !important;
        z-index: 10000 !important;
    }

    nav.main-navigation.hambuger-navigation,
    nav.main-navigation.hambuger-navigation ul.menu,
    nav.main-navigation.hambuger-navigation .sub-menu,
    nav.main-navigation.hambuger-navigation ul.sub-menu {
        position: relative !important;
        z-index: 10001 !important;
    }
}



/* ============================================
   PATCH - Icône compte visible sur mobile
   Thème Glozin
   ============================================ */

@media (max-width: 768px) {

    /* Réaffiche le bloc compte si le thème le masque */
    body .site-header .header-account,
    body .site-header .header-account__icon,
    body .site-header .header-account .header-counter-content {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;
    }

    /* Bouton compte cohérent avec recherche et panier */
    body .site-header .header-account > a,
    body .site-header .header-account__icon,
    body .site-header .header-account .header-counter-content {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;

        padding: 0 !important;
        margin: 0 !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        background: #0d0d0d !important;
        border: 1px solid #252525 !important;
        border-radius: 999px !important;

        color: #f5ecd6 !important;

        box-shadow: none !important;
        outline: 0 !important;
        text-decoration: none !important;
    }

    /* Réaffiche les wrappers internes éventuels */
    body .site-header .header-account .glozin-svg-icon,
    body .site-header .header-account .header-icon,
    body .site-header .header-account svg {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;

        width: 20px !important;
        height: 20px !important;

        color: currentColor !important;
        fill: currentColor !important;
    }

    /* Couleur des tracés SVG */
    body .site-header .header-account svg path,
    body .site-header .header-account svg circle,
    body .site-header .header-account svg line {
        color: currentColor !important;
        fill: currentColor !important;
        stroke: currentColor !important;
    }

    /* Hover */
    body .site-header .header-account > a:hover,
    body .site-header .header-account__icon:hover,
    body .site-header .header-account:hover .header-counter-content {
        background: #181818 !important;
        border-color: #3a3a3a !important;
        color: #f5ecd6 !important;
    }

    /* Focus clavier */
    body .site-header .header-account > a:focus-visible,
    body .site-header .header-account__icon:focus-visible {
        outline: 3px solid rgba(221, 171, 44, 0.42) !important;
        outline-offset: 3px !important;
    }
}


/* ============================================
   HEADER MOBILE - BOUTON COMPTE GLOZIN
   ============================================ */

@media (max-width: 768px) {

    /* Conteneurs possibles du bouton compte */
    body .header-mobile-main .header-account,
    body .header-mobile-main .header-account__icon,
    body .header-mobile-main .header-account__link,
    body .header-mobile-main .header-login,
    body .header-mobile-main a[href*="/mon-compte"] {
        display: inline-flex !important;
        visibility: visible !important;
        opacity: 1 !important;

        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;

        padding: 0 !important;
        margin: 0 !important;

        align-items: center !important;
        justify-content: center !important;

        background: #0d0d0d !important;
        border: 1px solid #252525 !important;
        border-radius: 999px !important;

        color: #f5ecd6 !important;
        text-decoration: none !important;

        box-shadow: none !important;
    }

    /* SVG existant */
    body .header-mobile-main .header-account svg,
    body .header-mobile-main .header-account__icon svg,
    body .header-mobile-main .header-account__link svg,
    body .header-mobile-main .header-login svg,
    body .header-mobile-main a[href*="/mon-compte"] svg {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;

        width: 20px !important;
        height: 20px !important;

        color: #f5ecd6 !important;
        fill: none !important;
        stroke: currentColor !important;
    }

    body .header-mobile-main .header-account svg path,
    body .header-mobile-main .header-account__icon svg path,
    body .header-mobile-main .header-account__link svg path,
    body .header-mobile-main .header-login svg path,
    body .header-mobile-main a[href*="/mon-compte"] svg path {
        color: inherit !important;
        fill: none !important;
        stroke: currentColor !important;
    }

    /* Hover */
    body .header-mobile-main .header-account:hover,
    body .header-mobile-main .header-account__icon:hover,
    body .header-mobile-main .header-account__link:hover,
    body .header-mobile-main .header-login:hover,
    body .header-mobile-main a[href*="/mon-compte"]:hover {
        background: #181818 !important;
        border-color: #ddab2c !important;
        color: #ddab2c !important;
    }
}


/* ============================================
   HEADER MOBILE - BOUTON MON COMPTE INJECTÉ
   Quality CBD ByNiko
   ============================================ */

@media (max-width: 768px) {
    body .header-mobile-main .qcb-mobile-account,
    body .site-header .header-mobile .qcb-mobile-account {
        width: 42px !important;
        height: 42px !important;
        min-width: 42px !important;
        min-height: 42px !important;
        flex: 0 0 42px !important;

        padding: 0 !important;
        margin: 0 !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        position: relative !important;

        background: #0d0d0d !important;
        background-color: #0d0d0d !important;
        background-image: none !important;

        border: 1px solid #252525 !important;
        border-radius: 999px !important;

        color: #f5ecd6 !important;
        text-decoration: none !important;

        visibility: visible !important;
        opacity: 1 !important;

        box-shadow: none !important;
        outline: 0 !important;

        transition:
            background-color 0.25s ease,
            border-color 0.25s ease,
            color 0.25s ease !important;
    }

    /* Neutralisation des effets génériques Glozin */
    body .header-mobile-main .qcb-mobile-account::before,
    body .header-mobile-main .qcb-mobile-account::after {
        content: none !important;
        display: none !important;
    }

    body .header-mobile-main .qcb-mobile-account__icon {
        width: 20px !important;
        height: 20px !important;

        display: inline-flex !important;
        align-items: center !important;
        justify-content: center !important;

        color: currentColor !important;
    }

    body .header-mobile-main .qcb-mobile-account svg {
        width: 20px !important;
        height: 20px !important;

        display: block !important;

        color: currentColor !important;
        fill: none !important;
        stroke: currentColor !important;
    }

    body .header-mobile-main .qcb-mobile-account svg circle,
    body .header-mobile-main .qcb-mobile-account svg path {
        fill: none !important;
        stroke: currentColor !important;
    }

    /* Survol */
    body .header-mobile-main .qcb-mobile-account:hover,
    body .header-mobile-main .qcb-mobile-account:focus {
        background: #181818 !important;
        border-color: #ddab2c !important;
        color: #ddab2c !important;
    }

    /* Focus clavier accessible */
    body .header-mobile-main .qcb-mobile-account:focus-visible {
        outline: 3px solid rgba(221, 171, 44, 0.42) !important;
        outline-offset: 3px !important;
    }
}

@media (min-width: 769px) {
    .qcb-mobile-account {
        display: none !important;
    }
}

@media (prefers-reduced-motion: reduce) {
    .qcb-mobile-account {
        transition: none !important;
    }
}