/* ============================================================
   ACESSO — login e recuperacao de senha.

   Substitui o <style> inline que estava em _AuthLayout.cshtml, que trazia
   um sistema de design paralelo: paleta propria em hexadecimal
   (#0b0e14, #161b22, #30363d, #58a6ff), tema por data-bs-theme e Bootstrap
   inteiro vindo de CDN so' para desenhar um cartao e dois campos.

   Agora usa os mesmos tokens do resto do app, entao o tema claro/escuro
   funciona igual em toda a aplicacao.
   ============================================================ */

.auth-body {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
}

.auth-container {
  max-width: 450px;
  width: 100%;
  padding: 2rem;
}

.auth-card {
  background: var(--bg-card);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 2.5rem;
  box-shadow: var(--shadow-lg);
}

.brand-logo {
  font-family: var(--display);
  color: var(--fg);
  font-weight: 700;
  letter-spacing: -0.025em;
  font-size: 1.8rem;
  text-align: center;
  margin-bottom: 0.5rem;
}

.auth-subtitle {
  text-align: center;
  color: var(--fg-dim);
  font-size: 0.9rem;
  margin-bottom: 2rem;
}

/* Alternador de tema flutuante: as telas de acesso nao tinham nenhum,
   entao o usuario ficava preso no tema escuro ate' entrar. */
.auth-theme-toggle {
  position: fixed;
  top: 20px;
  right: 20px;
  z-index: 5;
}

/* Link secundario das telas de acesso: "Primeiro acesso", "Ja tenho senha".
   A classe ja era usada em Login.cshtml antes de existir regra nenhuma —
   entao o link herdava o estilo do <a> do base.css. */
.auth-link {
  color: var(--fg-dim);
  font-size: 0.85rem;
  text-decoration: none;
}

.auth-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

/* .auth-error mudou para components.css: a troca de senha usa a mesma classe e
   roda no _Layout normal, que nao carrega esta folha. */