/* =========================================================
   PLAISIRS MARKET - HEADER PUBLIC COMMUN
   ========================================================= */

.public-header{
    width:100%;
    min-height:88px;

    background:#fff;

    border-bottom:1px solid #e1e3e6;

    position:relative;
    z-index:100;
}

.public-header-inner{
    width:100%;
    max-width:1680px;

    min-height:88px;

    margin:0 auto;

    padding:10px 24px;

    display:grid;

    grid-template-columns:
        auto
        minmax(300px,1fr)
        auto
        auto;

    gap:28px;

    align-items:center;
}


/* BRAND */

.public-brand{
    display:flex;
    align-items:center;

    gap:12px;

    color:#202225;

    text-decoration:none;
}

.public-brand img{
    width:60px;
    height:60px;

    object-fit:contain;

    border-radius:14px;
}

.public-brand-text{
    display:flex;
    flex-direction:column;
}

.public-brand-text strong{
    color:#202225;

    font-size:18px;

    font-weight:900;

    line-height:1.1;
}

.public-brand-text span{
    margin-top:3px;

    color:#8a8e93;

    font-size:9px;

    font-weight:800;

    letter-spacing:1px;

    text-transform:uppercase;
}


/* RECHERCHE */

.public-header-search{
    width:100%;

    min-width:0;

    display:grid;

    grid-template-columns:1fr auto;

    gap:8px;
}

.public-header-search input{
    width:100%;

    height:50px;

    padding:0 18px;

    background:#f5f6f7;

    color:#202225;

    border:1px solid #dfe2e5;

    border-radius:12px;

    font-family:inherit;

    font-size:13px;

    outline:none;
}

.public-header-search input:focus{
    background:#fff;

    border-color:#202225;

    box-shadow:
        0 0 0 3px rgba(32,34,37,.06);
}

.public-header-search button{
    height:44px;

    min-width:120px;

    align-self:center;

    padding:0 18px;

    background:#202225;

    color:#fff;

    border:0;

    border-radius:10px;

    font-family:inherit;

    font-size:11px;

    font-weight:900;

    cursor:pointer;

    transition:.18s ease;
}

.public-header-search button:hover{
    background:#e91683;
}


/* LANGUE */

.public-header-language{
    min-height:48px;

    padding:0 14px;

    display:flex;

    align-items:center;

    gap:8px;

    background:#fff;

    border:1px solid #dfe2e5;

    border-radius:12px;
}

.public-language-icon{
    font-size:15px;
}

.public-header-language select{
    min-width:140px;

    background:transparent;

    border:0;

    outline:none;

    color:#202225;

    font-family:inherit;

    font-size:11px;

    font-weight:850;

    cursor:pointer;
}


/* ACTIONS */

.public-header-actions{
    display:flex;

    align-items:center;

    gap:8px;
}

.public-btn{
    min-height:48px;

    padding:0 18px;

    display:inline-flex;

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

    border-radius:10px;

    text-decoration:none;

    font-size:10px;

    font-weight:900;

    white-space:nowrap;

    transition:.18s ease;
}

.public-btn-light{
    background:#fff;

    color:#202225;

    border:1px solid #dfe2e5;
}

.public-btn-light:hover{
    border-color:#202225;
}

.public-btn-dark{
    background:#202225;

    color:#fff;

    border:1px solid #202225;
}

.public-btn-dark:hover{
    background:#e91683;

    border-color:#e91683;
}


/* MOBILE MENU */

.public-mobile-menu{
    display:none;

    width:44px;
    height:44px;

    background:#202225;

    color:#fff;

    border:0;

    border-radius:10px;

    font-size:20px;

    cursor:pointer;
}


/* TABLETTE */

@media(max-width:1150px){

    .public-header-inner{
        grid-template-columns:
            auto
            minmax(250px,1fr)
            auto;

        gap:14px;
    }

    .public-header-language{
        display:none;
    }

}


/* PETITE TABLETTE */

