.icon-picto-up:before {
  content: url('data:image/svg+xml,<svg width="8" height="6" viewBox="0 0 8 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M7.5 4.75977L3.87037 0.759766L0.5 4.75977" stroke="%233D3F49" stroke-linecap="round"/></svg>');
}
.icon-picto-down:before {
  content: url('data:image/svg+xml,<svg width="8" height="6" viewBox="0 0 8 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M0.5 0.5L4.12963 4.5L7.5 0.5" stroke="%233D3F49" stroke-linecap="round"/></svg>');
}
.fa-xmark::before {
	content: "\f00d";
}
#site-navigation{
  position: relative;
}
#site-navigation[aria-expanded="true"] .dropdown-icon.open,
#site-navigation[aria-expanded="false"] .dropdown-icon.close{
  display: none;
}
#site-navigation[aria-expanded="true"] .primary-menu-container {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	max-height: calc(100vh - 30px);
	overflow-y: scroll;
    scrollbar-width: none; /* Firefox */
    -ms-overflow-style: none; /* IE et Edge Legacy */
}
#site-navigation[aria-expanded="true"] .primary-menu-container::-webkit-scrollbar {
    display: none;
}
.menu-button-container *,
.menu-button-container{
    line-height: 1;
}
.primary-menu-container {
	display: none;
	position: fixed;
	margin-top: -18px;
	right: 20px;
	background: linear-gradient(15.12deg, #E865A3 -13.49%, #EC6987 1.18%, #F27060 23.19%, #F67448 41.53%, #F87640 52.54%, #F8903B 68.44%, #F9A838 85.56%, #FAB137 96.56%);
	padding: 100px 50px 50px 50px;
	border-radius: 10px;
	border: 1px solid #000;
	z-index: 5;
}
#primary-menu,
#primary-mobile-menu{
  background: #FFFFFF;
  border: 1px solid #3D3F49;
  color: #000;
  padding: 18px 40px 18px 24px;
  border-radius: 10px;
}
#primary-menu:not(:hover){
  box-shadow: #3D3F49 1.95px 1.95px 2.6px;
}
#primary-mobile-menu {
	padding: 0;
	border: none;
	font-size: 1.5em;
}
#site-navigation[aria-expanded="true"] #primary-mobile-menu{
    background: transparent;
    border-radius: 0;
    color: #fff;
}
#primary-menu i{
  position: absolute;
  right: 24px;
  top: 50%;
  transform: translateY(-50%);
}
#primary-menu:hover,
#primary-mobile-menu:hover {
  box-shadow: 0 0 0 1px #000;
}

.menu-open{
  max-height: 100vh;
  overflow-y: hidden;
}
@media only screen and (min-width: 1081px){
  #primary-menu{
    font-weight: 400;
  }
  #primary-mobile-menu{
      display: none;
  }
  #site-navigation[aria-expanded="true"] .menu-button-container {
      position: absolute;
      z-index: 10;
      right: 0;
  }
  .menu-open header .panier{
    display: none;
  }
  .menu-open header .account{
    z-index: 99;
  }
  .menu-open header .account a{
    text-align: center;
    text-decoration: none;
  }
  .menu-open header .account a:after{
    content: "Mon compte";
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
  }
  .menu-open header .account svg{
    aspect-ratio: 1/1;
    background: #fff;
    border: 1px solid black;
    border-radius: 10px;
    width: 40px;
    height: auto !important;
    padding: 10px;
    margin: 0 auto;
  }
}
@media only screen and (max-width: 1080px){
    .header-menu-top.active{
        position: absolute!important;
        top: 0;
        z-index: 99!important;
    }
    #primary-menu{
        display: none;
    }
    #site-navigation[aria-expanded="true"] .primary-menu-container {
        top: 0;
        left: 0;
        right: 0;
        width: 100vw;
        height: 100vh;
        max-height: 100vh!important;
        border: none;
        border-radius: 0;
        padding: 150px 2rem 110px 2rem;
        background: linear-gradient(20.92deg, #E865A3 -1.25%, #EC6987 15.39%, #F27060 40.33%, #F67448 61.13%, #F87640 73.6%, #F8903B 91.62%, #F9A838 111.02%, #FAB137 123.5%);
        z-index: -1;
    }
    .full-mobile{
        position: fixed;
        width: 100%;
        bottom: 0;
        left: 0;
        background: white;
        padding: .5rem;
        min-height: 110px;
    }
    #primary-menu-list {
      overflow-y: scroll; /* garde le scroll */
      
      /* masque la barre sur tous les navigateurs */
      scrollbar-width: none;      /* Firefox */
      -ms-overflow-style: none;   /* IE / Edge */
    }

    #primary-menu-list::-webkit-scrollbar {
      display: none;              /* Chrome / Safari */
    }
    .menu-open .elementor-widget-theme-site-logo {
      z-index: 10;
      top: 10px;
    }
}
#primary-menu-list{
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
#primary-menu-list li::marker{
  content: "";
}
#primary-menu-list a{
  color: #fff;
  text-decoration: none;
  font-weight: bold;
  font-size: 25px;
  text-transform: uppercase;
}
.primary-menu-container .cta-abonnement{
    border: 11px solid #fff;
}
/* Conteneur global */
ul.rs {
  display: flex;
  gap: 15px;
  list-style: none;
  padding: 0;
  margin: 0;
}

/* Liens dans la liste */
ul.rs li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  position: relative;
  text-decoration: none;
  padding: 3px; /* épaisseur du contour */
  background: linear-gradient(135deg, #E867A0 0%, #FBB037 100%);
  transition: all 0.3s ease;
}

/* Le fond blanc intérieur */
ul.rs li a::before {
  content: "";
  position: absolute;
  inset: 3px;
  background: #fff;
  border-radius: 50%;
  z-index: 0;
}

/* Icône */
i{
  font-style: normal;
}
ul.rs li i {
  position: relative;
  z-index: 1;
  font-size: 22px;
  background: linear-gradient(135deg, #E867A0 0%, #FBB037 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  transition: all 0.3s ease;
}

/* Hover : fond dégradé plein + icône blanche */
ul.rs li a:hover::before {
  background: linear-gradient(135deg, #E867A0 0%, #FBB037 100%);
}

ul.rs li a:hover i {
  background: none;
  -webkit-text-fill-color: #fff;
}

/* Footer - Réseau sociaux */
footer ul.rs li a{
  width: 29px;
  height: 29px;
}
footer ul.rs li a::before {
  inset: 1px;
}
footer ul.rs li i{
  font-size: 15px;
}
