/* =====================================================================
   Razor King - Habillage premium des pages de connexion (login.php / login2.php)
   Chargé UNIQUEMENT par ces 2 pages : aucun impact sur le reste de la plateforme.
   Palette navy plateforme : #0369A1 (accent) / #025687 (hover).
   ===================================================================== */

:root {
    --rk-navy: #0369A1;
    --rk-navy-dark: #025687;
    --rk-ink: #0f2b3d;
    --rk-muted: #7b8a97;
    --rk-border: #dbe6ee;
    --rk-soft: #f4f8fb;
}

/* --- Fond : image existante + voile navy premium --- */
body.bg-login {
    position: relative;
    min-height: 100vh;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}
body.bg-login::before {
    content: "";
    position: fixed;
    inset: 0;
    background: linear-gradient(rgba(2, 63, 97, .55), rgba(2, 63, 97, .78));
    z-index: 0;
    pointer-events: none;
}
body.bg-login .wrapper {
    position: relative;
    z-index: 1;
}
.section-authentication-signin {
    min-height: 100vh;
}

/* --- Carte unique (plus de double bordure) --- */
.rk-login-card {
    background: #fff;
    border: none !important;
    border-radius: 16px;
    box-shadow: 0 10px 30px rgba(2, 63, 97, .15);
    padding: 2.25rem 2rem;
}

/* --- En-tête logo + titres --- */
.rk-login-logo {
    width: 58px;
    height: auto;
    margin-bottom: .65rem;
}
.rk-login-title {
    font-weight: 700;
    color: var(--rk-ink);
    letter-spacing: .5px;
    margin: 0;
}
.rk-login-subtitle {
    color: var(--rk-muted);
    font-size: .9rem;
    margin: .2rem 0 0;
}

/* --- Champs modernes --- */
.rk-login-card .form-label {
    font-weight: 600;
    color: #33475b;
    font-size: .85rem;
}
.rk-login-card .input-group-text {
    background: var(--rk-soft);
    border-color: var(--rk-border);
    color: var(--rk-navy);
}
.rk-login-card .form-control {
    border-color: var(--rk-border);
    font-size: 16px; /* évite le zoom iOS */
    padding: .6rem .85rem;
}
.rk-login-card .form-control::placeholder {
    color: #aab6c0;
}
.rk-login-card .form-control:focus {
    border-color: var(--rk-navy);
    box-shadow: none;
}
/* halo navy sur tout le groupe quand un champ est focus */
.rk-login-card .input-group:focus-within {
    border-radius: .375rem;
    box-shadow: 0 0 0 .2rem rgba(3, 105, 161, .15);
}
.rk-login-card .input-group:focus-within .input-group-text,
.rk-login-card .input-group:focus-within .form-control {
    border-color: var(--rk-navy);
}

/* --- Bouton navy pleine largeur --- */
.rk-btn-navy {
    background: var(--rk-navy);
    border: none;
    color: #fff;
    font-weight: 600;
    border-radius: 10px;
    padding: .7rem 1rem;
}
.rk-btn-navy:hover,
.rk-btn-navy:focus {
    background: var(--rk-navy-dark);
    color: #fff;
    box-shadow: 0 4px 14px rgba(2, 63, 97, .25);
}
.rk-btn-navy:disabled {
    background: var(--rk-navy);
    color: #fff;
    opacity: .7;
}

/* --- Bouton secondaire (bascule admin/client) --- */
.rk-btn-outline {
    background: #fff;
    border: 1px solid var(--rk-border);
    color: var(--rk-navy);
    font-weight: 600;
    border-radius: 10px;
    padding: .6rem 1rem;
}
.rk-btn-outline:hover,
.rk-btn-outline:focus {
    background: var(--rk-soft);
    color: var(--rk-navy-dark);
    border-color: var(--rk-navy);
}

/* --- Case "se souvenir" + séparateur --- */
.rk-login-card .form-check-input:checked {
    background-color: var(--rk-navy);
    border-color: var(--rk-navy);
}
.rk-login-card .form-check-input:focus {
    border-color: var(--rk-navy);
    box-shadow: 0 0 0 .2rem rgba(3, 105, 161, .15);
}
.login-separater span {
    color: #9aa8b5;
    font-size: .78rem;
    letter-spacing: 1px;
    background: #fff;
}

/* --- Responsive mobile --- */
@media (max-width: 575.98px) {
    .rk-login-card {
        padding: 1.6rem 1.25rem;
        border-radius: 14px;
    }
    body.bg-login .section-authentication-signin {
        padding: 1rem;
    }
}