@import url('https://fonts.googleapis.com/css2?family=Anton&display=swap');

h1,
h2,
h3,
#_desktop_top_menu .top-menu a,
#_mobile_top_menu .top-menu a,
#header .top-menu a {
    font-family: 'Anton', sans-serif;
    font-weight: 400;
}


/* ==========================================================
   LEBEN MODELS — PERSONNALISATION DU THÈME CLASSIC
   PrestaShop 8.2
   ========================================================== */

/* ==========================================================
   FOND SUR TOUTE LA HAUTEUR DE LA PAGE
   ========================================================== */

html {
    min-height: 100%;
    background: #ededed;
}

body {
    min-height: 100vh;
    margin: 0;

    background: linear-gradient(
        180deg,
        #252525 0%,
        #353535 12%,
        #555555 28%,
        #8a8a8a 50%,
        #c5c5c5 72%,
        #ededed 100%
    );

    background-repeat: no-repeat;
    background-color: #ededed;
    background-attachment: scroll;
}

/* Tous les conteneurs principaux doivent rester transparents */

#wrapper,
#content-wrapper,
#main,
.featured-products,
.products,
.homefeatured {
    background: transparent !important;
}

/* ==========================================================
   2. HEADER GLOBAL
   ========================================================== */

#header {
    position: relative;
    z-index: 20;
    background: transparent;
    border: 0;
    box-shadow:
        0 7px 18px rgba(0, 0, 0, 0.22);
}


/* ==========================================================
   3. BARRE SUPÉRIEURE
   Contact, langue, connexion et panier
   ========================================================== */

#header .header-nav {
    min-height: 42px;
    margin: 0;
    padding: 0;
    background: #e7e7e7;
    border: 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    box-shadow: none;
}


/* Container de la barre supérieure */

#header .header-nav > .container {
    background: transparent;
}


/* Textes et icônes de la barre supérieure */

#header .header-nav,
#header .header-nav a,
#header .header-nav .material-icons,
#header .header-nav .expand-more,
#header .header-nav .hidden-sm-down,
#header .header-nav .hidden-md-up {
    color: #474747;
}


/* Survol des liens de la barre supérieure */

#header .header-nav a:hover,
#header .header-nav .expand-more:hover {
    color: #111111;
}


/* Séparateurs légèrement visibles */

#header .header-nav .user-info,
#header .header-nav .language-selector-wrapper,
#header .header-nav .currency-selector {
    border-color: rgba(0, 0, 0, 0.08);
}


/* ==========================================================
   4. PANIER
   ========================================================== */

#header .header-nav .blockcart {
    min-height: 42px;
    background: #23b9d7;
    transition:
        background-color 0.2s ease,
        transform 0.2s ease;
}

#header .header-nav .blockcart:hover {
    background: #169bb6;
}

#header .header-nav .blockcart,
#header .header-nav .blockcart a,
#header .header-nav .blockcart .material-icons,
#header .header-nav .blockcart .cart-products-count {
    color: #ffffff;
}


/* ==========================================================
   5. HEADER PRINCIPAL
   Logo, menu et recherche
   ========================================================== */

#header .header-top {
    padding-top: 22px;
    padding-bottom: 22px;
    background: transparent;
}

#header .header-top > .container {
    background: transparent;
}


/* Logo */

#header .header-top .logo {
    max-height: 170px;
    width: auto;
}


#header .logo {
    filter:
        drop-shadow(0 3px 3px rgba(0,0,0,.15))
        drop-shadow(0 10px 20px rgba(0,0,0,.28));
    transition: filter .25s ease, transform .25s ease;
}

#header .logo:hover {
    transform: translateY(-2px);

    filter:
        drop-shadow(0 5px 5px rgba(0,0,0,.18))
        drop-shadow(0 15px 28px rgba(0,0,0,.35));
}

/* ==========================================================
   6. MENU PRINCIPAL
   ========================================================== */

#header .header-top #top-menu,
#header .header-top .top-menu {
    background: transparent;
}


/* Liens principaux */

#header .header-top #top-menu > li > a,
#header .header-top .top-menu > li > a,
#header .header-top .top-menu a[data-depth="0"] {
    position: relative;
    padding: 14px 13px;
    color: #f2f2f2;
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    font-size: 25px;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    transition:
        color 0.2s ease,
        background-color 0.2s ease;
}


/* Trait sous le menu au survol */

