/* =========================================================================
   Pages d'authentification (connexion + A2F)
   Mêmes couleurs que le back-office EasyAdmin : indigo #4f46e5 + bleu nuit.
   ========================================================================= */

/* Couleur principale Bootstrap passée en indigo sur les pages d'auth */
.auth-page {
    --bs-primary: #4f46e5;
    --bs-primary-rgb: 79, 70, 229;
    --bs-link-color: #4f46e5;
    --bs-link-color-rgb: 79, 70, 229;
    --bs-link-hover-color: #4338ca;
    --bs-link-hover-color-rgb: 67, 56, 202;
}

.auth-page .btn-primary {
    --bs-btn-bg: #4f46e5;
    --bs-btn-border-color: #4f46e5;
    --bs-btn-hover-bg: #4338ca;
    --bs-btn-hover-border-color: #4338ca;
    --bs-btn-active-bg: #3730a3;
    --bs-btn-active-border-color: #3730a3;
    --bs-btn-disabled-bg: #4f46e5;
    --bs-btn-disabled-border-color: #4f46e5;
    --bs-btn-focus-shadow-rgb: 79, 70, 229;
    font-weight: 500;
}

.auth-page .btn-link {
    --bs-btn-color: #4f46e5;
    --bs-btn-hover-color: #4338ca;
    --bs-btn-active-color: #3730a3;
}

.auth-page .form-control:focus,
.auth-page .form-check-input:focus {
    border-color: #a5b4fc;
    box-shadow: 0 0 0 0.25rem rgba(79, 70, 229, 0.15);
}

.auth-page .form-check-input:checked {
    background-color: #4f46e5;
    border-color: #4f46e5;
}

.auth-page .form-control-lg {
    font-size: 1rem;
}

/* Panneau de marque bleu nuit avec un léger halo indigo */
.auth-brand {
    background:
        radial-gradient(circle at 15% 85%, rgba(79, 70, 229, 0.35), transparent 50%),
        #0f172a;
}

.auth-brand-muted {
    color: #94a3b8;
}

.auth-brand-icon {
    color: #818cf8;
    font-size: 1.25rem;
}

/* Carte du formulaire */
.auth-card {
    max-width: 420px;
    border-radius: 0.75rem;
}

/* Pastille d'icône en haut du formulaire */
.auth-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 0.625rem;
    background: #eef2ff;
    color: #4f46e5;
}

/* Champs floating avec icône Font Awesome à gauche */
.auth-page .input-group-text {
    width: 3rem;
    justify-content: center;
    background-color: #fff;
    color: #94a3b8;
    border-right: 0;
}

.auth-page .input-group .form-floating > .form-control {
    border-left: 0;
}

/* Bordure et halo indigo sur tout le groupe (icône + champ) au focus */
.auth-page .input-group:focus-within {
    border-radius: var(--bs-border-radius);
    box-shadow: 0 0 0 0.25rem rgba(79, 70, 229, 0.15);
}

.auth-page .input-group:focus-within .input-group-text,
.auth-page .input-group:focus-within .form-control {
    border-color: #a5b4fc;
    box-shadow: none;
}

.auth-page .input-group:focus-within .input-group-text {
    color: #4f46e5;
}

/* Champ du code A2F : chiffres espacés */
.auth-code-input {
    font-family: SFMono-Regular, Menlo, Consolas, monospace;
    font-size: 1.25rem;
    letter-spacing: 0.5em;
}
