#identity_header {
   /* background: red;*/
    height: 100px;
    margin: 0;
    padding: 0;
}

#identity_header .section-inner {
    max-width: 1140px;
    margin: 0 auto;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

/* Logo */

#identity_logo_link {
    display: flex;
    align-items: center;
    padding-left: 10px;
    margin-left: 60px;
}

#identity_logo {
    height: 70px !important;
    max-height: 70px !important;
    width: auto !important;
    padding: 10px 0;
    display: block;
}

/* Zone droite identité menu seul */

.identity-header-right {
    margin-left: auto;
    display: flex;
    align-items: center;
    gap: 20px;
}

/* Menu identité icones */

.identity-menu-nav {
    display: flex;
    align-items: center;
}

.identity-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.identity-menu-item {
    margin: 0;
    padding: 0;
}

.identity-menu-link {
    display: flex;
    align-items: center;
    justify-content: center;
}

.identity-menu-icon {
    max-height: 60px;
    width: auto;
    display: block;
}

/* Liste du menu identité */

.identity-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 20px;
}

.identity-menu li {
    margin: 0;
    padding: 0;
}

/* Liens transformés en icônes, texte masqué, taille adaptative */

.identity-menu li.moncompte > a,
.identity-menu li.monpanier > a,
.identity-menu li.mesfavoris > a,
.identity-menu li.suivienvoi > a {
    display: block;
    width: clamp(30px, 4.5vw, 60px);
    height: clamp(30px, 4.5vw, 60px);
    text-indent: 100%;
    white-space: nowrap;
    overflow: hidden;
    padding: 0;
    margin: 0;
}

/* Masque SVG pour permettre le changement de couleur */

.identity-menu li.moncompte > a,
.identity-menu li.monpanier > a,
.identity-menu li.mesfavoris > a,
.identity-menu li.suivienvoi > a {
    -webkit-mask-position: center;
    -webkit-mask-repeat: no-repeat;
    -webkit-mask-size: contain;
    mask-position: center;
    mask-repeat: no-repeat;
    mask-size: contain;
    background-color: #111;
}

/* Chemins vers les fichiers SVG du thème */

.identity-menu li.moncompte > a {
    -webkit-mask-image: url('img/mon_compte.svg');
    mask-image: url('img/mon_compte.svg');
}

.identity-menu li.mesfavoris > a {
    -webkit-mask-image: url('img/mes_favoris.svg');
    mask-image: url('img/mes_favoris.svg');
}

.identity-menu li.suivienvoi > a {
    -webkit-mask-image: url('img/suivi_envoi.svg');
    mask-image: url('img/suivi_envoi.svg');
}

.identity-menu li.monpanier > a {
    -webkit-mask-image: url('img/mon_panier.svg');
    mask-image: url('img/mon_panier.svg');
}

/* Couleur au survol */

.identity-menu li.moncompte > a:hover,
.identity-menu li.moncompte > a:focus,
.identity-menu li.monpanier > a:hover,
.identity-menu li.monpanier > a:focus,
.identity-menu li.mesfavoris > a:hover,
.identity-menu li.mesfavoris > a:focus,
.identity-menu li.suivienvoi > a:hover,
.identity-menu li.suivienvoi > a:focus {
    background-color: #ff00cc;
}

/* Couleur sur l élément actif */

.identity-menu li.current-menu-item.moncompte > a,
.identity-menu li.current-menu-item.mesfavoris > a,
.identity-menu li.current-menu-item.suivienvoi > a,
.identity-menu li.current-menu-item.monpanier > a {
    background-color: #c1c1c1;
}

/* ============================================== */
/* Menu responsive */
/* ============================================== */

/* GTranslate, style de base */

.gt-open {
    background: white !important;
    width: 150px !important;
    font-size: 15px !important;
    line-height: 18px !important;
    padding: 10px !important;
}

.gt_options {
    min-height: 255px !important;
    max-height: 350px !important;
}

.gt_float_switcher img {
    width: 25px !important;
}

.gt_float_switcher .gt_options a {
    padding: 10px !important;
}

.gt-current-lang img {
    width: 25px !important;
    margin: 15px;
}

/* Positionnement du bouton GTranslate dans le menu identité */

.identity-menu li.menu-item-gtranslate {
    position: relative;
    top: -20px;
    right: 5px;
    z-index: 1000;
}

/* On force aussi le z index du conteneur du menu déroulant */

.identity-menu li.menu-item-gtranslate div[id^="gtranslate_menu_wrapper"] {
    z-index: 1001;
}

/* Ajustements progressifs sans changer la disposition */

/* Réduction des espacements et des icônes sur largeur moyenne */

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

    .identity-header-right {
        gap: 16px;
    }

    .identity-menu {
        gap: 16px;
    }

    .gt-current-lang img {
        margin: 10px;
    }
}

/* Encore plus serré en petit écran, gtranslate recentré, mais même ordre des éléments */

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

    .identity-header-right {
        gap: 12px;
    }

    .identity-menu {
        gap: 12px;
    }

    .identity-menu li.menu-item-gtranslate {
        top: -10px;
        right: 0;
    }

    .gt-current-lang img {
        margin: 6px;
    }
}

/* Très petit écran, on compacte au maximum, toujours sans toucher à la structure */

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

    .identity-header-right {
        gap: 8px;
    }

    .identity-menu {
        gap: 8px;
    }

    .gt-current-lang img {
        margin: 4px;
    }
}
.blog-menu a { 
	padding: 20px 20px 10px 20px; 
}
.gaupe-cart-menu-item {
    position: relative;
}

.gaupe-cart-link {
    display: inline-flex;
    align-items: center;
    position: relative;
}

.gaupe-cart-icon-wrapper {
    position: relative;
    display: inline-block;
    line-height: 0;
}

.gaupe-cart-icon {
    display: block;
}

/* Badge rond, rouge, parfaitement collé en haut à droite */
.gaupe-cart-count {
    position: absolute;
    top: -6px;
    right: -6px;
    min-width: 18px;
    height: 18px;
    padding: 0 4px;
    border-radius: 50%;
    background: #e60023;
    color: #ffffff;
    font-size: 11px;
    font-weight: 600;
    line-height: 18px;
    text-align: center;
    box-sizing: border-box;
}
/* Menu mobile en overlay sous la barre noire, sans pousser le contenu */

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

    /* La barre de navigation sert de référence de position */
    .navigation {
        position: relative;
        z-index: 500;
    }

    /* Le menu mobile vient par dessus le contenu */
    .navigation .mobile-menu {
        position: absolute;
        top: 100%;          /* juste sous la barre noire */
        left: 0;
        right: 0;
        z-index: 499;
        background: #333333;
        margin: 0;
        padding: 0;
        list-style: none;
    }

    .navigation .mobile-menu li a {
        display: block;
        padding: 12px 20px;
        color: #ffffff;
    }
}
