/* assets/css/auth.css — DigiWork 3.0
   Estilos compartidos por las paginas sin sesion: login.php, auth/register.php,
   auth/recuperar_password.php, auth/verificar_email.php,
   auth/reenviar_verificacion.php. Antes cada una llevaba su propio <style>
   con este mismo bloque copiado y pegado (5 copias casi identicas) --
   centralizado aqui (peticion del usuario 2026-09-23) junto con el link a
   este fichero. Usa las variables de tema de styles.css (que ya cargan
   todas antes que este), incluido el @media prefers-color-scheme añadido
   ahi mismo para que estas pantallas respeten el modo oscuro del sistema. */

.login-wrap {
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  background: var(--bg);
}
.login-logo {
  font-size: 2rem;
  font-weight: 900;
  letter-spacing: -1px;
  color: var(--primary);
  margin-bottom: 6px;
}
.login-logo span { color: var(--muted); }
.login-sub { font-size: 0.82rem; color: var(--muted); margin-bottom: 32px; }
.login-card {
  background: var(--card);
  border-radius: var(--radius);
  border: 1px solid var(--border);
  box-shadow: var(--shadow-lg);
  padding: 28px 22px;
  width: 100%;
  max-width: 400px;
}
.login-card-center { text-align: center; }
.login-error {
  background: var(--danger-10);
  color: var(--danger);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 16px;
  text-align: center;
}
.login-ok {
  background: color-mix(in srgb, var(--success) 10%, transparent);
  color: var(--success);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 16px;
  text-align: center;
}
.login-warning {
  background: color-mix(in srgb, var(--warning) 12%, transparent);
  color: var(--warning);
  border-radius: var(--radius-sm);
  padding: 10px 14px;
  font-size: 0.85rem;
  font-weight: 600;
  margin-bottom: 16px;
  text-align: center;
}
.login-footer { margin-top: 20px; text-align: center; font-size: 0.8rem; color: var(--muted); }
.login-footer a { color: var(--primary); font-weight: 600; text-decoration: none; }
.login-desc { font-size: 0.87rem; color: var(--muted); margin-bottom: 18px; line-height: 1.5; }