/**
 * header-fix.css — order="200" : chargé EN TOUT DERNIER
 * Correctifs header HumanWare pour Amasty MegaMenu 2.5.6 / Magento 2.4.8
 */

/* ══════════════════════════════════════════════════════════════════════════
   MEGA MENU — dropdown Products : 2 colonnes côte à côte
   ══════════════════════════════════════════════════════════════════════════ */
ul.category-menu.gridnav {
    display: flex !important;
    flex-direction: row !important;
    gap: 0 !important;
    list-style: none !important;
    margin: 0 !important;
}

ul.category-menu.gridnav > div {
    flex: 0 0 auto !important;
    min-width: 140px !important;
}

ul.category-menu.gridnav li {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

ul.category-menu.gridnav li a {
    color: #313131 !important;
    text-decoration: none !important;
    white-space: nowrap !important;
    padding: 3px 0 !important;
    display: block !important;
    line-height: 1.4 !important;
}

ul.category-menu.gridnav li a:hover {
    color: #4b7a88 !important;
    text-decoration: none !important;
}

/* ══════════════════════════════════════════════════════════════════════════
   BARRE BLANCHE — header.panel
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Flex container ──────────────────────────────────────────────────────── */
.page-header .header.panel,
.ammenu-header-container .header.panel,
header.panel.header,
.panel.header {
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
    height: 83px !important;
}

/* ── Logo : flex: 1 0 auto = occupe tout l'espace → items poussés à DROITE ─
   Fonctionne même sans .switcher.language (ex. store US, UK, AU, etc.)      */
.page-header .header.panel .ammenu-logo,
.ammenu-header-container .header.panel .ammenu-logo,
.panel.header .ammenu-logo {
    order: 1 !important;
    flex: 1 0 auto !important;
    display: flex !important;
    align-items: center !important;
    justify-content: flex-start !important;
    height: 100% !important;
   

}

.page-header .header.panel .ammenu-logo img,
.panel.header .ammenu-logo img {
    max-height: 70px !important;
    height: auto !important;
    display: block !important;
}

/* ── Switcher langue (absent sur US/UK/AU/NZ/Ireland) ───────────────────── */
.page-header .header.panel .switcher.language,
.ammenu-header-container .header.panel .switcher.language,
.panel.header .switcher.language {
    order: 3 !important;
    flex-shrink: 0 !important;
}

/* ── Switcher website ────────────────────────────────────────────────────── */
.page-header .header.panel .switcher-website,
.panel.header .switcher-website {
    order: 4 !important;
    flex-shrink: 0 !important;
}

/* ── Liens / icône compte ────────────────────────────────────────────────── */
.page-header .header.panel > .header.links,
.panel.header > .header.links {
    order: 5 !important;
    float: none !important;
}

/* ── Minicart ────────────────────────────────────────────────────────────── */
.page-header .header.panel .minicart-wrapper,
.panel.header .minicart-wrapper {
    order: 6 !important;
}

/* ── Hamburger (mobile uniquement) — order desktop ──────────────────────── */
.page-header .header.panel .ammenu-button.-hamburger.-trigger,
.panel.header .ammenu-button.-hamburger.-trigger {
    order: 2 !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   MOBILE (≤ 1024px) — layout header.panel
   Ordre : [≡ hamburger GAUCHE]  [logo CENTRÉ]  [👤 compte][🛒 panier]
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {

    /* Supprimer la hauteur fixe desktop (height: 83px s'applique sinon partout) */
    .page-header .header.panel,
    .ammenu-header-container .header.panel,
    .panel.header {
        height: auto !important;
        min-height: 60px !important;
        padding: 10px 15px !important;
        flex-wrap: nowrap !important;
    }

    /* ── Hamburger → GAUCHE ───────────────────────────────────────────────── */
    .page-header .header.panel .ammenu-button.-hamburger.-trigger,
    .panel.header .ammenu-button.-hamburger.-trigger {
        order: 1 !important;
        flex: 0 0 auto !important;
        display: flex !important;
        align-items: center !important;
    }

    /* ── Logo → CENTRÉ dans l'espace disponible ──────────────────────────── */
    .page-header .header.panel .ammenu-logo,
    .panel.header .ammenu-logo {
        order: 2 !important;
        flex: 1 1 auto !important;
        justify-content: center !important;
    }

    /* ── Switchers langue / website → cachés sur mobile ─────────────────── */
    .page-header .header.panel .switcher.language,
    .page-header .header.panel .switcher-website,
    .panel.header .switcher.language,
    .panel.header .switcher-website {
        display: none !important;
    }

    /* ── Compte → droite ─────────────────────────────────────────────────── */
    .page-header .header.panel > .header.links,
    .panel.header > .header.links {
        order: 3 !important;
        flex: 0 0 auto !important;
        margin-left: 0 !important;
    }

    /* ── Panier → droite ─────────────────────────────────────────────────── */
    .page-header .header.panel .minicart-wrapper,
    .panel.header .minicart-wrapper {
        order: 4 !important;
        flex: 0 0 auto !important;
        margin-left: 8px !important;
    }
}


/* ══════════════════════════════════════════════════════════════════════════
   SIDEBAR MOBILE — contrôlée via body.ammenu-nav-open (jQuery fix)
   Contourne la race condition KnockoutJS : le bouton hamburger déplacé dans
   panel.header ne peut pas accéder au scope KO d'ammenu_hamburger_toggle.
   Solution : on ajoute/retire la classe CSS sur body directement.
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {

    /* ── Overlay semi-transparent (fond sombre derrière le menu) ─────────── */
    /* z-index: 9500 = au-dessus de ammenu-menu-overlay (9400) Amasty        */
    .ammenu-hw-overlay {
        display: none;
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.5);
        z-index: 9500;
        cursor: pointer;
    }

    body.ammenu-nav-open .ammenu-hw-overlay {
        display: block;
    }

    /* ── Sidebar ouverte : Amasty ajoute la classe -opened via KO ────────── */
    /* On cible directement .-opened (pas besoin de body.ammenu-nav-open)    */
    .ammenu-nav-sections.-sidebar.-opened,
    #ammenu-sidebar.-opened {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: fixed !important;
        top: 0 !important;
        left: 0 !important;
        transform: translateX(0) !important;
        width: 280px !important;
        height: 100vh !important;
        overflow-y: auto !important;
        z-index: 9999 !important;
        pointer-events: auto !important;
    }

    /* ── Overlay : visible quand body.ammenu-nav-open ─────────────────────  */
    body.ammenu-nav-open .ammenu-hw-overlay {
        display: block;
    }
}