#header .header-top .top-menu a[data-depth="0"]::after {
    content: "";
    position: absolute;
    right: 16px;
    bottom: 7px;
    left: 16px;
    height: 2px;
    background: #ffffff;
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.2s ease;
}


/* Survol et élément actif */

#header .header-top .top-menu a[data-depth="0"]:hover,
#header .header-top .top-menu .current a[data-depth="0"] {
    color: #ffffff;
}

#header .header-top .top-menu a[data-depth="0"]:hover::after,
#header .header-top .top-menu .current a[data-depth="0"]::after {
    transform: scaleX(1);
}


/* Icônes et flèches du menu */

#header .header-top .top-menu .material-icons,
#header .header-top .top-menu .sub-menu-arrow {
    color: #f2f2f2;
}




#header .top-menu {
    display: flex;
    align-items: center;
    gap: 18px;
}

#header .top-menu > li > a,
#header .top-menu a[data-depth="0"] {

    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    font-size: 2rem;          /* environ 32px */
    font-weight: 400;
    text-transform: uppercase;
    letter-spacing: 0.03em;

    padding: 18px 10px;
    color: #ffffff;

    transition: color .25s ease;
}

#header .top-menu > li > a:hover,
#header .top-menu a[data-depth="0"]:hover {
    color: #d8d8d8;
}

#header .header-top {
    padding-top: 30px;
    padding-bottom: 30px;
}

/* ==========================================================
   7. SOUS-MENUS
   ========================================================== */

#header .header-top .top-menu .sub-menu {
    padding: 18px;
    background: rgba(35, 35, 35, 0.98);
    border: 1px solid rgba(255, 255, 255, 0.1);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
}

#header .header-top .top-menu .sub-menu a {
    color: #d8d8d8;
    font-family: inherit;
    text-transform: none;
}

#header .header-top .top-menu .sub-menu a:hover {
    color: #ffffff;
}


/* ==========================================================
   8. RECHERCHE
   ========================================================== */

#search_widget,
#header .search-widget {
    background: transparent;
}

#search_widget form,
#header .search-widget form {
    position: relative;
}


/* Champ de recherche */

#search_widget form input[type="text"],
#header .search-widget form input[type="text"] {
    height: 42px;
    padding: 0 45px 0 45px;
    color: #ffffff;
    background: rgba(255, 255, 255, 0.12);
    border: 1px solid rgba(255, 255, 255, 0.24);
    border-radius: 3px;
    outline: none;
    box-shadow: none;
    transition:
        background-color 0.2s ease,
        border-color 0.2s ease;
}

#search_widget form input[type="text"]:focus,
#header .search-widget form input[type="text"]:focus {
    background: rgba(255, 255, 255, 0.18);
    border-color: rgba(255, 255, 255, 0.65);
}


/* Placeholder */

#search_widget form input[type="text"]::placeholder,
#header .search-widget form input[type="text"]::placeholder {
    color: rgba(255, 255, 255, 0.72);
    opacity: 1;
}


/* Icône de recherche */

#search_widget form button,
#search_widget form button .material-icons,
#header .search-widget form button,
#header .search-widget form button .material-icons {
    color: #ffffff;
}


/* ==========================================================
   RECHERCHE DANS HEADER-NAV
   ========================================================== */

/* Barre supérieure */
#header .header-nav {
    min-height: 50px;
}

/* Colonne Contact + Recherche */
#header .header-nav .col-md-5 {
    display: flex;
    align-items: center;
    gap: 30px;

    min-height: 50px;
    min-width: 0;

    overflow: visible;
}


/* ==========================================================
   CONTENEUR RECHERCHE
   ========================================================== */

#header .header-nav #search_widget {
    position: relative;

    flex: 0 1 280px;
    width: 280px;
    max-width: 280px;

    margin: 0;
    padding: 0;

    float: none;
}


/* Formulaire */
#header .header-nav #search_widget form {
    position: relative;

    display: flex;
    align-items: center;

    width: 100%;
    height: 38px;

    margin: 0;
    padding: 0;

    overflow: hidden;

    background: #ffffff;
    border: 1px solid #c8c8c8;
    border-radius: 4px;

    box-sizing: border-box;
}


/* ==========================================================
   CHAMP
   ========================================================== */

#header .header-nav #search_widget input[type="text"] {
    display: block;

    width: 100%;
    height: 100%;

    margin: 0;
    padding: 0 35px 0 42px;

    border: 0;
    outline: 0;

    color: #444444;
    background: transparent;

    font-size: 15px;
    line-height: normal;

    box-shadow: none;

    box-sizing: border-box;
}


