header{
    z-index: 1001!important;
    position: sticky;
    top: 0;
    transition: 200ms ease !important;
    background-color: #fff !important;
}

.has-scrolled header{
    transition: 200ms ease !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.05) !important;
}

.header-nav-menu{
    height: 100% !important;
}

.header-nav-item .header-nav-link{
    transition: 200ms !important;
}

.header-nav-item:hover .header-nav-link{
    opacity: .8;
    transition: 200ms !important;
}

.is-burger-menu{
    display: none !important;
}

.header-nav-item {
    width: fit-content!important;
    min-width: fit-content!important;
    cursor: pointer!important;
}

.sub-menu-container{
    flex-direction: column !important;
    flex-wrap: nowrap !important;
}

.sub-menu-inner{
    gap: 24px !important;
    padding: 24px var(--px-global) !important;
}

.header-nav-link.disable{
    opacity: .5 !important;
}

@media only screen and (min-width: 1025px){
    .header-nav-link a{
        padding: 0 12px!important
    }

    .sub-menu-container{
        position: absolute !important;
        top: calc(var(--header-height) + 16px );
        background-color: #fff !important;
        max-width: 300px !important;
        width: 100% !important;
        box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.1) !important;
        border-radius: 10px !important;
        opacity: 0;
        pointer-events: none;
    }

    /* Le pont invisible */
    .sub-menu-container::after {
        content: "";
        position: absolute;
        top: -20px; 
        left: 0;
        width: 100%;
        height: 25px; /* Doit être supérieur à tes 16px de vide */
        background: transparent; /* Invisible pour l'utilisateur */
        pointer-events: all;
    }

    .header-nav-item:hover .sub-menu-container{
        opacity: 1;
        pointer-events: all;
    }

    .header-nav-menu > .header-nav-item:first-child{
        padding-left: 0 !important;
    }
    
    .header-nav-menu > .header-nav-item:last-child{
        padding-right: 0 !important;
    }

    /* For mega menu container position */
    .is-mobile-menu-container,
    .is-mobile-menu-wrapper,
    .is-mobile-menu-inner,
    .header-nav-menu,
    .header-nav-item{
        position: unset !important;
    }

    .is-mobile-menu-wrapper,
    .is-mobile-menu-inner,
    .header-nav-menu,
    .header-nav-item,
    .header-nav-link,
    .header-nav-link p,
    .header-nav-link a{
        height: 100% !important;
    }

    .header-nav-link a{
        display: flex !important;
        align-items: center;
    }

    .mobile-menu-overlay{
        display: none !important;
    }
}

