/* ════════════════════════════════════════════════════════════════════════
   modules/auth.css — login / devise / mi cuenta
   ════════════════════════════════════════════════════════════════════════ */

.auth-shell {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: var(--space-5) var(--space-4);
}

.auth-brand {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  margin-bottom: var(--space-4);
  color: var(--gray-800);
}
.auth-brand-icon { color: var(--c-primary); }
.auth-brand-name {
  font-size: var(--text-xl);
  font-weight: 800;
  letter-spacing: -0.02em;
}

.auth-wrap { max-width: 420px; margin: 0 auto; width: 100%; }
.auth-wrap--in-app { margin: var(--space-5) auto; }
.auth-shell .card, .auth-card { padding: var(--space-5); }
.auth-title { text-align: center; margin-bottom: var(--space-4); font-size: var(--text-xl); }

.auth-links { margin-top: var(--space-3); text-align: center; font-size: var(--text-sm); }
.auth-link { color: var(--c-primary); text-decoration: none; }
.auth-link:hover { text-decoration: underline; }
.auth-link-row { margin-top: var(--space-2); }
.auth-deactivate-hint { margin-top: var(--space-3); text-align: center; }

/* El login original era una card de 420px con estilos inline — ahora aquí */
.auth-shell > .auth-wrap, .auth-shell > div[style] { margin-left: auto; margin-right: auto; }