/* ============================================================
   LOGIN CARD — SPEC COMPARTILHADO v1.0 (22/05/2026)
   Fonte única de verdade para as 3 telas de login.
   Importado em: gerador_peticoes.html, admin.html, parceiro.html
   Usa seletores combinados para servir as 3 estruturas existentes
   sem precisar renomear classes em cada arquivo.
   ============================================================ */

/* Overlay (background gradient) -------------------------------
   FIX CRÍTICO 22/05/2026: display SEM !important para permitir que
   ocultarLogin()/JS escondam o overlay via style.display='none'.
   Sem isso, login bem-sucedido fica preso em "Entrando..." porque
   o overlay nunca é escondido. */
#auth-overlay,
#login-screen,
.login-overlay {
  position: fixed;
  inset: 0;
  background: linear-gradient(135deg, #0C2E5B 0%, #185FA5 50%, #2B86E6 100%);
  z-index: 9999;
  /* v1.239 #8: flex-start + scroll do overlay — em viewport baixa o card alto
     pode rolar e o botão "Criar conta" nunca fica cortado (corrige parceiro) */
  align-items: flex-start;
  justify-content: center;
  overflow-y: auto;
  padding: 20px;
  font-family: 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
}
/* Só aplica display:flex se não for explicitamente none (inline style) */
#auth-overlay:not([style*="display:none"]):not([style*="display: none"]),
#login-screen:not([style*="display:none"]):not([style*="display: none"]),
.login-overlay:not([style*="display:none"]):not([style*="display: none"]) {
  display: flex;
}

/* Card — dimensões iguais quando há espaço suficiente ----------
   Em viewports altos: min-height 580px (cards visualmente iguais)
   Em viewports baixos: altura natural (sem scrollbar) */
.auth-box,
.login-box,
.login-card {
  background: #fff !important;
  border-radius: 16px !important;
  padding: 36px 32px 24px !important;
  width: 380px !important;
  max-width: 100% !important;
  min-width: 0 !important;
  box-sizing: border-box !important;
  box-shadow: 0 12px 48px rgba(0, 0, 0, 0.25) !important;
  /* v1.239 #8: card vira container de scroll em viewport baixa (era none/visible,
     que anulava o fix inline e bloqueava o cadastro no portal de parceiros) */
  max-height: calc(100dvh - 40px) !important;
  overflow-y: auto !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: flex-start !important;
  border: 0 !important;
  text-align: left !important;
  margin: 0 !important;
}
/* Só aplica min-height igual quando viewport tem espaço suficiente
   (evita scrollbar em laptops com tela menor) */
@media (min-height: 680px) {
  .auth-box,
  .login-box,
  .login-card {
    min-height: 580px !important;
    justify-content: flex-start !important;  /* v1.239 #8: evita corte topo/fundo em card alto */
  }
}

/* Título principal ------------------------------------------- */
.auth-logo,
.login-box h2,
.login-logo {
  font-family: 'Cormorant Garamond', Georgia, serif !important;
  font-size: 26px !important;
  font-weight: 700 !important;
  color: #0C2E5B !important;
  line-height: 1.15 !important;
  letter-spacing: 0.01em !important;
  margin: 0 0 4px !important;
  padding: 0 !important;
  text-align: center !important;
}

/* Subtítulo --------------------------------------------------- */
.auth-sub,
.login-sub-padrao,
.login-sub {
  font-family: 'Segoe UI', system-ui, sans-serif !important;
  font-size: 13px !important;
  color: #718096 !important;
  margin: 0 0 20px !important;
  padding: 0 !important;
  text-align: center !important;
  font-weight: 400 !important;
}

/* Tabs (Entrar / Criar conta) -------------------------------- */
.auth-tab-row {
  display: flex !important;
  border-bottom: 2px solid #E2E8F0 !important;
  margin: 0 0 20px !important;
}
.auth-tab {
  flex: 1 !important;
  text-align: center !important;
  padding: 10px 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  color: #64748B !important;
  background: none !important;
  border: none !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -2px !important;
  cursor: pointer !important;
  transition: color .15s, border-color .15s !important;
  font-family: inherit !important;
}
.auth-tab.active {
  color: #0C2E5B !important;
  border-bottom-color: #185FA5 !important;
}

/* Form field group ------------------------------------------- */
.fg,
.field,
.login-field {
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  margin: 0 0 16px !important;
  text-align: left !important;
}
.fg label,
.field label,
.login-field label {
  display: block !important;
  font-size: 12px !important;
  color: #4A5568 !important;
  font-weight: 500 !important;
  margin: 0 !important;
  padding: 0 !important;
  letter-spacing: 0 !important;
}
.fg input,
.fg textarea,
.fg select,
.field input,
.login-field input {
  width: 100% !important;
  padding: 11px 14px !important;
  font-size: 14px !important;
  font-family: inherit !important;
  color: #1a1a18 !important;
  border: 1px solid #CBD5E0 !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
  outline: none !important;
  transition: border-color .15s, box-shadow .15s !important;
  background: #fff !important;
  line-height: 1.4 !important;
}
.fg input:focus,
.fg textarea:focus,
.fg select:focus,
.field input:focus,
.login-field input:focus {
  border-color: #185FA5 !important;
  box-shadow: 0 0 0 3px rgba(24, 95, 165, 0.15) !important;
}

/* Submit button ---------------------------------------------- */
.btn-auth,
.btn-primary,
.login-btn {
  width: 100% !important;
  padding: 12px !important;
  background: #185FA5 !important;
  color: #fff !important;
  border: 0 !important;
  border-radius: 8px !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  font-family: inherit !important;
  cursor: pointer !important;
  transition: background .15s !important;
  margin: 0 !important;
  line-height: 1.4 !important;
}
.btn-auth:hover,
.btn-primary:hover,
.login-btn:hover {
  background: #0C2E5B !important;
}
.btn-auth:disabled,
.btn-primary:disabled,
.login-btn:disabled {
  opacity: 0.6 !important;
  cursor: not-allowed !important;
  background: #185FA5 !important;
}

/* Error / message -------------------------------------------- */
.auth-msg,
.login-err {
  font-size: 12px !important;
  text-align: center !important;
  min-height: 16px !important;
  margin: 8px 0 0 !important;
  line-height: 1.4 !important;
}
.auth-msg.err,
.login-err {
  color: #C53030 !important;
}
.auth-msg.ok {
  color: #16a34a !important;
}

/* Footer (terms) --------------------------------------------- */
.auth-footer,
.login-footer-padrao {
  margin: 20px 0 0 !important;
  padding: 16px 0 0 !important;
  border-top: 1px solid #E2E8F0 !important;
  text-align: center !important;
  font-size: 10px !important;
  color: #9CA3AF !important;
  line-height: 1.5 !important;
}
.auth-footer a,
.login-footer-padrao a {
  color: #6B7280 !important;
  text-decoration: underline !important;
}

/* Recovery link ---------------------------------------------- */
.auth-recovery,
.login-recovery,
.login-hint {
  text-align: center !important;
  margin: 12px 0 0 !important;
}
.auth-recovery a,
.login-recovery a,
.login-hint a {
  display: inline-block !important;
  font-family: inherit !important;
  font-size: 12px !important;
  color: #185FA5 !important;
  text-decoration: none !important;
  padding: 5px 12px !important;
  border: 1px solid rgba(24, 95, 165, 0.3) !important;
  border-radius: 20px !important;
  opacity: 0.85 !important;
  transition: opacity .15s !important;
  cursor: pointer !important;
  line-height: 1.4 !important;
}
.auth-recovery a:hover,
.login-recovery a:hover,
.login-hint a:hover {
  opacity: 1 !important;
}

/* Version ---------------------------------------------------- */
.auth-version,
.login-version {
  margin: 12px 0 0 !important;
  font-size: 11px !important;
  color: #CBD5E0 !important;
  letter-spacing: 0.04em !important;
  text-align: center !important;
}

/* Acesso restrito (parceiro) --------------------------------- */
#acesso-restrito {
  font-family: 'Segoe UI', system-ui, sans-serif !important;
}
