/*VARIABLES*/

:root {
    /*--Colors--*/
	--express_primary: #c39121;
    --express_secondary: #f4f5f7;
    --express_neutral: #141414;
    --express_body: #1d1d1b;
    --express_items: #1d1d1b;
    --express_background: #fff;
    --header-icons-brigtness: brightness(1); /* 1=blanc 0=noir*/
    --img-radius: 0;
    /**/
    
    /*--Fonts--*/
    
    --font_def: 'Barlow', sans-serif;
	--font_title: 'Montserrat', sans-serif;
    --font_dates: 'Barlow', sans-serif
    
    /**/
}

/*//VARIABLES//*/

/*-------------------*/

/*IMAGES*/

    /*BG*/

    /* .back-right{
        background-image: url('../images/droite.jpg');
    }

    .back-left{
        background-image: url('../images/gauche.jpg');
    } */

    /**/

    /*Header*/

    @media (min-width: 981px) {
        header {
            position: sticky;
            top: 0;
            left: 0;
            z-index: 999;
            width: 100%;
            background-color: var(--express_background);
            transition: .2s ease-in-out;
        }
    }

    header {
        .header-search form i{
            background-image: url('../images/recherche.svg')
        }
        .reseau-sociaux a {
            color: var(--express_body);
        }
        .navbar-user > li:hover, .navbar-user > li:hover {
            background: var(--express_body) !important;
            color: var(--express_background);
            .lcart > span {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 20px;
                aspect-ratio: 1;
                background-color: var(--express_primary);
            }
            .nav-bar-user-libelle {
                color: var(--express_secondary)
            }
        }
        .second .logo a img {
            width: 25em;
        }
    } 
    .navbar.agencement.horizontal li {
        background-color: var(--express_body);
        transition: .2s ease-in-out;
        .libelle {
            transition: .2s ease-in-out;
            color: var(--express_background);
        }
        &:hover {
            background-color: var(--express_primary) !important;
        }
    }

    /**/

    /*Fiche Produit*/

    .boxArticle div.cadencier a, .article .droite div.cadencier a{
        background-image: url('../images/liste-envie.svg');
    }

    /**/

    /*Champs*/

    .choix-enlevement-express .column-right .choix-date .r_conso, .choix-enlevement-express .column-right .choix-date .r_jour, .choix-enlevement-express .column-right .choix-date .r_heure, .choix-points-vente-details .date-retrait select, .express.choix-points-vente-details .heure-retrait, .choix-livraison-traiteur .choix-mag .choose-delivery .date-retrait select, .choix-livraison-traiteur .choix-mag .choose-delivery .heure-retrait select{
        background-image: url('../images/select-button.svg')
    }

    /**/

    /*Formulaires*/

    input[type="radio"]:checked + label{
        background-image: url('../images/radio-checked.svg')
    }

    input[type="checkbox"]:checked + label{
        background-image: url('../images/checkbox-checked.svg')
    }

    /**/

    /*Point de vente*/
    .choix-points-vente-details .row > .column-middle .column-right > .nom, .points-vente-details .row > .column-middle .column-right > span, .etape4 .row > .column-middle .column-right > .nom, .points-vente-details .modalLink > .column-right > .nom, .points-vente-details .row > .column-middle .column-right > .nom, .points-vente-details .modalLink > .column-right > .ville, .points-vente-details .row > .column-middle .column-right > .ville,
	.etape4 .row > .column-middle .column-right > .ville {
        background-image: url("../images/points-vente/logo.png");
    }

    .lien-fdf{
        display: none !important;
    }

    header .map.ligne{
        display: none !important;
        width: 0;
        opacity: 0;
        height: 0;
        position: absolute;
    }

/*//IMAGES//*/


/*-------------------*/

/*SURCHARGE*/

body.index > .main-content::before {
    content: "";
    display: block;
    width: 100%;
    min-height: 60vh;
    background: url('../images/background.jpg') no-repeat center center;
    background-size: cover;
    background-attachment: fixed;
}

@media (max-width: 981px) {
    .grid .navigationBar .blocTitle > span {
        font-size: 2em;
        letter-spacing: 1.5px;
    }
}

.grid .navigationBar .blocTitle > span {
    text-transform: uppercase;
    letter-spacing: 3px;
}

body.choix-livraison-traiteur {
    .choix-livraion .choose-delivery.row {
        > div[class*="column-"] {
            border-radius: 0;
            button > i {
                background-color: var(--express_primary);
            }
        }   
    } 
    .connexion-compte a.nouveau {
        width: fit-content;
        margin: 10px auto;
        text-decoration: underline !important;
        color: var(--express_body);
        transition: .1s ease-in-out;
        &:hover {
            color: var(--express_primary);
        }
    }
} 

.content > .row > .boxModule > ul.row, .content > .grid > .grid-content > .boxModule > ul.row {
    &::before, &::after {
        display: none;
    }
    display: flex;
    flex-direction: column;
    gap: 10vh;
    margin-top: 5%;
    > li.item {
        width: 100% !important;
        margin: 0;
    }
}

.agencement.horizontal {
    background-color: var(--express_background);
    box-shadow: 0px 0px 38px 0px #00000024 !important;
    li {
        background-color: initial !important;
        a .libelle {
            color: var(--express_body) !important;
        }
    }
}

header .navbar-user li ul.dropdown-menu.pull-right li a label {
    color: var(--express_body) !important;
}

header button.toggle-nav {
    top: 10px !important;
}

.grid-content {
    width: 100% !important;
    margin: 0 !important;
    float: initial !important;
    background-color: var(--express_background);
    ul.row {
        gap: 30px;
        justify-content: center;
        margin-top: 2.5%;
        li.item {
            flex: initial !important;
            width: 300px !important;
            margin: 0 !important;
            background-color: var(--express_secondary);
            .boxArticle {
                width: 100%;
                text-align: justify;
                .hrefImage {
                    height: initial;
                    aspect-ratio: 1;
                    img {
                        width: 100%;
                        height: 100%;
                        margin: 0;
                        object-fit: cover;
                    }
                } 
                .details {
                    padding: 10px;
                    > div .ttrPu {
                        display: block;
                        text-align: justify;
                    }
                    .short-desc  {
                        display: none;
                    }
                }
                .ajoutPanier {
                    padding: 0 10px 10px;
                }
            }
        }
    }
}

.boxArticle .in_cart .qte {
    color: var(--express_background);
}

.choix-livraison-traiteur .column-left .submit {
    display: flex;
    flex-direction: column;
}

.etape-panier ~ .action.row {
    display: flex;
    justify-content: end;
    align-items: center;
    flex-wrap: wrap;
    gap: 15px;
    a.login {
        margin-right: auto;
    }
}

.continue, .anonyme {
    background-color: initial !important;
    border-radius: 0;
}

.etape-expedition a, .etapes .etape-expedition .adresse-retrait .value {
    color: var(--express_body);
}

header .cart ul .commande a, .express .ui-dialog .ui-dialog-buttonpane > .ui-dialog-buttonset > button, div.acheter > a, a.anonyme span, a.continue span, .continue > a, .informations button, button.submit, a.cart, a.login, button.plan-situation, button.valider, button.floatleft {
    &::before {
        content: "";
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        border: solid 1px var(--express_background);
        opacity: 0;
        transition: .2s ease-in-out;
    }
    position: relative;
    padding: 15px 20px !important;
    font-size: 15px !important;
    letter-spacing: 1px;
    color: var(--express_body) !important;
    border-radius: 0 !important;
    box-shadow: 0px 0px 38px 0px #00000024 !important;
    text-transform: uppercase;
    background-color: var(--express_background) !important;
    transition: .2s ease-in-out;
    &:hover {
        &::before {
            top: 5px;
            left: 5px;
            width: calc(100% - 10px);
            height: calc(100% - 10px);
            opacity: 1;
        }
        background-color: var(--express_primary) !important;
        color: var(--express_background) !important;
    }
}

.etapes thead > tr:first-child {
    border-left: none;
}

.ui-dialog .ui-dialog-titlebar span {
    color: var(--express_body) !important;
}

.choix-points-vente-details .choix_libelle select, .choix-points-vente-details .heure-retrait select, .choix-points-vente-details .date-retrait select{
    width: 200px;
}