@media only screen and (max-width: 1024px) and (min-width: 0px){
    header > div{
        height: var(--header-height) !important;
    }

    .header-secondary-menu{
        display: none !important;
    }

    .country-selector{
        display: block !important;
    }

    .is-burger-menu {
        display: flex !important;
        flex-direction: column !important;
        justify-content: center !important;
        align-items: center !important;
        position: relative !important;
        width: fit-content !important;
        padding-left: var(--px-global) !important;
        margin-left: calc(var(--px-global) * -1) !important;
        padding-right: var(--px-global) !important;
        height: 100% !important;
        z-index: 1004 !important;
        position: relative !important;
        /* top: 4px; */
    }
    
    .is-burger-menu>* {
        width: 25px !important;
        height: 2px !important;
        border-radius: 5px !important;
        background-color: var(--bleu-fonce) !important;
        position: relative;
        transition: top 170ms 110ms, rotate 170ms, background 200ms !important;
        border-radius: 10px;
        
    }
    
    .is-mobile-menu-active .is-burger-menu>* {
        transition: top 170ms, rotate 170ms 110ms, background 200ms !important;
    }

    /* body:not(.is-mobile-menu-active).has-scrolled .is-burger-menu>* {
        background-color: var(--bleu-fonce) !important;
    } */

    .is-mobile-menu-active .is-burger-menu>*:nth-child(2) {
        width: 0px !important;
    }

    .is-burger-menu>*:first-child {
        top: -6px;
    }

    .is-burger-menu>*:last-child {
        top: 6px;
    }
    
    .is-mobile-menu-active .is-burger-menu>* {
        top: -4px;
    }
    
    .is-mobile-menu-active .is-burger-menu>*:first-child {
        rotate: 45deg;
        top: 0px;
    }

    .is-mobile-menu-active .is-burger-menu>*:last-child {
        rotate: -45deg;
    }

    .is-mobile-menu-container{
        display: block !important;
        position: fixed !important;
        top: 0 !important;
        right: -100% !important;
        width: 100vw !important;
        height: 100vh !important;
        max-width: 60vw !important;
        /* max-height: 0 !important; */
        overflow: hidden !important;
        background-color: #fff !important;
        transition: 300ms ease !important;
        z-index: 1003 !important;
        box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1) !important;
    }

    .mobile-menu-overlay{
        position: fixed !important;
        width: 100% !important;
        height: 100% !important;
        top: 0;
        left: 0;
        background-color: #00000020 !important;
        z-index: 1002 !important;
        opacity: 0;
        transition: .2s !important;
        pointer-events: none;
    }

    .is-mobile-menu-active .mobile-menu-overlay{
        opacity: 1;
        transition: .2s !important;
        pointer-events: all;
    }

    .has-scrolled .is-mobile-menu-container{
        /* top: var(--header-height) !important; */
    }

    .sub-menu-inner{
        padding-bottom: 0 !important;
    }

    .is-mobile-menu-active .is-mobile-menu-container{
        right: 0 !important;
        transition: 300ms ease !important;
    }

    .is-mobile-menu-container .is-mega-menu-container {
        height: 100vh !important;
        left: 100%!important;
        top: 0;
        overflow: scroll!important;
        transition: 200ms ease;
        display: block!important;
        max-height: unset !important;
        position: absolute !important;
        top: unset !important;
    }

    .is-mobile-menu-container .is-mega-menu-container.active {
        left: 0% !important;
        transition: 200ms ease
    }

    .is-mobile-menu-inner {
        transition: 200ms!important;
        left: 0;
        flex-direction: column !important;
        flex-wrap: nowrap !important;
        justify-content: space-between !important;
    }

    .is-mobile-menu-container.sub-menu-active .is-mobile-menu-inner {
        position: relative!important;
        left: -100%;
        transition: 200ms!important
    }
    
    .is-mobile-menu-wrapper{
        height: 100% !important;
        padding-top: calc(var(--header-height) + 32px) !important;
        overflow: hidden !important;
        padding-bottom: 120px !important;
        transition: 200ms !important;
    }

    .has-scrolled .is-mobile-menu-wrapper{
        padding-top: calc(var(--header-height)) !important;
    }

    .is-mobile-menu-inner{
        height: calc(100vh - 120px) !important;
        overflow: scroll !important;
    }

    .is-mobile-menu-container ul{
        list-style: none !important;
    }

    .header-nav-item.has-mega-menu .sub-menu-container{
        max-height: 0 !important;
        overflow: hidden !important;
        transition: 200ms!important;
        position: relative !important;
        top: unset !important;
        left: unset !important;
        background-color: transparent !important;
    }

    .header-nav-item.has-mega-menu.active .sub-menu-container{
        max-height: 400px!important;
        transition: 200ms!important
    }