/* Placeholder */
#header .header-nav #search_widget input[type="text"]::placeholder {
    color: #888888;
    opacity: 1;
}


/* ==========================================================
   LOUPE
   ========================================================== */

#header .header-nav #search_widget .search {
    position: absolute;

    top: 50%;
    left: 12px;

    width: 22px;
    height: 22px;

    margin: 0;
    padding: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #777777;

    font-size: 22px;
    line-height: 1;

    transform: translateY(-50%);

    pointer-events: none;
    z-index: 2;
}


/* ==========================================================
   CROIX D'EFFACEMENT
   ========================================================== */

#header .header-nav #search_widget .clear {
    position: absolute;

    top: 50%;
    right: 10px;

    width: 20px;
    height: 20px;

    margin: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    color: #777777;

    font-size: 20px;
    line-height: 1;

    transform: translateY(-50%);
}


/* ==========================================================
   FOCUS
   ========================================================== */

#header .header-nav #search_widget form:focus-within {
    border-color: #999999;
}


/* Empêche le champ de provoquer un débordement horizontal */
#header .header-nav #search_widget,
#header .header-nav #search_widget form,
#header .header-nav #search_widget input {
    box-sizing: border-box;
}


#header .header-nav #_desktop_contact_link #contact-link, .sitemap {
    margin-top:0!important;
}

/* ==========================================================
   9. SLIDER DE LA PAGE D’ACCUEIL
   ========================================================== */

.carousel,
#carousel,
.carousel-inner {
    background: transparent;
}

.carousel {
    margin-top: 0;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.28);
}


/* ==========================================================
   10. TITRES
   ========================================================== */

h1,
h2,
h3,
.h1,
.h2,
.h3,
.products-section-title,
.block-category h1 {
    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    font-weight: 400;
    letter-spacing: 0.025em;
    text-transform: uppercase;
}


/* Titre Produits populaires */

.products-section-title {
    margin-top: 34px;
    margin-bottom: 25px;
    color: #eeeeee;
    text-align: center;
    text-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
}


/* ==========================================================
   11. CARTES PRODUITS
   ========================================================== */

.product-miniature {
    margin-bottom: 30px;
}

.product-miniature .thumbnail-container {
    height: auto;
    overflow: hidden;
    background: #ffffff;
    border: 0;
    border-radius: 2px;
    box-shadow:
        0 5px 18px rgba(0, 0, 0, 0.40),
        0 2px 5px rgba(0, 0, 0, 0.12);
    transition:
        transform 0.25s ease,
        box-shadow 0.25s ease;
}


/* Animation au survol */

.product-miniature:hover .thumbnail-container {
    transform: translateY(-5px);
    box-shadow:
        0 16px 32px rgba(0, 0, 0, 0.3),
        0 4px 8px rgba(0, 0, 0, 0.16);
}


/* Image produit */

.product-miniature .product-thumbnail img {
    transition: transform 0.35s ease;
}

.product-miniature:hover .product-thumbnail img {
    transform: scale(1.025);
}


/* Description sous l’image */

.product-miniature .product-description {
    position: relative;
    background: #ffffff;
}


/* Nom du produit */

.product-miniature .product-title,
.product-miniature .product-title a {
    color: #686868;
    font-size: 20px;
    line-height: 1.35;
}

.product-miniature .product-title a:hover {
    color: #202020;
}


/* Prix */

.product-miniature .product-price-and-shipping,
.product-miniature .price {
    color: #222222;
    font-weight: 700;
}


/* Badge rupture de stock */

.product-miniature .product-flags li.product-flag,
.product-miniature .product-flag {
    background: #23b9d7;
    box-shadow: 0 3px 7px rgba(0, 0, 0, 0.18);
}


/* Bouton favoris */

.product-miniature .wishlist-button-add {
    box-shadow: 0 2px 7px rgba(0, 0, 0, 0.2);
}


/* ==========================================================
   12. CONTENU DES PAGES INTERNES
   Le contenu reste lisible sur le dégradé
   ========================================================== */

.page-content,
.card,
.block-category,
.product-information,
.tabs,
.cart-grid-body .card,
.cart-grid-right .card {
    background: #ffffff;
    box-shadow: 0 7px 20px rgba(0, 0, 0, 0.14);
}