.item .boxRayon h3 label, .item .sousRayon h3 label{
    color: var(--express_primary) !important;
    font-family: var(--font_title) !important;
    font-weight: bold !important;
    font-size: 16px !important
}

.grid-article .bloc.row .item .short-desc{
    display: none;
}

.grid-article .bloc.row .item .lib {
    margin-top: 0;
    margin-bottom: 10px;
    font-size: 20px;
}

.fiche-produit .article .droite .reseau-sociaux{
    display: none;
}

.fiche-produit .article .droite .price{
    margin: 1em 0;
}

.module-cross-selling-article-associe .boxArticle .details{
    min-height: 0;
}

.grid.grid-article .grid-content .bloc.row .item .boxArticle{
    justify-content: flex-start;
}

.points-vente-details .column-right .adr-cp{
    background-image: none !important;
}

.boxModule h4{
    background: transparent;
}

.liste-cadencier.ui-dialog{
    background: var(--express_background);
}

.liste-cadencier.ui-dialog form {
    display: flex;
    flex-direction: column;
}

.liste-cadencier.ui-dialog form .selector{
    margin: 12px 0;
}

.liste-cadencier.ui-dialog span, .liste-cadencier.ui-dialog .msg .nom{
    color: var(--express_body) !important;
}

header .cadencier > ul{
    background: transparent;
}

.express header .cadencier ul li{
    padding: 10px 18px;
    filter: drop-shadow(1px 1px 2px rgba(0,0,0,0.5));
    border: none;
}

.express header .cadencier ul li a:hover, .express header .cadencier ul li:hover, .express header .cadencier ul li a, .express header .cadencier ul li{
    background: var(--express_background);
    color: var(--express_body);
}

.etape-panier .menu .libelle{
    display: inline-block;
}

.action.row .anonyme{
    float: right !important;
    margin-right: 1em;
}

.action.row .continue{
    opacity: .8;
}

.action.row .continue a:hover{
    opacity: 1;
    background: var(--express_neutral) !important;
}

.select-mag-proximite .ville{
    display: none;
}

.ui-dialog.points-vente-details .ui-dialog-titlebar-close{
    filter: drop-shadow(1px 1px 2px);
}

.nouveau-compte .date-mariage, .nouveau-compte .prenom-conjoint{
    display: none;

}

/*Menus*/

.niveau.liste.vignette li.item{
    margin-bottom: 20px;
}

.liste .row .item form, .multi_colonne .row .item form{
    border: none;
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.1);
}

.liste .row .item form:hover, .multi_colonne .row .item form:hover{
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.2);
}

.liste .row .item form img, .multi_colonne .row .item form img{
    border: none;
    border-radius: 20px;
}

.etape-menu a.passee .etape{
    background: var(--express_secondary);
}

.confirmation-menu .title, .menu .libelle, .table-choix .libelle, .etape-table .libelle .libelle, .client-profil, .ui-dialog .modalLink .module-haut{
    display: none;
}

.confirmation-menu .etape li{
    font-size: 1.5rem;
}

.confirmation-menu .etape li:before{
    content: "\2022";
    color: var(--express_primary);
    font-weight: bold;
    display: inline-block;
    width: 1em
}

.module-cross-selling-article-associe span{
    color: var(--express_primary);
}

.boxArticle .menu .etape a{
    display: none;
}

/**/

/*Footer*/

footer .main-content {
    width: 100%;
    padding: 2% !important;
    background: var(--express_neutral);
    .pageStatique {
        padding: 2%;
        border: solid 1px var(--express_background);
    }
    .footer-widgets {
        background-color: initial;
        img {
            filter: brightness(1);
        }
    }
}

footer .footer-widgets{
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 20px;
    background: var(--express_primary);
}

footer .footer-widgets .footer-column{
    gap: 10px;
}

/**/

/*Mobile*/

@media(max-width: 768px){
    .etapes .action.row{
        width: 70%;
        margin: auto;
        display: flex;
        flex-direction: column;
        justify-content: center;
        gap: 10px;
    }

    .etapes .action.row a{
        text-align: center;
        margin: 0;
    }

    .etapes .action.row .login{
        order: 1;
    }

    .etapes .action.row .anonyme{
        order: 2;
    }

    .etapes .action.row .continue{
        order: 3;
    }
}

/**/

/*//SURCHARGE//*/