/**
 * VortqAI — Telas públicas de autenticação (login / recuperar senha / redefinir senha)
 * PROMPT 64.27.81 — refinamento visual: dark premium coerente com a home
 * pública (vortqai/assets/css/site.css). Card navy translúcido com blur em
 * vez de card branco, logo oficial sem chip/caixa. Carregado por login.php,
 * forgot-password.php e reset-password.php — nunca duplicar estas regras
 * dentro de cada página.
 */

:root {
  --auth-bg:          #0B1220;
  --auth-bg-2:        #10192E;
  --auth-blue:        #3B5BFF;
  --auth-cyan:        #22D3EE;
  --auth-grad:        linear-gradient(135deg, #3B5BFF, #22D3EE);

  --auth-card-bg:     linear-gradient(180deg, rgba(30,41,59,.66) 0%, rgba(13,21,38,.72) 100%);
  --auth-card-border: rgba(148,163,184,.16);

  --auth-text:        #F8FAFC;
  --auth-text-soft:   #E2E8F0;
  --auth-muted:       #94A3B8;
  --auth-muted-2:     #64748B;

  --auth-field-bg:       rgba(148,163,184,.07);
  --auth-field-bg-focus: rgba(148,163,184,.11);
  --auth-field-border:   rgba(148,163,184,.20);

  --auth-radius:  18px;
}

* { box-sizing: border-box; }
html { overflow-x: hidden; }
img { max-width: 100%; }

body.auth-body {
  min-height: 100vh;
  margin: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 20px;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Inter, Roboto, Arial, sans-serif;
  font-size: 0.9rem;
  color: var(--auth-text-soft);
  background: var(--auth-bg);
  position: relative;
  overflow-x: hidden;
}

/* Fundo: glow azul/ciano muito discreto + grid sutil — mesma linguagem do
   hero da home, sem esfera/cards/animação (evita competir com o formulário). */
body.auth-body::before {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background:
    radial-gradient(ellipse 70% 50% at 50% -10%, rgba(59,91,255,.22) 0%, transparent 60%),
    radial-gradient(ellipse 60% 45% at 100% 100%, rgba(34,211,238,.10) 0%, transparent 55%),
    var(--auth-bg-2);
}
body.auth-body::after {
  content: '';
  position: fixed; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 64px 64px;
  -webkit-mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, black 10%, transparent 75%);
  mask-image: radial-gradient(ellipse 80% 70% at 50% 30%, black 10%, transparent 75%);
}

@keyframes auth-card-in {
  from { opacity: 0; transform: translateY(10px); }
  to   { opacity: 1; transform: translateY(0); }
}

.auth-card {
  position: relative; z-index: 1;
  width: 100%; max-width: 460px; min-width: 0;
  background: var(--auth-card-bg);
  border: 1px solid var(--auth-card-border);
  border-radius: var(--auth-radius);
  box-shadow: 0 24px 70px rgba(0,0,0,.55), 0 1px 0 rgba(255,255,255,.05) inset;
  backdrop-filter: blur(20px) saturate(150%);
  -webkit-backdrop-filter: blur(20px) saturate(150%);
  padding: 40px 38px 34px;
  animation: auth-card-in .35s ease-out;
}
@media (max-width: 480px) {
  .auth-card { padding: 30px 22px 26px; max-width: 100%; }
}

.auth-brand { text-align: center; margin-bottom: 26px; }
.auth-brand-logo {
  height: 38px; width: auto; display: block; margin: 0 auto 18px;
}
.auth-brand h1 {
  font-size: 1.2rem; font-weight: 800; color: var(--auth-text);
  margin: 0 0 8px; letter-spacing: -.2px;
}
.auth-brand p {
  font-size: .84rem; color: var(--auth-muted); margin: 0; line-height: 1.5;
}