@media(max-width:850px){

    .public-header-inner{
        grid-template-columns:auto 1fr auto;

        min-height:auto;

        padding:10px 14px;
    }

    .public-header-search{
        grid-column:1 / -1;

        grid-row:2;

        order:4;
    }

    .public-header-actions{
        display:none;
    }

    .public-mobile-menu{
        display:flex;

        align-items:center;
        justify-content:center;
    }

}


/* GSM */

@media(max-width:600px){

    .public-header-inner{
        gap:10px;
    }

    .public-brand img{
        width:48px;
        height:48px;
    }

    .public-brand-text strong{
        font-size:14px;
    }

    .public-brand-text span{
        font-size:8px;
    }

    .public-header-search{
        grid-template-columns:1fr;
    }

    .public-header-search input{
        height:46px;
    }

    .public-header-search button{
        width:100%;

        height:44px;
    }

}



/* =========================================================
   ALIGNEMENT EXACT STYLE INDEX
   ========================================================= */

.public-header{
    min-height:90px !important;
    background:#fff !important;
}

.public-header-inner{
    max-width:1680px !important;
    min-height:90px !important;

    margin:0 auto !important;
    padding:10px 26px !important;

    display:grid !important;

    grid-template-columns:
        auto
        minmax(420px,1fr)
        auto
        auto !important;

    gap:30px !important;

    align-items:center !important;
}


/* LOGO */

.public-brand > div{
    display:flex !important;
    flex-direction:column !important;
}

.public-brand img{
    width:60px !important;
    height:60px !important;
}

.public-brand strong{
    font-size:18px !important;
    font-weight:900 !important;
}

.public-brand span{
    margin-top:3px !important;

    color:#8b8e93 !important;

    font-size:9px !important;
    font-weight:800 !important;

    text-transform:uppercase !important;
    letter-spacing:1px !important;
}


/* MOTEUR COMME INDEX */

.public-header-search{
    position:relative !important;

    width:100% !important;

    display:block !important;
}

.public-header-search input{
    width:100% !important;
    height:50px !important;

    padding:0 145px 0 18px !important;

    background:#f5f5f6 !important;

    border:1px solid #d8dade !important;
    border-radius:12px !important;

    font-size:13px !important;
}

.public-header-search button{
    position:absolute !important;

    top:5px !important;
    right:5px !important;

    height:40px !important;
    min-width:116px !important;

    background:#202225 !important;

    border-radius:9px !important;
}


/* LANGUE */

.public-language{
    min-width:195px !important;
    height:48px !important;

    padding:0 14px !important;

    display:flex !important;
    align-items:center !important;

    gap:8px !important;

    background:#fff !important;

    border:1px solid #dfe1e4 !important;
    border-radius:12px !important;
}

.public-language select{
    flex:1 !important;

    background:transparent !important;

    border:0 !important;
    outline:0 !important;

    color:#202225 !important;

    font-size:11px !important;
    font-weight:850 !important;
}


/* ACTIONS */

.public-header-actions{
    display:flex !important;

    align-items:center !important;

    gap:10px !important;
}

.public-btn{
    min-height:48px !important;

    padding:0 18px !important;

    border-radius:10px !important;

    font-size:10px !important;
    font-weight:900 !important;
}


/* TABLETTE */

@media(max-width:1150px){

    .public-header-inner{
        grid-template-columns:
            auto minmax(280px,1fr) auto !important;

        gap:14px !important;
    }

    .public-language{
        display:none !important;
    }

}


/* GSM */

@media(max-width:850px){

    .public-header-inner{
        grid-template-columns:auto 1fr auto !important;
    }

    .public-header-actions{
        display:none !important;
    }

    .public-mobile-menu{
        display:flex !important;
        align-items:center !important;
        justify-content:center !important;
    }

    .public-header-search{
        grid-column:1 / -1 !important;
    }

}

@media(max-width:600px){

    .public-header-search input{
        padding-right:15px !important;
    }

    .public-header-search button{
        position:relative !important;

        top:auto !important;
        right:auto !important;

        width:100% !important;

        margin-top:7px !important;
    }

}