/* @changelog 2023-03-15 [EVOL] (Nicolas) Fichier CSS pour surcharger les fichiers .scss pour ajouter les évolutions LUMIS */

/* -------------
    SOMMAIRE
------------- */

/* @AUTHOR : Nicolas BOUDOT */

/*
  01 - ACCUEIL
  02 - PRODUITS
        Listing
        Détail
*/



/* -------------
  01 - ACCUEIL
------------- */

.products .productgamme-content {
    position: relative;
}

    .products .productgamme-content .productgamme-picture::before {
        padding-top: 80%;
    }

.products .productgamme.productgamme--with-icon .productgamme-hover {
    bottom: 74px;
}

.products .productgamme-content .productgamme-title {
    position: absolute;
    bottom: 0;
    width: 100%;
}

    .products .productgamme:not(.productgamme--with-icon) h3 {
        padding: 10px;
    }
    


/* -----------------
  02 - PRODUITS     
        Listing     
----------------- */

.product-teaser {
    overflow: visible;
}

.product-teaser .product-teaser__lumis {
    position: absolute;
    top: 20px;
    left: 20px;
    max-width: 80px;
    transform: translate(-50%, -50%);
    z-index: 2;
}
    


/* -----------------
  02 - PRODUITS     
        Détail      
----------------- */

#product-single .informations .img .product_lumis {
    display: block;
    position: absolute;
    bottom: 0;
    right: 0;
    max-width: 25%;
}


.mega-menu .contents .content.is-color-yellow .btn.is-alt {
    background: #E1C41F;
    color: #fff;
}
.mega-menu .contents .content.is-color-yellow .left .title .picto {
    background: #E1C41F;
}

.mega-menu .contents .content.is-color-yellow .left .title,
.mega-menu .contents .content.is-color-yellow a,
.mega-menu .contents .content.is-color-yellow b,
.mega-menu .contents .content.is-color-yellow h2,
.mega-menu .contents .content.is-color-yellow strong,
.mega-menu .contents .content.is-color-yellow ul {
    color: #E1C41F;
}

.mega-menu .tabs li.is-color-yellow:before,
.no-touchevents .mega-menu .tabs li.is-color-yellow:hover {
    background-color: #E1C41F;
}
.mega-menu .tabs li.is-color-yellow:before,
.no-touchevents .mega-menu .tabs li.is-color-yellow:hover {
    background-color: #E1C41F;
}
#products-archive.is-color-yellow .advice>.title,
#products-archive.is-color-yellow>.header .picto {
    background-color: #E1C41F;
}
#products-archive.is-color-yellow .advice>.container .title,
#products-archive.is-color-yellow .advice>.container a,
#products-archive.is-color-yellow .filter .title,
#products-archive.is-color-yellow .filter h4,
#products-archive.is-color-yellow .product-teaser,
#products-archive.is-color-yellow>.header .title {
    color: #E1C41F;
}

#product-single.is-color-yellow .category-header .title,
#product-single.is-color-yellow .productinfospro h2,
#product-single.is-color-yellow .reassurance span:after,
#product-single.is-color-yellow>.header,
#product-single.is-color-yellow>.header .name,
#product-single.is-color-yellow>.header .subtitle,
#product-single.is-color-yellow>.header .title {
    color: #E1C41F;
}

#product-single.is-color-yellow .category-header .picto,
#product-single.is-color-yellow .reassurance span:before,
#product-single.is-color-yellow .tabs .tab .item.is-active {
    background-color: #E1C41F;
}