.auth-label {
  display: block; font-size: .82rem; font-weight: 600; color: var(--auth-text-soft);
  margin-bottom: 6px;
}
.auth-field { position: relative; margin-bottom: 18px; }
.auth-input {
  width: 100%; font-size: .92rem; color: var(--auth-text);
  background: var(--auth-field-bg); border: 1px solid var(--auth-field-border); border-radius: 10px;
  padding: 11px 14px;
  transition: border-color .15s, box-shadow .15s, background .15s;
}
.auth-input::placeholder { color: var(--auth-muted-2); }
.auth-input:focus {
  outline: none; border-color: var(--auth-cyan); background: var(--auth-field-bg-focus);
  box-shadow: 0 0 0 3px rgba(34,211,238,.14);
}
.auth-field-icon-wrap { position: relative; }
.auth-field-icon-wrap .auth-input { padding-left: 40px; }
.auth-field-icon {
  position: absolute; left: 13px; top: 50%; transform: translateY(-50%);
  color: var(--auth-muted-2); display: flex; pointer-events: none;
}
.auth-toggle-visibility {
  position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  background: none; border: none; padding: 7px; cursor: pointer;
  color: var(--auth-muted-2); display: flex; align-items: center; justify-content: center;
  border-radius: 6px;
}
.auth-toggle-visibility:hover { color: var(--auth-text-soft); background: rgba(148,163,184,.12); }
.auth-toggle-visibility svg { display: block; }
.auth-field-icon-wrap .auth-input.has-toggle { padding-right: 40px; }

.auth-btn {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  width: 100%; padding: 12px 16px; margin-top: 4px;
  background: var(--auth-grad); color: #fff; font-size: .92rem; font-weight: 700;
  border: none; border-radius: 10px; cursor: pointer;
  box-shadow: 0 8px 26px rgba(34,211,238,.22);
  transition: transform .15s, box-shadow .15s;
}
.auth-btn:hover { transform: translateY(-1px); box-shadow: 0 10px 30px rgba(34,211,238,.3); }
.auth-btn:disabled { opacity: .6; cursor: not-allowed; transform: none; }
.auth-btn-outline {
  background: rgba(148,163,184,.08); color: var(--auth-text-soft);
  border: 1px solid var(--auth-field-border);
  box-shadow: none;
}
.auth-btn-outline:hover { background: rgba(148,163,184,.14); box-shadow: none; transform: none; }

.auth-links { text-align: center; margin-top: 18px; }
.auth-links a {
  font-size: .82rem; color: var(--auth-muted); text-decoration: none;
  display: inline-flex; align-items: center; gap: 5px;
  transition: color .15s;
}
.auth-links a:hover { color: var(--auth-cyan); }

.auth-alert {
  display: flex; align-items: flex-start; gap: 9px;
  font-size: .84rem; line-height: 1.5; border-radius: 10px;
  padding: 11px 14px; margin-bottom: 18px;
}
.auth-alert svg { flex-shrink: 0; margin-top: 1px; }
.auth-alert-danger  { background: rgba(220,38,38,.12);  color: #FCA5A5; border: 1px solid rgba(220,38,38,.28); }
.auth-alert-success { background: rgba(34,197,94,.12);  color: #86EFAC; border: 1px solid rgba(34,197,94,.28); }

.auth-hint { font-size: .74rem; color: var(--auth-muted); margin-top: 6px; line-height: 1.5; }
.auth-match-msg { font-size: .74rem; margin-top: 6px; display: flex; align-items: center; gap: 5px; }
.auth-match-ok  { color: #4ADE80; }
.auth-match-bad { color: #F87171; }

.auth-strength-bar { height: 4px; border-radius: 2px; background: rgba(148,163,184,.16); overflow: hidden; margin-top: 8px; }
.auth-strength-fill { height: 100%; width: 0; border-radius: 2px; transition: width .25s ease, background-color .25s ease; }
.auth-strength-text { font-size: .72rem; margin-top: 4px; color: var(--auth-muted); }

.auth-footer {
  position: relative; z-index: 1;
  text-align: center; margin-top: 26px;
  font-size: .76rem; color: rgba(255,255,255,.4);
}

.auth-center { text-align: center; }
.auth-name-hint { font-size: .82rem; color: var(--auth-muted); text-align: center; margin-bottom: 18px; }
.auth-icon-lg { width: 40px; height: 40px; }