.page-content.page-cms {
    background: #ffffff!important;
}


/* ==========================================================
   13. FOOTER
   ========================================================== */

#footer {
    margin-top: 50px;
    background: #252525;
    color: #cfcfcf;
}

#footer a {
    color: #cfcfcf;
}

#footer a:hover {
    color: #ffffff;
}

#footer .footer-container {
    background: transparent;
}

.footer-container .h3, .footer-container .h3 a
{
    color:#fff!important;
}

/* ==========================================================
   FOOTER - RÉSEAUX SOCIAUX + MOYENS DE PAIEMENT
   ========================================================== */

#footer .leben-footer-extra {
    margin-top: 0px!important;
}


/* Réseaux sociaux */

#footer .leben-footer-social {
    margin-bottom: 0px!important;
}

#footer .leben-footer-social .ps-social-follow {
    margin: 0;
}

#footer .leben-footer-social .ps-social-follow h4 {
    display: none;
}

#footer .leben-footer-social .ps-social-follow ul {
    display: flex;
    align-items: center;
    gap: 12px;

    margin: 0;
    padding: 0;

    list-style: none;
}

#footer .leben-footer-social .ps-social-follow li {
    margin: 0;
}

#footer .leben-footer-social .ps-social-follow a {
    display: flex;
    align-items: center;
    justify-content: center;

    width: 38px;
    height: 38px;

    border-radius: 50%;

    background: rgba(255, 255, 255, 0.08);

    transition:
        background-color .2s ease,
        transform .2s ease;
}

#footer .leben-footer-social .ps-social-follow a:hover {
    background: rgba(255, 255, 255, 0.16);
    transform: translateY(-2px);
}


/* Moyens de paiement */

#footer .leben-footer-payments img {
    display: block;

    width: auto;
    max-width: 220px;
    height: auto;

    opacity: .9;
}


/* Mobile */

@media (max-width: 767px) {

    #footer .leben-footer-payments img {
        max-width: 190px;
    }

}


.block-social ul li {
    background-color:transparent!important;
}

#footer .block-social li.rss {
    width: 40px!important;
    background-position: center center !important;
    background-size: 34px 34px !important;

    overflow: visible !important;
}

#footer .block-social li.rss a {
    width: 40px!important;
}


/* ==========================================================
   14. VERSION MOBILE
   ========================================================== */

@media (max-width: 767px) {

    body {
        background:
            linear-gradient(
              180deg,
                #252525 0,
                #353535 280px,
                #555555 650px,
                #929292 1300px,
                #ededed 2100px
            );
        background-color: #ededed;
    }

    #header .header-top {
        padding-top: 12px;
        padding-bottom: 12px;
    }

    #header .header-top .logo {
        max-height: 85px;
    }

    #header .header-top .mobile {
        background: transparent;
    }

    #header .header-top .mobile,
    #header .header-top .mobile a,
    #header .header-top .mobile .material-icons {
        color: #ffffff;
    }

    #header .header-nav {
        background: #e7e7e7;
    }

    #header .header-nav,
    #header .header-nav a,
    #header .header-nav .material-icons {
        color: #3e3e3e;
    }

    #header .header-nav .blockcart,
    #header .header-nav .blockcart a,
    #header .header-nav .blockcart .material-icons {
        color: #ffffff;
    }

    .products-section-title {
        color: #ffffff;
        font-size: 23px;
    }

    .product-miniature {
        margin-bottom: 22px;
    }
}

h2.products-section-title {
    font-size: 25px;
}

/* ==========================================================
   HOME HERO : SLIDER + DEUX BANNIÈRES
   ========================================================== */

.home-hero-grid {
    display: grid;
    grid-template-columns: minmax(0, 2fr) minmax(300px, 1fr);
    gap: 14px;
    width: 100%;
    margin: 0 0 35px;
    align-items: stretch;
}


/* ==========================================================
   SLIDER
   ========================================================== */

.home-hero-slider {
    min-width: 0;
}

