/* =============================================================================
   FI v2 - Login (Constituicao sec.7: so e-mail/senha, sem botoes de perfil)
   ============================================================================= */
.login-wrap {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 24px;
  background:
    radial-gradient(1200px 600px at 50% -10%, var(--navy-3), transparent 60%),
    var(--navy);
}
.login-box { width: 100%; max-width: 392px; }

.login-brand {
  text-align: center;
  margin-bottom: var(--sp-22);
}
.login-brand .brand-logo { font-size: 28px; }
.login-brand .tagline {
  display: block;
  margin-top: var(--sp-8);
  color: #9fb3c8;
  font-size: var(--fs-13);
  letter-spacing: .01em;
}

.login-card {
  background: var(--card);
  border-radius: var(--raio-lg);
  box-shadow: var(--sombra-md);
  padding: 30px 28px;
}
.login-card h1 {
  font-size: 19px;
  margin-bottom: var(--sp-4);
}
.login-card .sub {
  color: var(--texto-suave);
  font-size: var(--fs-14);
  margin: 0 0 22px;
}
.login-card .btn-primary { width: 100%; margin-top: var(--sp-4); }
/* visual novo (Fase 4): inputs raio 8px, alinhado ao piloto */
.login-card .field input { border-radius: var(--raio-sm); }

.login-foot {
  text-align: center;
  color: #7d93a8;
  font-size: var(--fs-12);
  margin-top: var(--sp-18);
}

/* =============================================================================
   MOBILE — o login não carrega app.css, então precisa do próprio anti-zoom:
   input < 16px faz o Safari iOS dar zoom no foco. Aditivo (login não tinha @media)
   → desktop byte-fiel, exceto o raio 8px acima (migração deliberada).
   ============================================================================= */
@media (max-width: 768px) {
  .login-card { padding: 24px 20px; }
  .login-brand .brand-logo { font-size: 24px; }
  .login-card .field input { font-size: var(--fs-16); min-height: 44px; }
}

/* ---- "Esqueci minha senha" (VV1 item 6) ------------------------------------ */
.login-link { text-align: center; margin: var(--sp-14) 0 0; font-size: var(--fs-14); }
.login-link a { color: var(--navy); font-weight: 600; text-decoration: none; }
.login-link a:hover { text-decoration: underline; }
.login-sub-tit { font-family: var(--fonte-tit); font-size: var(--fs-18); color: var(--navy); margin: 0 0 var(--sp-6); }
.login-nota { font-size: var(--fs-12); color: var(--texto-suave); line-height: 1.45; margin: var(--sp-12) 0 0; }
.banner-ok {
  background: var(--verde-suave);
  border: 1px solid var(--verde);
  color: var(--verde-2);
  font-size: var(--fs-14);
  border-radius: var(--raio);
  padding: var(--sp-10) var(--sp-12);
  margin-bottom: var(--sp-16);
}
