.modal {display: none;position: fixed;z-index: 2001!important;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgb(0,0,0);background-color: rgba(0,0,0,0.4);}
  .close-modal-login {border: none;background: none;}
  .close-modal-login:hover, .close-modal-login:focus {color: black;text-decoration: none;cursor: pointer;}
  body.no-scroll {overflow: hidden;}
  .fa-eye, .fa-eye-slash {right: 9px!important;top: unset!important;}
  .password_container {display: flex; align-items: center;}
  .modal-login-header{display: flex;justify-content: flex-end;padding: 24px 32px;}
  .form-modal-login {padding: 32px 64px;}
  @media (min-width:0px) and (max-width:991px){
    .modal-login-header {position: relative;display: flex;align-items: center;justify-content: flex-end;padding: 12px 16px;height: 44px;}
    .modal-login-header > a > img {position: absolute;left: 50%;transform: translateX(-50%);}
    .modal-login-header .close-modal-login {cursor: pointer;}
    .form-modal-login {padding: 32px 16px 64px 16px;}
  }



  .heart-h{float:left; height:24px; width:24px; background-image:url(/images/heart.svg); position:absolute;margin-top:10px}
.heart2{color:#ffffff;background-color:#FF780F; border-radius:20px;font-size: 8px;font-style: normal;font-weight: 700;line-height: normal;position: absolute;top: 8px;right: 4px;width: 16px;height: 16px;display: flex;align-items: center;justify-content: center;}
.nbPanier {color:#ffffff;background-color:#FF780F; border-radius:20px;font-size: 8px;font-style: normal;font-weight: 700;line-height: normal;position: absolute;top: 10px;right: 4px;width: 16px;height: 16px;display: flex;align-items: center;justify-content: center;}
.nbWishList, .nbPanier {display: none;}
.nbWishList.flex, .nbPanier.flex {display: flex;}
.ref-site {font-size:16px!important; margin-top: 1px!important;}
.typo-nbr {background-color: #359AA5!important; width:7px!important; font-size:16px!important}

.typo-nbr {
  background-color: #359AA5!important;width:7px!important; font-size:14px!important; height:18px!important}
  .ref-site {font-size:14px!important; margin-top: 1px!important;margin-left: 8px!important;}

   .text-menu-mobile {color: black; font-size: 14px;font-weight: 600; word-wrap: break-word}
        .menu_solde > .text-menu-mobile, .menu_solde {font-weight: bold;color: #FF780F!important;}
        .menu_solde:hover, .menu_solde.active {text-decoration-line: underline;}




        .txt-aff{padding-left: 24px; padding-right: 24px; padding-top: 16px; padding-bottom: 16px; background: rgba(41, 41, 41, 0.33); border-top-left-radius: 12px; border-top-right-radius: 12px; border: 1px rgba(255, 255, 255, 0.70) solid; backdrop-filter: blur(24px); justify-content: center; align-items: center; gap: 10px; display: inline-flex}
@media screen and (max-width: 500px) {
    .image-desktop {
        display: none!important;
    }
}
@media screen and (min-width: 501px) {
    .mobile-image {
        display: none!important;
    }
}  
.slider-container {
  position: relative;
  overflow: hidden;
  width: 100%;
  height: 280px;
}

.slide {
  position: absolute;
  top: 0;
  left: 0; 
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.8s ease-in-out, transform 0.8s ease-in-out;
}

.slide.active {
  opacity: 1;
  pointer-events: auto;
  z-index: 1;
}

.content-btn-slider {
    display: flex;
    max-width: 1120px;
    justify-content: space-between;
    position: absolute;
    width: 100%;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none; 
}

.content-btn-slider .prev, .content-btn-slider .next {width: 32px; height: 32px; position: relative;transform-origin: 0 0; background: rgba(41, 41, 41, 0.33); box-shadow: 0px 5.142857074737549px 7.714285850524902px rgba(0, 0, 0, 0.08); border-radius: 6px; border: 1px rgba(255, 255, 255, 0.70) solid; backdrop-filter: blur(15.43px);cursor:pointer;pointer-events: auto;
}

@media (min-width:0px) and (max-width:991px){
.content-btn-slider .prev, .content-btn-slider .next{width: 24px; height: 24px; margin-right:16px; margin-left: 16px}

}  
.content-btn-slider .prev > img, .content-btn-slider .next > img {width: 100%;}
.content-btn-slider .prev > img {rotate: 180deg;}
.dot-container {
    max-width: 1120px;width: 100%;justify-content: flex-end; align-items: flex-start; gap: 10px; display: inline-flex;position: absolute;bottom: 8px;left: 50%;transform: translate(-50%, -50%); z-index: 2;
}

.dot {
    width: 10px;
    height: 10px;
    border-radius: 12px;
    border: 1px solid var(--White, #FFF);
}

.dot.active {
background: var(--Orange, #FF780F);border-radius: 12px;
border: 1px solid var(--White, #FFF );width: 10px;
height: 10px; 
}

.slider-home {
    padding-top: 173px;
    position: relative;
}

.banner-section {
    width: 100%;
    background: linear-gradient(0deg, rgba(22, 46, 54, 0.80) 0%, rgba(22, 46, 54, 0.80) 100%);
    padding-top: 167px;
}

.banner-section.default {background: none;}

.banner-section > .container {
    max-width: 1120px;
    margin: auto;
    padding: 24px 0;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 10px;
    display: flex;
}

.banner-content {
    flex: 1 1 0;
    align-self: stretch;
    justify-content: flex-start;
    align-items: center;
    gap: 24px;
    display: flex;
    height: 72px;
}

.banner-title {
    color: white;
    font-size: 24px;
    font-family: Inter;
    font-weight: 900;
    word-wrap: break-word;
    line-height: normal;
}

.banner-description {
    color: white;
    font-size: 14px;
    font-family: Inter;
    font-weight: 500;
    word-wrap: break-word;
    line-height: normal;
}
.cube-prod > div > a > img {
    border-radius: 12px;
    width: 100%;
}

.fil-ariane-content-produit > span {font-size: 12px;}

@media (min-width:0px) and (max-width:991px){
    .dot-container {
        justify-content: center;
        left: inherit;
        transform: none;
        gap: 4px;
    }
    .dot {
    width: 4px;
    height: 4px;
    border-radius: 50%;
    border: 1px solid var(--White, #FFF);
    }

    .dot.active {
        width: 12px;
        height: 4px;
        border-radius: 4px;
        border: 1px solid var(--White, #FFF);
        background: var(--White, #FFF);
        backdrop-filter: blur(6px);
    }

    .slider-home{
        padding-top: 0;
    }
    .banner-section {
        padding-top: 0;
    }

    .banner-section > .container {
        padding: 24px 16px 32px 16px;
        gap:0;
    }
    #fil_ariane{
        padding:8px 0 0 0 ;
        margin-bottom: 0!important;
        font-size: 10px;
    }
    #fil_ariane a {
        font-size: 10px;
    }
    .fil-ariane-content-produit {color: white;padding: 8px 16px 0px 16px!important;}
    .fil-ariane-content-produit a{color: white;}
    .cube-produits-web-tablette{
        width: 100%;
    }
    .cube-prod {
        width: 100%;
        height: 174px;
        flex-direction: row;
    }
    .cube-prod > div > a > img {
        height: 174px;
        width: 152px;
        border-radius: 12px;
    }
    .banner-content{flex-direction: column; gap: 8px;align-items:flex-start;}
    .banner-title{font-size: 20px;}
}


.slick-dots > li > button::before {content: none;}
.slick-dots > .slick-active {width: 12px;height: 4px;border-radius: 4px;background: #C84406;}
.slick-dots > li {width: 4px;height: 4px;border-radius: 4px;background: #FFD9A7;}
.slick-dots{margin-top:-15px}
@media (min-width:0px) and (max-width:500px){
  .content-btn-slick {display: none;}
}



@media (min-width: 0px) and (max-width: 991px) {
.txt-aff{max-width:250px; text-align:center}
    .border-news-mobile {
        gap: 24px;
    }
    .slider-new > .slick-dots {
        bottom: 0;
        position: relative;
    }
    .slider-new {display: flex;flex-direction: column;gap: 24px;}
    .slider-new > .slick-list {padding: 0px 0px 8px 0;}
    .button-add-cart {padding: 0;width: 38px;height: 38px;display: flex;align-items: center;justify-content: center;}
}

body.modal-open {
    overflow: hidden;
}

#modal-panier {
    display: none;
    position: fixed;
    justify-content: flex-end; /* Center horizontally */
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.4);
    z-index: 2000 !important;
}

.modal-content-panier {
    background-color: #fefefe;
    width: 419px;
    max-height: 100%; /* Maximum height relative to the viewport height */
    display: flex;
    flex-direction: column;
}

.header-modal-panier {
    padding: 18px 32px;
    display: flex;
    justify-content: space-between;
    background: #2B6673;
    align-items: flex-start;
}

.title-modal-panier span:first-child {
    font-size: 14px;
    color: #FFF;
    font-weight: 600;
}

.title-modal-panier span:last-child {
    color: #FFF;
    font-size: 12px;
    font-weight: 300;
}



.modal-footer {
    background: var(--Fountain-Blue-200, #B9E5E8);
    padding: 24px 32px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-shrink: 0; /* Ensure footer doesn't shrink */
}


  .modal-content-panier {
  overflow-y: scroll;
  scrollbar-color: #FF780F #F9F9F9;
  scrollbar-width: thin;
  }
.modal-content-panier::-webkit-scrollbar {
  width: 6px;
}

.modal-content-panier::-webkit-scrollbar-track {
  background: #F9F9F9;
}

.modal-content-panier::-webkit-scrollbar-thumb {
  background-color: #FF780F;
  border-radius: 0px;
  border: 2px solid #F9F9F9;
}


@media (min-width:0px) and (max-width:991px){
.pourmob-mar{margin-right:15px!important}}