.home-hero-slider .carousel {
    width: 100%;
    height: 100%;
    margin: 0;
    overflow: hidden;
    background: #222222;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

.home-hero-slider .carousel-inner,
.home-hero-slider .carousel-item,
.home-hero-slider .carousel-item > a,
.home-hero-slider .carousel-item figure {
    width: 100%;
    height: 100%;
}

.home-hero-slider .carousel-item figure {
    margin: 0;
}

.home-hero-slider .carousel-item img {
    display: block;
    width: 100%;
    height: 100%;
    min-height: 500px;
    object-fit: cover;
}


/* ==========================================================
   COLONNE DE DROITE
   ========================================================== */

.home-hero-banners {
    display: grid;
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 14px;
    min-width: 0;
}


/* ==========================================================
   BANNIÈRES
   ========================================================== */

.home-hero-banner {
    position: relative;
    display: block;
    min-height: 0;
    overflow: hidden;
    background: #333333;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.28);
}

.home-hero-banner img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition:
        transform 0.35s ease,
        filter 0.35s ease;
}

.home-hero-banner:hover img {
    transform: scale(1.035);
    filter: brightness(0.82);
}


/* ==========================================================
   CONTRÔLES DU SLIDER
   ========================================================== */

.home-hero-slider .carousel-control {
    width: 58px;
    opacity: 1;
}

.home-hero-slider .carousel-control .material-icons {
    color: #ffffff;
    font-size: 42px;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.65);
}

.home-hero-slider .carousel-indicators {
    bottom: 15px;
}

.home-hero-slider .carousel-indicators li {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.55);
}

.home-hero-slider .carousel-indicators li.active {
    background: #ffffff;
}


/* ==========================================================
   TABLETTE
   ========================================================== */

@media (max-width: 991px) {

    .home-hero-grid {
        grid-template-columns: minmax(0, 1.65fr) minmax(230px, 1fr);
        gap: 10px;
    }

    .home-hero-banners {
        gap: 10px;
    }

    .home-hero-slider .carousel-item img {
        min-height: 390px;
    }
}


/* ==========================================================
   MOBILE
   ========================================================== */

@media (max-width: 767px) {

    .home-hero-grid {
        display: block;
        margin-bottom: 25px;
    }

    .home-hero-slider {
        margin-bottom: 10px;
    }

    .home-hero-slider .carousel-item img {
        height: auto;
        min-height: 0;
        aspect-ratio: 16 / 9;
    }

    .home-hero-banners {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-template-rows: none;
        gap: 10px;
    }

    .home-hero-banner {
        aspect-ratio: 4 / 3;
    }
}


/* ==========================================================
   PETIT MOBILE
   ========================================================== */

@media (max-width: 480px) {

    .home-hero-banners {
        grid-template-columns: 1fr;
    }

    .home-hero-banner {
        aspect-ratio: 16 / 8;
    }
}


/* ==========================================================
   PAGE CATÉGORIE - SUPPRESSION DE LA COLONNE GAUCHE
   ========================================================== */

#category #left-column {
    display: none;
}

/* Le contenu prend toute la largeur */

#category #content-wrapper {
    width: 100%;
    max-width: 100%;
    flex: 0 0 100%;
}

/* Compatibilité Bootstrap */

#category #content-wrapper.col-md-9,
#category #content-wrapper.col-lg-9,
#category #content-wrapper.col-xl-9 {
    flex: 0 0 100%;
    max-width: 100%;
}


/* ==========================================================
   COULEUR PRINCIPALE LEBEN MODELS
   Bleu initial : 25b9d7
   Rouge ok : f44051
   ========================================================== */

:root{
    --leben-red:#5dbacd;
    --leben-red-hover:#5dbacd;
}


/* ===========================
   Panier
   =========================== */

#header .blockcart,
#header .header-nav .blockcart{
    background:var(--leben-red)!important;
}

#header .blockcart:hover,
#header .header-nav .blockcart:hover{
    background:var(--leben-red-hover)!important;
}


/* ===========================
   Labels produit
   =========================== */

.product-flag,
.product-flags li,
.product-miniature .product-flag{
    background:var(--leben-red)!important;
}


/* ===========================
   Boutons principaux
   =========================== */

.btn-primary,
.btn-primary:hover,
.btn-primary:focus{
    background:var(--leben-red);
    border-color:var(--leben-red);
}

.btn-primary:hover{
    background:var(--leben-red-hover);
    border-color:var(--leben-red-hover);
}


/* ===========================
   Prix promotion
   =========================== */

.product-price,
.current-price{
    color:var(--leben-red);
}


/* ===========================
   Liens actifs
   =========================== */

a:hover{
    color:var(--leben-red);
}


/* ===========================
   Pagination
   =========================== */

.pagination .current a,
.page-item.active .page-link{
    background:var(--leben-red);
    border-color:var(--leben-red);
}