/* ══════════════════════════════════════════════════════════════════════════
   SIDEBAR MOBILE — style visuel proche de l'ancien site
   Écrase les inline styles KO d'Amasty (fond sombre, boutons orange, texte blanc).
   ══════════════════════════════════════════════════════════════════════════ */
@media (max-width: 1024px) {

    /* ── Fond blanc global — écrase KO inline background: rgb(38,38,38) ───── */
    .ammenu-nav-sections.-sidebar,
    #ammenu-sidebar {
        background-color: #ffffff !important;
        background:       #ffffff !important;
        color:            #333333 !important;
    }

    /* ── Texte sombre : ID selector = spécificité 100, bat toutes les classes  */
    #ammenu-sidebar .ammenu-item .ammenu-link,
    #ammenu-sidebar .ammenu-item .ammenu-link.-disabled,
    #ammenu-sidebar .ammenu-item .ammenu-link *,
    #ammenu-sidebar .ammenu-item a,
    #ammenu-sidebar .ammenu-item a:link,
    #ammenu-sidebar .ammenu-item a:visited {
        color:        #333333 !important;
        border-color: #e5e5e5 !important;
    }

    /* ── Items : fond blanc, pas de border-radius, bordure bas seulement ──── */
    .ammenu-nav-sections.-sidebar .ammenu-item,
    #ammenu-sidebar .ammenu-item {
        background:    #ffffff !important;
        border-radius: 0 !important;
        border:        none !important;
        border-bottom: 1px solid #e5e5e5 !important;
        margin:        0 !important;
        padding:       0 !important;
    }

    /* ── Liens : fond transparent, bold, MAJUSCULES ───────────────────────── */
    .ammenu-nav-sections.-sidebar .ammenu-link,
    .ammenu-nav-sections.-sidebar .ammenu-link.-disabled,
    #ammenu-sidebar .ammenu-link {
        background:      transparent !important;
        color:           #333333 !important;
        font-weight:     700 !important;
        font-size:       16px !important;
        text-transform:  uppercase !important;
        letter-spacing:  0.5px !important;
        padding:         15px 20px !important;
        border-radius:   0 !important;
        border:          none !important;
        display:         flex !important;
        align-items:     center !important;
        justify-content: space-between !important;
    }

    .ammenu-nav-sections.-sidebar .ammenu-link:hover {
        background: #f5f5f5 !important;
        color:      #E07606 !important;
    }

    /* ── Texte du lien ────────────────────────────────────────────────────── */
    .ammenu-nav-sections.-sidebar .ammenu-text,
    .ammenu-nav-sections.-sidebar .ammenu-text-block,
    .ammenu-nav-sections.-sidebar .ammenu-text *,
    .ammenu-nav-sections.-sidebar .ammenu-text-block * {
        color: #333333 !important;
    }

    /* ── Supprimer les flèches chevron desktop dans la sidebar ───────────── */
    .ammenu-nav-sections.-sidebar .ammenu-text-block::after,
    #ammenu-sidebar .ammenu-text-block::after {
        display: none !important;
    }

    /* ── Icône "+" sur les items avec sous-menu ────────────────────────────
       Items AVEC sous-menu : .ammenu-link.-disabled (tabindex="-1")
       On ajoute un + via ::after sur le lien lui-même                       */
    .ammenu-nav-sections.-sidebar .ammenu-link.-disabled::after,
    #ammenu-sidebar .ammenu-link.-disabled::after {
        content:     '+' !important;
        font-size:   20px !important;
        font-weight: 300 !important;
        color:       #333333 !important;
        line-height: 1 !important;
        flex-shrink: 0 !important;
    }

    /* ── Boutons accordéon (drill/back navigation) ───────────────────────── */
    .ammenu-nav-sections.-sidebar .ammenu-button,
    .ammenu-nav-sections.-sidebar .ammenu-arrow,
    #ammenu-sidebar .ammenu-button {
        color:         #333333 !important;
        background:    transparent !important;
        border:        none !important;
        border-radius: 0 !important;
    }

    /* ── Tabs list (ul.ammenu-tabs-list) ─────────────────────────────────── */
    #ammenu-sidebar .ammenu-tabs-list {
        background:    #ffffff !important;
        border-bottom: 1px solid #e5e5e5 !important;
        display:       flex !important;
        padding:       0 !important;
        margin:        0 !important;
        list-style:    none !important;
    }

    #ammenu-sidebar .ammenu-tabs-list .ammenu-item {
        flex:          1 !important;
        border-bottom: none !important;
        border-right:  1px solid #e5e5e5 !important;
        margin:        0 !important;
        padding:       0 !important;
    }

    /* Onglet (button) — inactif : fond sombre, texte blanc */
    #ammenu-sidebar .ammenu-tabs-list .ammenu-button {
        width:          100% !important;
        padding:        16px 12px !important;
        background:     #262626 !important;
        color:          #ffffff !important;
        font-weight:    700 !important;
        font-size:      16px !important;
        text-transform: uppercase !important;
        border:         none !important;
        border-radius:  0 !important;
        cursor:         pointer !important;
    }

    /* Onglet actif (aria-selected="true") : fond blanc, texte sombre */
    #ammenu-sidebar .ammenu-tabs-list .ammenu-button[aria-selected="true"] {
        background: #ffffff !important;
        color:      #333333 !important;
    }

    /* ── Bouton fermeture × ──────────────────────────────────────────────── */
    .ammenu-nav-sections.-sidebar .ammenu-close,
    #ammenu-sidebar .ammenu-close {
        background: #ffffff !important;
        color:      #333333 !important;
    }

    /* ── Switchers langue / website dans Settings ────────────────────────── */
    .ammenu-nav-sections.-sidebar .switcher,
    .ammenu-nav-sections.-sidebar .switcher-trigger,
    .ammenu-nav-sections.-sidebar .switcher-option,
    #ammenu-sidebar .switcher,
    #ammenu-sidebar .switcher-trigger {
        color:      #333333 !important;
        background: #ffffff !important;
    }
}


