/*------------------------------------------*/
/*  BACKGROUND COLORS
/*------------------------------------------*/

.bg--black { background-color: #212223; }
.bg--white { background-color: #fff; }
.bg--blush { background-color: #faf3f7; }
.bg--ivory { background-color: #f8f5f2; }
.bg--magenta { background-color: #b25996; }
.bg--peanut { background-color: #c1baac; }
.bg--poudre { background-color: #f9efed; }
.bg--red { background-color: #e55d42; }
.bg--salmon { background-color: rgba(247, 221, 217, .68); }
.bg--smoke { background-color: #f2f2f0; }
.bg--stone { background-color: #f5f5f5; }

/* — Nouveaux backgrounds — */
.bg--primary         { background-color: #BF5A36; }
.bg--secondary       { background-color: #A65851; }
.bg--saumon          { background-color: #D9805F; } /* Saumon doux */
.bg--peche           { background-color: #FFCAB6; } /* Pêche pastel */
.bg--rose-poudre     { background-color: #FCE9D8; } /* Rose poudré */
.bg--noir-pur        { background-color: #000000; } /* Noir profond */
.bg--brun-noir       { background-color: #280906; } /* Brun noir */
.bg--chocolat        { background-color: #592D1D; } /* Chocolat foncé */
.bg--sable-doux      { background-color: #E4C9B2; } /* Sable doux */
.bg--ivoire-delicat  { background-color: #F4EDE7; } /* Ivoire délicat */


body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    background-color: #f4f4f9;
}

.landing-page {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    text-align: center;
    background-color: #ffffff;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
    padding: 20px;
}

.landing-page h1 {
    font-size: 2.5em;
    color: #333;
    margin-bottom: 10px;
}

.landing-page p {
    font-size: 1.2em;
    color: #666;
}


.customers_login .container {
    width: 100% !important;
}

.customers_login .navbar.navbar-default.header,  .customers_login .footer{
    display: none;
}

/* wrapper full-screen */
.clients-login-wrapper {
    display: flex;
    width: 100vw;
    height: 100vh;
    margin: 0;
}

.clients-login-logo {
    flex: 1 1 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* deux colonnes à 50/50 */
.login-sidebar,
.login-main {
    flex: 1 1 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

/* SIDE BAR */
.login-sidebar .sidebar-content {
    max-width: 300px;
    width: 100%;
}

/* logos : on affiche l’un ou l’autre selon fond */
#logo-black { display: none; }
#logo-white img     { max-width: 140px; }

.login-sidebar {
    position: relative;
}
.login-sidebar.light-bg #logo-black { display: block; }
.login-sidebar.dark-bg  #logo-white { display: block; }

/* titre & texte */
.login-sidebar h2,
.login-sidebar p {
    color: #fff;
}

/* ANIMATION PATH + DOT */
.login-animation {
    position: relative;
    width: 200px;
    height: 200px;
    margin: 0 auto;
}
.login-path-svg {
    width: 100%;
    height: 100%;
}
.login-path-svg path {
    stroke-dasharray: 500;
    stroke-dashoffset: 500;
    animation: drawPath 4s ease-in-out infinite alternate;
}
@keyframes drawPath {
    to { stroke-dashoffset: 0; }
}
/* point animé sur la courbe */
.login-animation .dot {
    width: 12px;
    height: 12px;
    background: #fff;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    animation: followPath 4s ease-in-out infinite alternate;
}
@keyframes followPath {
    0%   { offset-distance: 0%; }
    100% { offset-distance: 100%; }
}
/* Enable offset-path if pris en charge */
.login-animation .dot {
    offset-path: path("M10,100 C40,10 160,10 190,100 S160,190 10,100");
    offset-rotate: 0deg;
}

/* FORMULAIRE */
.login-main {
    background-color: #f9f9f9;
}
.login-form-container {
    width: 100%;
    max-width: 400px;
    padding: 1rem;
}

/* responsive mobile : cache sidebar */
@media (max-width: 767px) {
    .clients-login-wrapper {
        flex-direction: column;
        height: auto;
    }
    .login-sidebar { display: none; }
    .login-main {
        flex: 1 1 100%;
        width: 100%;
    }
}