/* ============================================================
   assets/css/auth.css
   Estilo das páginas de autenticação (login, criar senha,
   recuperar senha). Reaproveita os mesmos tokens visuais
   (cores, fontes, raios) usados na plataforma, sem alterar
   nenhum arquivo do projeto original.
   ============================================================ */
:root{
  --black:#0B0B0C;
  --surface:#16161A;
  --surface-2:#1E1E23;
  --border-soft:#222227;

  --red:#E0152A;
  --red-deep:#7A0E1C;
  --red-glow: rgba(224,21,42,0.35);

  --gold:#C9A24B;

  --white:#F5F4F2;
  --muted:#9A9AA1;
  --muted-2:#6E6E75;

  --success:#2FAE63;
  --danger:#FF6B78;

  --radius-sm:8px;
  --radius-lg:20px;

  --shadow-deep: 0 20px 60px rgba(0,0,0,0.55);

  --font-display: -apple-system, "SF Pro Display", "Segoe UI Semibold", Roboto, sans-serif;
  --font-body: -apple-system, "SF Pro Text", "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }

body.auth-page{
  min-height:100vh;
  background:var(--black);
  color:var(--white);
  font-family:var(--font-body);
  display:flex;
  align-items:center;
  justify-content:center;
  padding:20px;
}

.auth-card{
  width:100%;
  max-width:420px;
  background:var(--surface);
  border:1px solid var(--border-soft);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-deep);
  padding:32px 30px;
  animation:authFadeIn .35s var(--ease);
}
@keyframes authFadeIn{ from{opacity:0;transform:translateY(12px);} to{opacity:1;transform:none;} }

.auth-brand{
  display:flex; align-items:center; gap:10px; margin-bottom:22px;
}
.auth-brand__name{ font-family:var(--font-display); font-weight:800; font-size:15px; }

.auth-title{
  font-family:var(--font-display); font-weight:800; font-size:22px; margin-bottom:6px;
}
.auth-sub{ color:var(--muted); font-size:13.5px; margin-bottom:24px; line-height:1.5; }

.auth-field{ margin-bottom:16px; }
.auth-field label{
  display:block; font-size:12.5px; color:var(--muted); margin-bottom:6px; text-transform:uppercase; letter-spacing:.04em;
}
.auth-field input{
  width:100%; background:var(--surface-2); border:1px solid var(--border-soft); border-radius:var(--radius-sm);
  padding:12px 14px; color:var(--white); font-size:14.5px; outline:none; transition:border-color .2s var(--ease);
}
.auth-field input:focus{ border-color:var(--gold); }

.auth-submit{
  width:100%; padding:13px 20px; margin-top:6px;
  background:linear-gradient(135deg,var(--red),var(--red-deep));
  color:var(--white); border:none; border-radius:var(--radius-sm);
  font-family:var(--font-display); font-weight:700; font-size:15px; cursor:pointer;
  transition:transform .2s var(--ease), box-shadow .2s var(--ease);
}
.auth-submit:hover{ transform:translateY(-2px); box-shadow:0 8px 24px var(--red-glow); }
.auth-submit:disabled{ opacity:.5; cursor:wait; }

.auth-links{ margin-top:18px; text-align:center; font-size:13px; color:var(--muted); }
.auth-links a{ color:var(--gold); text-decoration:none; }
.auth-links a:hover{ text-decoration:underline; }

.auth-alert{
  padding:12px 14px; border-radius:var(--radius-sm); font-size:13px; margin-bottom:18px; line-height:1.5;
}
.auth-alert--error{ background:rgba(255,107,120,0.1); border:1px solid rgba(255,107,120,0.3); color:var(--danger); }
.auth-alert--success{ background:rgba(47,174,99,0.1); border:1px solid rgba(47,174,99,0.3); color:var(--success); }
.auth-alert--info{ background:rgba(201,162,75,0.1); border:1px solid rgba(201,162,75,0.3); color:var(--gold); }