/* ══════════════════════════════════════════════════════════════════════════
   BARRE NOIRE — g-header / barre de recherche
   La search a été déplacée de .header.content vers .g-header-container
   via am_mega_menu_layout.xml → les sélecteurs doivent cibler le nouvel emplacement
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Input background gris foncé ────────────────────────────────────────── */
.g-header .amsearch-wrapper-input,
.g-header-container .amsearch-wrapper-input,
.ammenu-menu-wrapper ~ .amsearch-wrapper-block .amsearch-wrapper-input {
    background-color: #404040 !important;
    border-radius: 5px !important;
    border: none !important;
}

/* ── Texte et placeholder ────────────────────────────────────────────────── */
.g-header .amsearch-input,
.g-header-container .amsearch-input {
    color: #ffffff !important;
    font-size: 15px !important;
    margin: 0 !important;
}

.g-header .amsearch-input::placeholder,
.g-header-container .amsearch-input::placeholder {
    color: #BEC7C5 !important;
    font-size: 15px !important;
}

/* ── Icône loupe ─────────────────────────────────────────────────────────── */
.g-header .amsearch-loupe,
.g-header-container .amsearch-loupe {
    display: none !important;
}

.g-header .amsearch-close,
.g-header-container .amsearch-close {
    filter: none !important;
    right: 35px !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   MENU PRINCIPAL — flèches et navigation clavier
   Structure Amasty 2.5.6 :
     .ammenu-items.-root > .ammenu-item > .ammenu-link > .ammenu-text-block
   Items AVEC sous-menu  : .ammenu-link (tabindex="0")
   Items SANS sous-menu  : .ammenu-link.-disabled (tabindex="-1")
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Flèche ▾ sur les items avec sous-menu ──────────────────────────────── */
.ammenu-items.-root > .ammenu-item > .ammenu-link:not(.-disabled) .ammenu-text-block {
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px;
}

.ammenu-items.-root > .ammenu-item > .ammenu-link:not(.-disabled) .ammenu-text-block::after {
    content: "" !important;
    display: inline-block !important;
    width: 11px !important;
    height: 13px !important;
    /* Chevron SVG (Font Awesome fa-chevron-down) via mask — hérite currentColor */
    background-color: currentColor !important;
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z'/%3E%3C/svg%3E") !important;
    -webkit-mask-size: contain !important;
    -webkit-mask-repeat: no-repeat !important;
    -webkit-mask-position: center !important;
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z'/%3E%3C/svg%3E") !important;
    mask-size: contain !important;
    mask-repeat: no-repeat !important;
    mask-position: center !important;
    /* Reset border triangle (ancienne approche) */
    border: none !important;
    flex-shrink: 0 !important;
    transition: transform 0.2s ease !important;
}

/* ── Flèche inversée au survol (sous-menu ouvert) ───────────────────────── */
.ammenu-items.-root > .ammenu-item:hover > .ammenu-link:not(.-disabled) .ammenu-text-block::after {
    transform: rotate(180deg) !important;
}

/* ── Navigation clavier (touche Tab) ────────────────────────────────────── */
/* Quand un élément à l'intérieur d'un ammenu-item reçoit le focus,
   on affiche le sous-menu → permet de naviguer avec Tab dans les sous-items  */
.ammenu-items.-root > .ammenu-item:focus-within .ammenu-submenu-wrapper {
    display: block !important;
    visibility: visible !important;
}

/* Flèche inversée aussi quand l'item est focus (cohérence visuelle) */
.ammenu-items.-root > .ammenu-item:focus-within > .ammenu-link:not(.-disabled) .ammenu-text-block::after {
    transform: rotate(180deg) !important;
}


/* ══════════════════════════════════════════════════════════════════════════
   COULEURS TEXTE — menu principal & footer
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Menu principal : texte BLANC par défaut ─────────────────────────────── */
.ammenu-items.-root > .ammenu-item > .ammenu-link,
.ammenu-items.-root > .ammenu-item > .ammenu-link .ammenu-text,
.ammenu-items.-root > .ammenu-item > .ammenu-link .ammenu-text-block {
    color: #ffffff !important;
}

/* ── Hover / focus : fond BLANC + texte NOIR ─────────────────────────────
   Double ciblage : .ammenu-item (li) pour le fond plein hauteur,
   .ammenu-link (a) pour écraser l'inline style de KnockoutJS Amasty.      */
.ammenu-items.-root > .ammenu-item:hover,
.ammenu-items.-root > .ammenu-item:focus-within {
    background-color: #ffffff !important;
}

.ammenu-items.-root > .ammenu-item:hover > .ammenu-link,
.ammenu-items.-root > .ammenu-item:focus-within > .ammenu-link {
    background: #ffffff !important;   /* écrase l'inline style Amasty KO */
}

.ammenu-items.-root > .ammenu-item:hover > .ammenu-link,
.ammenu-items.-root > .ammenu-item:hover > .ammenu-link .ammenu-text,
.ammenu-items.-root > .ammenu-item:hover > .ammenu-link .ammenu-text-block,
.ammenu-items.-root > .ammenu-item:focus-within > .ammenu-link,
.ammenu-items.-root > .ammenu-item:focus-within > .ammenu-link .ammenu-text,
.ammenu-items.-root > .ammenu-item:focus-within > .ammenu-link .ammenu-text-block {
    color: #262626 !important;
}

/* ── Footer : titres des colonnes en BLANC ──────────────────────────────── */
.page-footer .custom-footer .title,
.page-footer .custom-footer .footer-block__column .title {
    color: #ffffff !important;
}

/* ── Footer : liens en BLANC ────────────────────────────────────────────── */
.page-footer .custom-footer ul li a,
.page-footer .custom-footer a {
    color: #ffffff !important;
}

.page-footer .custom-footer ul li a:hover,
.page-footer .custom-footer a:hover {
    color: #cccccc !important;
    text-decoration: underline !important;
}

/* ══ My Account — icône SVG (structure div>h1>a) ══════════════════════════ */
.panel.header > .header.links > div:first-child {
    background-image: url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjOTRhMGIwIiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjgiIHI9IjQiLz48cGF0aCBkPSJNMTIgMTRjLTYuMSAwLTggNC04IDR2MmgxNnYtMnMtMS45LTQtOC00eiIvPjwvc3ZnPg==');
    background-position: center;
    background-repeat: no-repeat;
    width: 33px;
    height: 33px;
    display: flex;
    align-items: center;
}

.panel.header > .header.links > div:first-child h1 {
    margin: 0;
    padding: 0;
    font-size: 0;
    line-height: 0;
    border: none;
}

.panel.header > .header.links > div:first-child h1 > a {
    display: block;
    opacity: 0;
    width: 33px;
    height: 33px;
    overflow: hidden;
}

.panel.header > .header.links > div:first-child:hover {
    background-image: url('data:image/svg+xml;base64,PHN2ZyBmaWxsPSIjRTA3NjA2IiB2aWV3Qm94PSIwIDAgMjQgMjQiIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48Y2lyY2xlIGN4PSIxMiIgY3k9IjgiIHI9IjQiLz48cGF0aCBkPSJNMTIgMTRjLTYuMSAwLTggNC04IDR2MmgxNnYtMnMtMS45LTQtOC00eiIvPjwvc3ZnPg==');
}


/* ══════════════════════════════════════════════════════════════════════════
   FOOTER COMPLET — extrait exact des CSS compilés avant migration
   (styles-m.css + custom.css de pub/static/frontend/HumanWare/HumanWare)
   Chargé order="200" : override tout
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Conteneur footer ───────────────────────────────────────────────────── */
.page-wrapper .page-footer {
    background: #f8f8f8 !important;
    color: #323232 !important;
    padding-bottom: 0 !important;
    padding-top: 0 !important;
}

/* ── Top footer (bande sombre) ──────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter {
    background-color: #313131 !important;
    color: #fff !important;
    padding: 40px 0 50px !important;
    font-family: "Arial", sans-serif !important;
    font-size: 14px !important;
}

.page-wrapper .page-footer .custom-newsletter .newsletter-section {
    background-color: #313131 !important;
    display: flex !important;
    justify-content: space-between !important;
}

/* Block context (static block wrapper avec .block) */
.page-wrapper .page-footer .block .custom-newsletter .newsletter-section {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    align-items: flex-start !important;
    gap: 90px !important;
}

/* ── Colonnes ───────────────────────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact {
    flex: 0 0 auto !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact.one   { max-width: 205px !important; }
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact.two   { max-width: 150px !important; }
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact.three { max-width: 150px !important; }
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact.four  { max-width: 270px !important; }

/* ── Titres h4 (Products, Company, Contacts) ─────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact h4 {
    font-size: 22px !important;
    color: #ffffff !important;
    font-weight: bold !important;
    font-family: "Roboto", sans-serif !important;
    text-transform: none !important;
    margin-bottom: 25px !important;
    margin-top: 10px !important;
}

/* ── Logo HumanWare ─────────────────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-logo-humanware {
    width: 200px !important;
    max-width: 200px !important;
    margin-bottom: 25px !important;
    display: block !important;
    height: auto !important;
}

/* ── Badges (B Corp + Forbes) ───────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .badges-container {
    display: flex !important;
    gap: 20px !important;
    align-items: center !important;
    margin-top: 10px !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .badges-container .bcorp-badge {
    width: 60px !important;
    height: auto !important;
    text-decoration: none !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .badges-container .accessibility-badge {
    width: 90px !important;
    height: auto !important;
    text-decoration: none !important;
}

/* ── Listes de liens ────────────────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-links {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-links li {
    color: #fff !important;
    font-size: 17px !important;
    line-height: 22px !important;
    margin-bottom: 20px !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-links a {
    color: #fff !important;
    text-decoration: none !important;
    font-size: 17px !important;
    line-height: 22px !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-links a:hover {
    text-decoration: underline !important;
}

/* ── Icônes sociales ────────────────────────────────────────────────────── */
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-social a {
    margin-right: 18px !important;
    font-size: 20px !important;
    color: #fff !important;
    display: inline-block !important;
}
.page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact .footer-social a:hover {
    color: #e07606 !important;
}

/* ── Bottom footer (logos) ──────────────────────────────────────────────── */
.page-wrapper .page-footer .custom-footer .footer-block {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
    padding: 10px 20px !important;
    flex-wrap: nowrap !important;
}

.custom-footer-logo {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    gap: 20px !important;
    justify-content: center !important;
    align-items: center !important;
    width: auto !important;
}

.custom-footer-logo img,
.custom-footer-logo a img {
    max-width: 150px !important;
    height: auto !important;
    width: auto !important;
    display: inline-block !important;
    flex-shrink: 0 !important;
}

.custom-footer-logo .splitit {
    max-width: 115px !important;
    height: auto !important;
}

/* ── Copyright bar ──────────────────────────────────────────────────────── */
.page-wrapper .page-footer .footer-bottom-copyright {
    background: #fff !important;
    padding: 30px 0 !important;
}
.page-wrapper .page-footer .footer-bottom-copyright .custom-copyright {
    color: #262626 !important;
    font-size: 17px !important;
    text-align: center !important;
    line-height: 25px !important;
}

/* ── Responsive ≤ 1024px ────────────────────────────────────────────────── */
@media (max-width: 1024px) {
    .page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact h4 {
        font-size: 20px !important;
    }
}

/* ── Responsive ≤ 768px ─────────────────────────────────────────────────── */
@media (max-width: 768px) {
    .page-wrapper .page-footer .custom-newsletter .newsletter-section .newsletter-contact h4 {
        font-size: 18px !important;
    }

    .page-wrapper .page-footer .block .custom-newsletter .newsletter-section {
        flex-direction: column !important;
        padding-left: 30px !important;
        padding-right: 30px !important;
        gap: 35px !important;
    }

    .custom-footer-logo {
        flex-direction: column !important;
        gap: 15px !important;
    }

    .custom-footer-logo img,
    .custom-footer-logo a img {
        max-width: 75% !important;
        margin: 0 auto !important;
    }
}



/* Sous-menu : suppression des décalages de position. 
Élimine les espaces verticaux et horizontaux ajoutés 
par Amasty / Magento */

.ammenu-submenu-wrapper {
    width: auto !important;
    max-width: max-content !important;

    /* suppression des espaces internes verticaux */
    padding-top: 0 !important;
    padding-bottom: 0 !important;

    /* suppression des espacements horizontaux */
    padding-left: 0px !important;
    padding-right: 0px !important;

    /* neutralisation du décalage vertical du dropdown */
    margin-top: 0 !important;
    top: 100% !important;
}

/* Conteneur racine du sous-menu. Supprime le centrage et les contraintes de bloc */
.ammenu-submenu-block.-root.-simple {
    display: inline-block !important;
    width: auto !important;

    /* suppression des espacements hérités */
    padding: 0 !important;
    margin: 0 !important;
}

/* Liste principale du sous-menu. La largeur est définie par le contenu */
.ammenu-submenu-block ul.level0 {
    display: inline-block !important;
    width: max-content !important;

    /* suppression des espaces par défaut (haut et bas) */
    padding: 0 !important;
    margin: 0 !important;
}

/* Items du sous-menu. Empêche les retours à la ligne et supprime les marges */
.ammenu-submenu-block ul.level0 li {
    white-space: nowrap !important;
    margin: 0 !important;
}

/* Premier élément du sous-menu. Supprime la marge automatique Magento */
.ammenu-submenu-block ul.level0 li.level1:first-child {
    margin-top: 0 !important;
}

/* Menu en grille (gridnav). Supprime les espaces verticaux du layout en colonnes */
ul.category-menu.gridnav {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Wrapper interne Amasty. Supprime les décalages invisibles générés par le CMS */
ul.category-menu.gridnav > div {
    padding-top: 0 !important;
    margin-top: 0 !important;
}

/* Premier élément de la grille. Annule les marges héritées du thème Magento */
ul.category-menu.gridnav li.level1.first {
    margin-top: 0 !important;
}
/* Ajout despace a droite dans le menu */
.ammenu-submenu-block ul.level0 > li > a,
.ammenu-submenu-block ul.level0 > li > .ammenu-link {
    padding-right: 25px !important;
}
/* Ajout despace a droite dans le menu  Products sur 2 colonnes*/
ul.category-menu.gridnav li > a,
ul.category-menu.gridnav li > .ammenu-link {
    padding-right: 25px !important;
}
/* séparation verticale menu sur 2 colonne (Products) */
ul.category-menu.gridnav > *:first-child {
    border-right: 1px solid #d9d9d9 !important;
  
}
ul.category-menu.gridnav li a {
    display: block !important;
    padding: 8px 35px !important;
}

/* Fix positionnement dropdown Contacts */
.ammenu-items.-root > .ammenu-item {
    position: relative !important;
}
/* Fix logo humanware */
.page-header .header.panel .ammenu-logo img {
    width: 175px !important;
}

/* Caché desktop menu hamburger*/
.ammenu-button.-hamburger.-trigger {
    display: none !important;
    position: relative !important;
    color: #262626 !important;
    background: transparent !important;
    border: none !important;
}

/* Responsive menu hamburger*/
@media (max-width: 1030px) {

    .ammenu-button.-hamburger.-trigger {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        width: 44px !important;
        height: 44px !important;
        z-index: 9999 !important;
    }

    .ammenu-button.-hamburger.-trigger::before {
        content: "";
        position: absolute;
        top: 50%;
        left: 50%;

        width: 30px;
        height: 3px;

        background: currentColor !important;

        transform: translate(-50%, -8px);

        box-shadow:
            0 8px 0 currentColor,
            0 -8px 0 currentColor;
    }
}@media (max-width: 1030px) {

    .ammenu-nav-sections.-sidebar,
    #ammenu-sidebar {
        z-index: 99999 !important;
    }
}


/* Positionnement de reference pour les conteneurs parents */
#ammenu-sidebar .ammenu-item,
.ammenu-nav-sections.-sidebar .ammenu-item {
    position: relative !important;
}

/* Redimensionnement et espacement vertical des points d'entree principaux */
#ammenu-sidebar .ammenu-link,
.ammenu-nav-sections.-sidebar .ammenu-link {
    padding-top: 26px !important;
    padding-bottom: 14px !important;
    display: block !important;
}

/* Bouton bascule personnalise pour les elements statiques (About Us, Resources, etc.) */
.ammenu-custom-toggle {
    position: absolute !important;
    right: 15px !important;
    top: 34px !important;
    transform: translateY(-50%) !important;
    width: 30px !important;
    height: 30px !important;
    line-height: 28px !important;
    text-align: center !important;
    font-size: 20px !important;
    color: #000000 !important;
    cursor: pointer !important;
    z-index: 9999 !important;
    user-select: none !important;
}

/* Réalignement de l'indicateur de bascule natif (Account, Currency, Language) */
#ammenu-sidebar .ammenu-icon-block.-toggle,
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle {
    position: absolute !important;
    right: 15px !important;
    top: 34px !important;
    transform: translateY(-50%) !important;
    width: 30px !important;
    height: 30px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    margin: 0 !important;
    padding: 0 !important;
    cursor: pointer !important;
    z-index: 9999 !important;
}

/* Desactivation graphique du conteneur SVG vectoriel d'Amasty */
#ammenu-sidebar .ammenu-icon-block.-toggle svg,
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle svg {
    display: none !important;
}

/* Injection de l'etat visuel ferme par pseudo-element pour garantir la persistance DOM */
#ammenu-sidebar .ammenu-icon-block.-toggle::before,
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle::before {
    content: '+' !important;
    font-size: 20px !important;
    font-weight: normal !important;
    color: #000000 !important;
    font-family: Arial, sans-serif !important;
}

/* Changement d'etat via selecteur d'enfant direct (>) pour bloquer l'effet cascade sur les sous-menus */
#ammenu-sidebar .ammenu-item.-active > .ammenu-link .ammenu-icon-block.-toggle::before,
#ammenu-sidebar .ammenu-item.-active > .ammenu-icon-block.-toggle::before,
.ammenu-nav-sections.-sidebar .ammenu-item.-active > .ammenu-link .ammenu-icon-block.-toggle::before,
.ammenu-nav-sections.-sidebar .ammenu-item.-active > .ammenu-icon-block.-toggle::before {
    content: '−' !important;
}

/* Container des sous-menus forces ou natifs */
.custom-forced-submenu {
    width: 100% !important;
    background-color: transparent !important;
    padding: 0 40px 10px 60px !important;
    margin-top: 0 !important;
    box-sizing: border-box !important;
}

/* Normalisation des elements de liste imbriques */
.custom-clean-list, 
.custom-clean-list li, 
.custom-clean-list a {
    display: block !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    box-sizing: border-box !important;
    margin: 0 !important;
    padding: 0 !important;
}

.custom-clean-list li {
    border-bottom: 1px solid #eeeeee !important;
}

.custom-clean-list li:last-child {
    border-bottom: none !important;
}




/* ==========================================================================
   Amasty Menu Hamburger Fixes
   ========================================================================== */

#ammenu-sidebar .ammenu-item, 
.ammenu-nav-sections.-sidebar .ammenu-item { 
    position: relative !important; 
}

#ammenu-sidebar .ammenu-link, 
.ammenu-nav-sections.-sidebar .ammenu-link { 
    padding-top: 26px !important; 
    padding-bottom: 14px !important; 
    display: block !important; 
}

/* Nettoyage radical de l'outline bleu au clic sur tout le menu et les triggers */
.ammenu-nav-sections.-sidebar button:focus, 
.ammenu-nav-sections.-sidebar a:focus, 
.ammenu-nav-sections.-sidebar span:focus, 
.ammenu-nav-sections.-sidebar div:focus, 
#ammenu-sidebar button:focus, 
#ammenu-sidebar a:focus, 
.ammenu-custom-toggle:focus, 
.ammenu-button.-hamburger:focus, 
.ammenu-trigger:focus { 
    outline: none !important; 
    box-shadow: none !important; 
    -webkit-tap-highlight-color: transparent !important; 
}

/* Boutons de bascule personnalisés (+ / -) */
.ammenu-custom-toggle { 
    position: absolute !important; 
    right: 15px !important; 
    top: 34px !important; 
    transform: translateY(-50%) !important; 
    width: 30px !important; 
    height: 30px !important; 
    line-height: 28px !important; 
    text-align: center !important; 
    font-size: 20px !important; 
    color: #000000 !important; 
    cursor: pointer !important; 
    z-index: 9999 !important; 
    user-select: none !important; 
    margin-left: auto !important; 
    margin-right: 15px !important; 
    background: #ffffff !important; 
    border: none !important; 
    box-shadow: none !important; 
    border-radius: 0 !important; 
    appearance: none !important; 
    -webkit-appearance: none !important; 
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
}

#ammenu-sidebar .ammenu-icon-block.-toggle, 
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle { 
    position: absolute !important; 
    right: 15px !important; 
    top: 34px !important; 
    transform: translateY(-50%) !important; 
    width: 30px !important; 
    height: 30px !important; 
    display: flex !important; 
    align-items: center !important; 
    justify-content: center !important; 
    margin: 0 !important; 
    padding: 0 !important; 
    cursor: pointer !important; 
    z-index: 9999 !important; 
}

#ammenu-sidebar .ammenu-icon-block.-toggle svg, 
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle svg { 
    display: none !important; 
}

#ammenu-sidebar .ammenu-icon-block.-toggle::before, 
.ammenu-nav-sections.-sidebar .ammenu-icon-block.-toggle::before { 
    content: "+" !important; 
    font-size: 20px !important; 
    font-weight: normal !important; 
    color: #000000 !important; 
    font-family: Arial, sans-serif !important; 
}

#ammenu-sidebar .ammenu-item.-active > .ammenu-link .ammenu-icon-block.-toggle::before, 
#ammenu-sidebar .ammenu-item.-active > .ammenu-icon-block.-toggle::before, 
.ammenu-nav-sections.-sidebar .ammenu-item.-active > .ammenu-link .ammenu-icon-block.-toggle::before, 
.ammenu-nav-sections.-sidebar .ammenu-item.-active > .ammenu-icon-block.-toggle::before { 
    content: "−" !important; 
}

/* Structure des sous-menus */
.custom-forced-submenu { 
    width: 100% !important; 
    background-color: transparent !important; 
    padding: 0 40px 10px 60px !important; 
    margin-top: 0 !important; 
    box-sizing: border-box !important; 
}

.custom-clean-list, 
.custom-clean-list li, 
custom-clean-list a { 
    display: block !important; 
    width: 100% !important; 
    float: none !important; 
    clear: both !important; 
    box-sizing: border-box !important; 
    margin: 0 !important; 
    padding: 0 !important; 
}

.custom-clean-list li { 
    border-bottom: 1px solid #eeeeee !important; 
}

.custom-clean-list li:last-child { 
    border-bottom: none !important; 
}

.custom-clean-list a { 
    padding: 12px 0 !important; 
    color: #222222 !important; 
    font-size: 17px !important; 
    text-decoration: none !important; 
    text-align: left !important; 
}

.custom-parent-relative { 
    position: relative !important; 
    display: flex !important; 
    flex-wrap: wrap !important; 
    align-items: center !important; 
}

.custom-parent-relative .ammenu-arrow, 
.custom-parent-relative .ammenu-toggle, 
.custom-parent-relative .-arrow, 
.custom-parent-relative .ammenu-icon, 
.custom-parent-relative ::after, 
.custom-parent-relative ::before { 
    display: none !important; 
    background: none !important; 
}

.ammenu-custom-target-link { 
    flex: 1 !important; 
    width: auto !important; 
}


/* Barre verticale blanche menu */
.ammenu-nav-sections.-sidebar.-opened,
#ammenu-sidebar.-opened[class*="opened"] {
    display:        block !important;
    visibility:     visible !important;
    opacity:        1 !important;
    position:       fixed !important;
    top:            0 !important;
    left:           0 !important;
    transform:      translateX(0) !important;
    
    width:          600px !important; 
    min-width:      600px !important;
    max-width:      600px !important; 
    
    height:         100vh !important;
    overflow-y:     auto !important;
    z-index:        9999 !important;
    pointer-events: auto !important;
}

@media screen and (max-width: 750px) {
    .ammenu-nav-sections.-sidebar.-opened,
    #ammenu-sidebar.-opened[class*="opened"] {
        width:     100vw !important;
        min-width: 100vw !important;
        max-width: 100vw !important;
    }
}