/* =========================================================================
   CLARIO CASH — connexion, inscription, mot de passe oublie
   =========================================================================
   Complete les regles .auth-* de custom.css : bouton clair/sombre, logo
   adapte au theme et version sombre de TOUT ce qui s'affiche (le mode
   sombre de custom.css ne couvrait que le titre et les champs).
   Couleurs sombres = celles de la page d'accueil (fond #061812).
   ========================================================================= */

/* Logo : version couleur en clair, blanche en sombre */
.auth-header-logo .brand-logo img { max-height: 46px; width: auto; display: block; }
.auth-header-logo .brand-logo-dark { display: none; }
body.dark-mode .auth-header-logo .brand-logo-light { display: none; }
body.dark-mode .auth-header-logo .brand-logo-dark { display: block; }

/* Bouton clair / sombre, en haut a droite de la colonne du formulaire */
.auth-theme-toggle {
    position: fixed; top: 22px; z-index: 20;
    right: calc(50% + 22px);
    width: 44px; height: 44px; border-radius: 999px;
    display: grid; place-items: center; cursor: pointer;
    background: #ffffff; color: #0B5E34; font-size: 17px;
    border: 1.5px solid #e2e8f0;
    box-shadow: 0 8px 20px -12px rgba(11, 60, 35, .45);
    transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.auth-theme-toggle:hover { transform: translateY(-1px); border-color: #0E8C4F; }
.auth-theme-toggle:focus-visible { outline: 3px solid rgba(255, 107, 0, .45); outline-offset: 3px; }
@media (max-width: 991.98px) { .auth-theme-toggle { right: 18px; top: 18px; } }

/* Fleche du bouton principal (le SVG etait mal forme : seul le trait s'affichait) */
.btn-clario-submit .btn-arrow-icon svg { display: block; }

/* ------------------------------------------------------------ Sombre ---- */
body.dark-mode.auth-body-bg,
body.dark-mode .clario-auth-card,
body.dark-mode .clario-auth-wrapper {
    background:
        radial-gradient(800px 420px at 0% 0%, rgba(16, 185, 129, .10), transparent 60%),
        radial-gradient(600px 360px at 50% 100%, rgba(255, 107, 0, .06), transparent 60%),
        #061812 !important;
    color: #D6E4DC;
}
body.dark-mode .clario-auth-card { background: transparent !important; }

body.dark-mode .auth-theme-toggle {
    background: #0B221A; color: #FFB066; border-color: rgba(148, 196, 168, .22);
    box-shadow: 0 8px 20px -12px rgba(0, 0, 0, .8);
}
body.dark-mode .auth-theme-toggle:hover { border-color: #34D399; }

body.dark-mode .auth-heading { color: #E8F5EE; }
body.dark-mode .auth-subheading { color: #9DB3A7; }
body.dark-mode .auth-form-label { color: #D6E4DC; }

body.dark-mode .auth-input {
    background-color: #0B221A !important;
    border-color: rgba(148, 196, 168, .22) !important;
    color: #E8F5EE !important;
}
body.dark-mode .auth-input::placeholder { color: #6F8A7C !important; }
body.dark-mode .auth-input:focus {
    border-color: #34D399 !important;
    box-shadow: 0 0 0 4px rgba(52, 211, 153, .15) !important;
}
/* Saisie automatique du navigateur : sans cela, fond jaune/blanc en sombre */
body.dark-mode .auth-input:-webkit-autofill,
body.dark-mode .auth-input:-webkit-autofill:hover,
body.dark-mode .auth-input:-webkit-autofill:focus {
    -webkit-text-fill-color: #E8F5EE !important;
    -webkit-box-shadow: 0 0 0 1000px #0B221A inset !important;
    caret-color: #E8F5EE;
}

body.dark-mode .auth-input-icon,
body.dark-mode .auth-password-toggle { color: #7E978A; }
body.dark-mode .auth-password-toggle:hover { color: #34D399; }

body.dark-mode .auth-forgot-link { color: #34D399; }
body.dark-mode .auth-forgot-link:hover { color: #6EE7B7; }

/* Bouton principal : le vert fonce disparaissait sur le fond sombre */
body.dark-mode .btn-clario-submit {
    background-color: #0E8C4F !important;
    box-shadow: 0 10px 26px -12px rgba(14, 140, 79, .9);
}
body.dark-mode .btn-clario-submit:hover { background-color: #10A45D !important; }

body.dark-mode .auth-switch-text { color: #9DB3A7; }
body.dark-mode .auth-switch-link { color: #FF8A1F; }
body.dark-mode .auth-switch-link:hover { color: #FFB066; }
body.dark-mode .auth-copyright { color: #6F8A7C; }

body.dark-mode .auth-panel-card { box-shadow: 0 24px 50px -20px rgba(0, 0, 0, .8), 0 0 0 1px rgba(148, 196, 168, .12); }

/* Messages de validation (jquery-validate) lisibles dans les deux themes */
.auth-content-box label.error, .auth-content-box .error { color: #DC2626; font-size: .82rem; font-weight: 600; margin-top: .35rem; }
body.dark-mode .auth-content-box label.error, body.dark-mode .auth-content-box .error { color: #F87171; }

@media (prefers-reduced-motion: reduce) { .auth-theme-toggle { transition: none; } }