/* ===========================
   Checkboxes / radios
   =========================== */

.custom-checkbox input[type=checkbox]+span,
.custom-radio input[type=radio]+span{
    border-color:#999;
}

.custom-checkbox input[type=checkbox]:checked+span,
.custom-radio input[type=radio]:checked+span{
    background:var(--leben-red);
    border-color:var(--leben-red);
}


/* ==========================================================
   HEADER DES PAGES CATÉGORIE
   ========================================================== */

#category .leben-category-header {
    width: 100%;
    margin-bottom: 40px;
}


/* Titre */

#category .leben-category-title {
    margin: 0 0 18px;
    padding: 0;

    color: #222222;

    font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
    font-size: 36px;
    font-weight: 400;
    line-height: 1;
    text-transform: uppercase;
}


/* Image de catégorie pleine largeur */

#category .leben-category-cover {
    width: 100%;
    height: 340px;

    overflow: hidden;

    background: #222222;

    box-shadow:
        0 8px 22px rgba(0, 0, 0, 0.22);
}


#category .leben-category-cover img {
    display: block;

    width: 100%;
    height: 100%;

    object-fit: cover;
    object-position: center;

    margin: 0;
}


/* Description éventuelle */

#category .leben-category-description {
    margin-top: 20px;

    color: #555555;
    font-size: 16px;
    line-height: 1.6;
}


/* Tablette */

@media (max-width: 991px) {

    #category .leben-category-cover {
        height: 260px;
    }

}


/* Mobile */

@media (max-width: 767px) {

    #category .leben-category-title {
        font-size: 28px;
        margin-bottom: 12px;
    }

    #category .leben-category-cover {
        height: 180px;
    }

}


/* LeBen Models — catégorie : titre masqué, grille 1 / 2 / 3 / 4. */
body#category .leben-category-title,
body#category #category-description > h1,
body#category .block-category > h1 {
  display: none;
}

/* Mobile : un produit par ligne. */
body#category #js-product-list .products {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 24px;
  width: 100%;
  margin: 0;
  padding: 0;
  align-items: stretch;
}

/* Neutraliser les pseudo-éléments clearfix des anciennes lignes Bootstrap. */
body#category #js-product-list .products::before,
body#category #js-product-list .products::after {
  content: none;
}

/* Neutraliser les largeurs et espacements Bootstrap des colonnes. */
body#category #js-product-list .products > .js-product,
body#category #js-product-list .products > .product-miniature {
  float: none;
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body#category #js-product-list .product-miniature {
  width: 100%;
  min-width: 0;
  margin: 0;
  height: 100%;
}

body#category #js-product-list .thumbnail-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: none;
  height: 100%;
  margin: 0;
}

body#category #js-product-list .thumbnail-top,
body#category #js-product-list .product-description,
body#category #js-product-list .highlighted-informations {
  width: 100%;
}

body#category #js-product-list .product-description {
  position: relative;
  height: auto;
  flex: 1;
}

body#category #js-product-list .product-thumbnail {
  display: block;
  width: 100%;
  height: auto;
}

body#category #js-product-list .product-thumbnail img {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  margin: 0;
}

/* Petit écran / téléphone en paysage : deux produits. */
@media (min-width: 576px) {
  body#category #js-product-list .products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/* Tablette : trois produits. */
@media (min-width: 768px) {
  body#category #js-product-list .products {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

/* Desktop : quatre produits. */
@media (min-width: 1200px) {
  body#category #js-product-list .products {
    grid-template-columns: repeat(4, minmax(0, 1fr));
  }
}




/* Cartes produit de même hauteur */
body#category #js-product-list .products {
    grid-auto-rows: 1fr;
}

/* Zone titre + prix, conservée même sans prix */
body#category #js-product-list .product-description {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;

    flex: 1;
    height: auto;
    min-height: 70px!important;
    padding: 7px 14px;
    box-sizing: border-box;
}

/* Réduire l’espace entre le titre et le prix */
body#category #js-product-list .product-title {
    margin: 0 0 4px!important;
    padding: 0!important;
    line-height: 1.15!important;
    overflow-wrap: anywhere;
}

body#category #js-product-list .product-price-and-shipping {
    margin: 0!important;
    padding: 0!important;
    line-height: 1.25!important;
}


/* Produits avec prix : disposition actuelle */
body#category #js-product-list .product-description {
    justify-content: flex-start;
}

