/*
 * Pantallas de acceso fuera de la sesión (recuperar / restablecer / confirmar
 * contraseña, verificar correo). AUD-092 del informe (sección 16): estaban en
 * inglés y con Tailwind (otro framework, otro aspecto). Ahora usan Bootstrap y
 * el mismo estilo que el login (resources/views/auth/login.blade.php).
 *
 * Contrastes (WCAG 1.4.3) sobre el degradado oscuro #1a1d2e→#0f3460:
 *   texto secundario blanco al 75 % ≥ 7,7:1; placeholder al 60 % ≥ 5,5:1.
 */
:root { --accent: #6c63ff; --accent2: #ff6584; }
* { box-sizing: border-box; }
body.auth-body {
    min-height: 100vh; margin: 0;
    background: linear-gradient(135deg, #1a1d2e 0%, #16213e 50%, #0f3460 100%);
    display: flex; align-items: center; justify-content: center;
    font-family: system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}
.auth-wrapper { width: 100%; max-width: 460px; padding: 1rem; }
.auth-card {
    background: rgba(255,255,255,0.05);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 20px; padding: 2.25rem 2rem;
    box-shadow: 0 25px 50px rgba(0,0,0,0.4);
}
@media (max-width: 400px) { .auth-card { padding: 1.5rem 1.1rem; } }
.auth-icon {
    width: 64px; height: 64px; border-radius: 18px; margin: 0 auto 1.25rem;
    background: linear-gradient(135deg, #4f46e5, #be185d);
    display: flex; align-items: center; justify-content: center;
    font-size: 1.8rem; color: #fff;
}
.auth-title { color: #fff; font-size: 1.45rem; font-weight: 700; text-align: center; margin: 0 0 .4rem; }
.auth-sub { color: rgba(255,255,255,0.75); text-align: center; font-size: .92rem; margin-bottom: 1.6rem; }
.auth-card .form-label { color: rgba(255,255,255,0.85); font-size: .88rem; font-weight: 600; margin-bottom: .4rem; }
.auth-card .form-control {
    background: rgba(255,255,255,0.08); border: 1px solid rgba(255,255,255,0.25);
    color: #fff; border-radius: 10px; padding: .72rem 1rem;
}
.auth-card .form-control:focus {
    background: rgba(255,255,255,0.12); border-color: #a5b4fc; color: #fff;
    box-shadow: 0 0 0 3px rgba(165,180,252,0.35);
}
.auth-card .form-control::placeholder { color: rgba(255,255,255,0.6); opacity: 1; }
.auth-card .form-control.is-invalid { border-color: #fca5a5; }
.auth-card .invalid-feedback { color: #fecaca; font-size: .85rem; }
.auth-card .form-text { color: rgba(255,255,255,0.75); }
/* Botón: #4f46e5→#be185d con texto blanco ≥ 6,0:1 (antes #6c63ff/#ff6584 ≈ 3:1). */
.btn-auth {
    background: linear-gradient(135deg, #4f46e5, #be185d); border: none; color: #fff;
    padding: .8rem; font-size: 1rem; font-weight: 700; border-radius: 10px; width: 100%;
}
.btn-auth:hover, .btn-auth:focus { color: #fff; opacity: .92; }
.btn-auth:focus-visible { outline: 3px solid #a5b4fc; outline-offset: 2px; }
.auth-link { color: #c7d2fe; font-size: .9rem; }
.auth-link:hover, .auth-link:focus { color: #fff; }
.auth-foot { color: rgba(255,255,255,0.6); font-size: .78rem; text-align: center; margin-top: 1.5rem; }
.auth-card .alert { font-size: .88rem; }
.btn-link-auth { background: none; border: none; padding: 0; color: #c7d2fe; text-decoration: underline; font-size: .9rem; }
.btn-link-auth:hover, .btn-link-auth:focus { color: #fff; }
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }
