header {
    position: relative;
    width: calc(100% - var(--largeur_menu_G));
    background-color: #fff;
    /*left: 0;
    right: 0;
    top: 0;*/
    z-index: 99;
    height: var(--hauteur_bandeau);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border-bottom: 1px solid #e5e7eb;
}

header .header_inner {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    /*max-width: 1090px;*/
    margin: auto;
    width: 100%;
    max-width: 100% !important;
    /*padding: 0 30px;*/
    background: #E5E5E5;
    /*background: linear-gradient(90deg, rgba(0,0,0,1) 0%, rgba(255,255,255,1) 3%);*/
    height: var(--hauteur_bandeau)
}

header .header_inner .left-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

header .header_inner .left-side .header_search {
    position: relative;
}

header .header_inner .left-side .header_search input {
    margin: 0;
    /*height: 42px;*/
    -webkit-box-shadow: none;
    box-shadow: none;
    padding-left: 30px;
    width: 400px;
    background-color: transparent;
}

header .header_inner .left-side .header_search .icon-search {
    width: 2.5rem;
    position: absolute;
    top: 0;
    left: 0;
    margin-left: -.75rem;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

header .header_inner .left-side .header_search .icon-search svg {
    width: 20px;
    color: #9ca3af;
}

header .header_inner .left-side .triger {
    position: absolute;
    left: 25px;
    top: 20px;
    color: #464646;
    display: none;
    font-size: 19px;
}

header .header_inner .right-side {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    margin-left: auto;
}

header .header_inner .right-side .header-links-item {
    padding: 10px;
    margin-left: 8px;
}

header .header_inner .right-side .header-links-item svg {
    width: 25px;
    height: 25px;
    color: #464646;
}

header .header_inner .right-side .header-avatar {
    width: 32px;
    height: 32px;
    border-radius: 100%;
    margin-left: 15px;
}


.mdropdown,
.xdropdown,
.header_dropdown {
    background: white;
    border-radius: 8px;
    --tw-shadow: 0 4px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    -webkit-box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
    padding: 20px;
    display: none;
}


.uk-drop,
.uk-dropdown,
.mdropdown,
.xdropdown {
    display: none;
}

header.uk-sticky-fixed {
    z-index: 990;
}

.shadow-none {
    -webkit-box-shadow: none !important;
    box-shadow: none !important;
}

header .uk-dropdown {
    display: none;
    -webkit-box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    box-shadow: 0 2px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
}

#panier:hover {
    color: black;
    /*background-color: #212529;
    border-color: #212529;*/
}

#cnt_panier_rond {
    border-radius: 50%;
    background-color: gray;
    position: absolute;
    bottom: -12px;
    right: calc(50% - 12px);;
    width: 24px;
    height: 24px;
    text-align: center;
    border: 1px white solid;
    vertical-align: middle;
    display: inline;

}

#cnt_panier {

    position: absolute;
    height: 24px;
    width: 100%;
    min-width: 24px;
    text-align: center;
    bottom: -9px;
    color: white;
    font-weight: bold;
}

#cnt_panier span {
    /*margin-left: auto;
    margin-right: auto;*/
    right: calc(50% - 5px);
}

.icone_header {
    font-size: 2rem;
}

.dropdown_profil:hover .dropdown-menu {
    display: block;
}

.dropdown_profil .dropdown-menu {
    width: 100%;
}

.dropdown-menu li {
    position: relative;
}

.dropdown-menu .dropdown-submenu {
    display: none;
    position: absolute;
    left: 100%;
    top: -7px;
}

.dropdown-menu .dropdown-submenu-left {
    right: 100%;
    left: auto;
}

.dropdown-menu > li:hover > .dropdown-submenu {
    display: block;
}

#menu_profil {
    background-color: white;
    border-color: unset !important;
    height: 48px;
    color: black;

}

#menu_profil span {
    vertical-align: middle;
    top: 5px;
    position: relative;
}

.dropdown-toggle::after {
    /*top: 15px;*/
    position: relative;
}

.dropdown:hover .dropdown-menu {
    display: block;
}

.dropdown-menu a {
    color: var(--e-global-color-text);
    fill: var(--e-global-color-text);
}

/*
inset: 0px auto auto 0px; margin: 0px; transform: translate(0px, 48px);
 */


/* Style du menu */
#menu-vert.menu {
    display: flex !important;
    align-items: center;
    padding: 10px;
}

#menu-vert.menu button:active {
    color: red !important;
}

/* Style du bouton */
#menu-vert.menu button {
    border: none;
    background-color: transparent;
    font-size: 16px;
    cursor: pointer;
    font-family: var(--e-global-typography-primary-font-family), Sans-serif;
    font-weight: var(--e-global-typography-primary-font-weight);
    padding: 13px 20px;
    line-height: 20px;
    color: var(--e-global-color-text);
    fill: var(--e-global-color-text);
    position: relative;
    min-width: 200px;

}

#menu-vert.menu button a {

    color: inherit;
    fill: var(--e-global-color-text);

}

/* Style du contenu déroulant */
#menu-vert .dropdown {
    position: relative;
    padding-top: 13px;
    padding-bottom: 13px;
}

#menu-vert .dropdown-content {
    display: none;
    position: absolute;
    /*top: 100%;*/
    left: 0;
    width: 100%;
    background-color: white;
    box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
    z-index: 1;
}

#menu-vert .dropdown-content a {
    display: block;
    color: black;
    padding: 12px 16px;
    text-decoration: none;

}

#menu-vert .dropdown-content a:hover {
    background-color: #f1f1f1;
}

/* Afficher le contenu déroulant au survol du bouton */
#menu-vert .dropdown:hover .dropdown-content {
    display: block;
}

/* Ajouter le style demandé au survol du bouton */

#menu-vert.menu button a.active,
#menu-vert.menu button:hover {
    color: #61CE70; /* Couleur du texte */
}

#menu-vert.menu button a.active::after,
#menu-vert.menu button:hover::after {
    content: ""; /* Pseudo-element after */
    display: block; /* Afficher en bloc */
    width: 100%; /* Largeur égale à celle du bouton */
    height: 3px; /* Hauteur fixe */
    background-color: #61CE70; /* Couleur de fond */
    bottom: 0;
    transform: scale(1);
    position: absolute;
    -webkit-transition: .3s;
    -o-transition: .3s;
    transition: .3s;
    -webkit-transition-timing-function: cubic-bezier(.58, .3, .005, 1);
    -o-transition-timing-function: cubic-bezier(.58, .3, .005, 1);
    transition-timing-function: cubic-bezier(.58, .3, .005, 1);
    left: 0;
}