/* Produits sans prix : titre centré verticalement */
body#category #js-product-list .product-description:not(:has(.product-price-and-shipping)) {
    justify-content: center;
}

body#category #js-product-list .product-description:not(:has(.product-price-and-shipping)) .product-title {
    margin-bottom: 0;
}


/* Below 992px: full-width slider, then two cards side by side. */
@media (max-width: 991.98px) {
  body#index .leben-home-hero {
    grid-template-columns: minmax(0, 1fr);
    gap: 16px;
  }
  body#index .leben-home-hero__slider {
    width: 100%;
    max-width: 100%;
    margin: 0;
    float: none;
    left: auto;
    right: auto;
    transform: none;
  }
  body#index .leben-home-hero__slider #carousel,
  body#index .leben-home-hero__slider .homeslider-container {
    left: 0;
    right: 0;
    width: 100%;
    max-width: 100%;
    max-height: none;
    margin: 0;
    transform: none;
  }
  body#index .leben-home-hero__aside .leben-slider-blocks {
    position: static;
    height: auto;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    grid-template-rows: none;
    gap: 16px;
  }
  body#index .leben-home-hero__aside .leben-slider-block {
    width: 100%;
    aspect-ratio: 381 / 219;
  }
}

/* Below 576px: full-width cards stacked beneath the slider. */
@media (max-width: 575.98px) {
  body#index .leben-home-hero__aside .leben-slider-blocks {
    grid-template-columns: minmax(0, 1fr);
  }
}


/* LeBen Models — cartes Produits populaires sur l’accueil. */
body#index .featured-products .products {
  align-items: stretch;
}

body#index .featured-products .products > .js-product {
  display: flex;
  min-width: 0;
}

body#index .featured-products .product-miniature {
  display: flex;
  flex-direction: column;
  width: 100%;
  margin-bottom: 0;
}

body#index .featured-products .thumbnail-container {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  flex: 1;
}

body#index .featured-products .product-description {
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  width: 100%;
  height: auto;
  min-height: 70px;
  padding: 7px 14px;
  flex: 1;
  box-sizing: border-box;
}

body#index .featured-products .product-title {
  margin: 0 0 4px;
  padding: 0;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

body#index .featured-products .product-price-and-shipping {
  margin: 0;
  padding: 0;
  line-height: 1.25;
}

body#index .featured-products .product-description:not(:has(.product-price-and-shipping)) {
  justify-content: center;
}

body#index .featured-products .product-description:not(:has(.product-price-and-shipping)) .product-title {
  margin-bottom: 0;
}

body#index .featured-products .product-thumbnail {
    display: block;
    width: 100%;
    margin: 0;
    padding: 0;
}

body#index .featured-products .product-thumbnail img {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
    margin: 0;
    transform: scale(1.025);
    transform-origin: center;
}

/* Léger zoom supplémentaire au survol */
body#index .featured-products .product-miniature:hover .product-thumbnail img {
    transform: scale(1.05);
}


#js-product-list-top, #js-product-list-top p, #js-product-list-top a, #js-product-list-top span {
    color:#0c0c0c;
}

/* Accueil : produits populaires */
body#index .featured-products .wishlist-button-add,

/* Catégories : liste des produits */
body#category #js-product-list .wishlist-button-add {
    display: none !important;
}


/***************/
/*PAGE PRODUIT*/

#bloc-info-produit {
    padding: 0;
}

.product-information {
    padding:15px;
}

.product-information h1 {
    font-size:32px;
}

body#product .current-price-value {
    white-space: nowrap;
    font-size: 28px;
}

body#product .current-price-value .leben-tax-label {
    display: inline;
    font: inherit;
    color: inherit;
    letter-spacing: inherit;
    margin-left: 0.25em;
}

/* Masquer les boutons des onglets */
body#product .tabs > .nav-tabs {
    display: none;
}

/* Afficher tous les contenus à la suite */
body#product .tabs > .tab-content > .tab-pane {
    display: block;
    opacity: 1;
    visibility: visible;
}

/* Séparer légèrement les deux contenus */
body#product .tabs > .tab-content > .tab-pane + .tab-pane {
    margin-top: 24px;
    padding-top: 24px;
    border-top: 1px solid #e5e5e5;
}

#bloc-info-produit .tabs
{
    padding: 0!important;
    box-shadow: 0 0 0 0;
}