/* 
    .is-mobile-menu-items{
        padding-top: 11px !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        flex-direction: column !important;
        gap: 0 !important;
    } */

    .is-mobile-menu-inner > *{
        padding-left: var(--px-global) !important;
        padding-right: var(--px-global) !important;
    }

    .is-mobile-menu-container .menu-item-has-children .sub-menu:not(.is-mobile-menu-container .menu-item-has-children .sub-menu .sub-menu){
        max-height: 0 !important;
        overflow-y: scroll !important;
        overflow-x: hidden !important;
        transition: 200ms !important
    }

    .is-mobile-menu-container .is-mega-menu-container .is-mega-menu-inner{
        overflow: scroll !important;
    }

    .is-mega-menu-container .is-mega-menu-inner{
        padding: 16px 20px !important;
        padding-bottom: 12em !important;
        gap: 24px !important;
    }

    .is-multilevel-mobile-menu-back-button{
        width: 100% !important;
        padding: 1em 20px !important;
    }

    .is-mega-menu-inner .mega-menu-nav-item{
        flex-wrap: nowrap !important;
    }

    .is-mega-menu-container > div,
    .is-mega-menu-inner{
        flex-wrap: nowrap !important;
        flex-direction: column !important;
    }

    .is-mobile-menu-container .menu-item-has-children.active .sub-menu:not(.is-mobile-menu-container .menu-item-has-children.active .sub-menu .sub-menu),
    .header-nav-item.has-mega-menu.active .is-mega-menu-container{
        max-height: 500px!important;
        transition: 200ms!important
    }

    .header-nav-item.has-mega-menu .is-mega-menu-container{
        position: relative !important;
        top: unset !important;
        left: unset !important;
    }

    .mega-menu-nav-wrapper,
    .is-mega-menu-inner{
        flex-direction: column !important;
    }

    .mega-menu-cta-wrapper{
        width: 100% !important;
    }

    .is-mobile-menu-container .menu-item-has-children .sub-menu .sub-menu{
        margin: 0 !important;
        padding: 0 !important;
    }

    .is-mobile-menu-container .header-nav-menu{
        flex-direction: column !important;
        height: fit-content !important;
        /* gap: 24px !important; */
    }

    .is-mobile-menu-container .header-nav-item{
        height: fit-content !important;
        width: 100% !important;
        padding: 0 !important;
    }

    .header-nav-link{
        justify-content: space-between !important;
    }

    .is-mobile-menu-container .header-nav-item{
        padding-top: 16px !important;
        padding-bottom: 16px !important;
    } 

    .is-multilevel-mobile-menu-back-button{
        display: flex !important;
        flex-wrap: nowrap !important;
        align-items: center !important;
    }

    .is-multilevel-mobile-menu-back-button::before{
        content: '';
        width: 10px;
        height: 10px;
        display: inline-block;
        background-color: #2A2D40;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='8' height='6' viewBox='0 0 8 6' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.00008 5.28009C4.1434 5.28009 4.28676 5.22536 4.39607 5.11616L7.83589 1.67625C8.0547 1.45743 8.0547 1.10266 7.83589 0.883929C7.61716 0.6652 7.26245 0.6652 7.04362 0.883929L4.00008 3.9277L0.956408 0.884141C0.737679 0.665413 0.382922 0.665413 0.16421 0.884141C-0.0547132 1.10287 -0.0547132 1.45754 0.16421 1.67636L3.60398 5.11628C3.71334 5.22547 3.8567 5.28009 4.00008 5.28009Z' fill='white'/%3E%3C/svg%3E");
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        position: relative;
        margin-right: 10px;
        transform: rotate(90deg);
        transition: 200ms !important;
    }

    .is-mobile-menu-secondary-menu{
        display: flex !important;
        flex-direction: row !important;
        align-items: center !important;
        justify-content: start !important;
        gap: 20px !important;
    }

    .is-mobile-menu-secondary-menu-cta{
        border-top: 0.5px solid rgba(255, 255, 255, 0.2) !important;
        border-bottom: 0.5px solid rgba(255, 255, 255, 0.2) !important;
    }

    .is-mobile-menu-secondary-menu > div{
        width: 100% !important;
    }

    .is-mobile-menu-secondary-menu a{
        width: 100% !important;
    }

    .is-mobile-menu-container .header-nav-item.has-mega-menu .header-nav-link.link-has-mega-menu::after{
        transform: rotate(270deg) !important;
    }

    .is-tablet-header-logo-centered {
		position: absolute !important;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		line-height: 0;
		z-index: 1;
	}

    .is-header-main{
        padding-left: 0 !important;
        padding-right: 0 !important;
        height: 73px !important;
    }

    .header-main-secondary{
        width: fit-content !important;
        padding-right: 20px !important;
    }

    .header-nav-menu .elementor-widget-container,
    .header-nav-menu p,
    .header-nav-menu a{
        width: 100% !important;
    }

    .header-nav-menu a{
        display: block !important;
    }

    .is-mobile-menu-container .header-nav-menu > *{
        display: flex !important;
        justify-content: space-between !important;
        gap: 0 !important;
    }

    .is-mega-menu-container .header-nav-menu a{
        width: 100% !important;
        display: block !important;
    }

    /* .is-mobile-menu-container .header-nav-menu > *::after{
        content: '';
        width: 10px;
        height: 10px;
        display: inline-block;
        background-color: #2A2D40;
        -webkit-mask-image: url("data:image/svg+xml,%3Csvg width='5' height='8' viewBox='0 0 5 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4.70117 4.00017C4.70117 3.85685 4.64645 3.71349 4.53724 3.60418L1.09733 0.164358C0.878515 -0.0544599 0.52374 -0.0544599 0.305011 0.164358C0.0862819 0.383087 0.0862819 0.737791 0.305011 0.956626L3.34879 4.00017L0.305224 7.04384C0.0864947 7.26257 0.0864947 7.61732 0.305224 7.83604C0.523953 8.05496 0.878621 8.05496 1.09744 7.83604L4.53736 4.39627C4.64655 4.2869 4.70117 4.14355 4.70117 4.00017Z' fill='%232A2D40'/%3E%3C/svg%3E");
        -webkit-mask-position: center;
        -webkit-mask-repeat: no-repeat;
        -webkit-mask-size: contain;
        position: relative;
        top: 4px;
    } */

    .is-site-logo{
        position: absolute !important;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }

    header{
        z-index: 100000!important;    
    }

}

@media only screen and (max-width: 600px) and (min-width: 0px){
    .is-mobile-menu-container{
        max-width: 85vw !important;
    }
}

@media only screen and (max-width: 767px) and (min-width: 0px){
    .top-bar p{
        font-size: 14px !important;
    }
}