/* ==========================================================
   FICHE PRODUIT
   Alignement du contenu avec le logo du header
   Desktop > 1200px
   ========================================================== */

@media (min-width: 1200px) {

    #product #content{
        max-width: 540px;
    }

}


/* ==========================================================
   MENU MOBILE PRESTASHOP
   Correction affichage < 768px
   ========================================================== */

@media (max-width: 767px) {

    /* Conteneur général du menu mobile */
    #mobile_top_menu_wrapper {
        width: 100%;
        margin: 0;
        padding: 0;
        background: #ffffff;
    }


    /* Suppression du comportement FLEX du menu desktop */
    #mobile_top_menu_wrapper .top-menu {
        display: block !important;

        width: 100%;
        margin: 0;
        padding: 0;

        background: #ffffff;
    }


    /* Chaque entrée prend toute la largeur */
    #mobile_top_menu_wrapper .top-menu > li {
        display: block !important;

        width: 100%;
        margin: 0 !important;
        padding: 0 !important;

        border-bottom: 1px solid #e5e5e5;
    }


    /* Liens principaux */
    #mobile_top_menu_wrapper .top-menu > li > a,
    #mobile_top_menu_wrapper .top-menu a[data-depth="0"] {
        position: relative;

        display: block !important;

        width: 100%;

        margin: 0 !important;
        padding: 16px 20px !important;

        color: #252525 !important;
        background: #ffffff !important;

        font-family: Impact, Haettenschweiler, "Arial Narrow Bold", sans-serif;
        font-size: 20px !important;
        font-weight: 400;
        line-height: 1.2 !important;

        letter-spacing: 0.03em;

        text-align: left;
        text-transform: uppercase;

        white-space: normal;
    }


    /* Suppression du trait hover du menu desktop */
    #mobile_top_menu_wrapper .top-menu a[data-depth="0"]::after {
        display: none !important;
        content: none !important;
    }


    /* Hover / clic */
    #mobile_top_menu_wrapper .top-menu > li > a:hover,
    #mobile_top_menu_wrapper .top-menu a[data-depth="0"]:hover {
        color: #000000 !important;
        background: #f3f3f3 !important;
    }


    /* ======================================================
       LANGUE + CONTACT
       ====================================================== */

    #mobile_top_menu_wrapper .js-top-menu-bottom {
        width: 100%;

        padding: 18px 20px 22px;

        background: #ffffff;
    }


    /* Sélecteur de langue */
    #mobile_top_menu_wrapper #_mobile_language_selector {
        margin-bottom: 18px;
    }

    #mobile_top_menu_wrapper .language-selector-wrapper {
        display: flex;
        align-items: center;

        width: 100%;
    }

    #mobile_top_menu_wrapper #language-selector-label {
        margin-right: 8px;

        color: #777777;

        font-size: 16px;
        line-height: 1.4;
    }

    #mobile_top_menu_wrapper .language-selector {
        flex: 1;
    }

    #mobile_top_menu_wrapper .language-selector select {
        width: auto;

        margin: 0;
        padding: 0;

        color: #252525;
        background: transparent;
        border: 0;

        font-size: 16px;
    }


    /* Contact */
    #mobile_top_menu_wrapper #_mobile_contact_link {
        margin: 0;
        padding: 0;
    }

    #mobile_top_menu_wrapper #contact-link {
        margin: 0;
        padding: 0;
    }

    #mobile_top_menu_wrapper #contact-link a {
        display: block;

        padding: 8px 0;

        color: #777777;

        font-size: 16px;
        line-height: 1.4;
    }

}

/* ==========================================================
   FOND MOBILE
   Gradient sur toute la hauteur réelle de la page
   ========================================================== */

@media (max-width: 767px) {

    html {
        min-height: 100%;
        background: #ededed;
    }

    body {
        min-height: 100vh;

        background: linear-gradient(
            180deg,
            #252525 0%,
            #3a3a3a 18%,
            #555555 38%,
            #808080 58%,
            #b8b8b8 78%,
            #ededed 100%
        ) !important;

        background-repeat: no-repeat !important;
        background-size: 100% 100% !important;
        background-attachment: scroll !important;
    }

    #wrapper,
    #content-wrapper,
    #main,
    #content,
    .page-home,
    .featured-products,
    .products {
        background: transparent !important;
    }

    #product #content {
        max-width: 100%;
    }
    .product-imggalery{
        padding:0 0 15px 0!important;
    }

}

