/* styles/fixes.css — estados que no export eram estado React (foco, erro, visto) e ganchos novos.
   Escrito à mão; o build junta-o ao CSS extraído de cada página (scripts/rebuild-from-export.mjs). */

[hidden] { display: none !important; }
body.modal-open { overflow: hidden; }

/* Foco dos campos do pop-up (o export fazia isto com estado React + estilo inline) */
#leadForm input:not([type="checkbox"]):focus,
#leadForm .phone-box:focus-within {
  border-color: var(--royal-400) !important;
  box-shadow: 0 0 0 3px var(--accent-soft) !important;
}
#leadForm .phone-box input:focus { box-shadow: none !important; }
#leadForm select:focus-visible { outline: 2px solid var(--royal-400); outline-offset: 2px; }

/* Campo inválido */
#leadForm .field.invalid input:not([type="checkbox"]),
#leadForm .field.invalid .phone-box,
#leadForm .field.invalid select { border-color: var(--urgent) !important; }
#leadForm .field.invalid .phone-box input { border: none !important; }
#leadForm .field.invalid .check-box { border-color: var(--urgent) !important; }
#perguntaForm [aria-invalid="true"],
#surveyForm [aria-invalid="true"] { border-color: var(--red-500) !important; }

/* Mensagens junto ao campo (mesmo aspeto do .cd-ferr do design) */
.f-err, .f-warn {
  display: block; margin-top: 6px; font-family: var(--font-sans); font-size: var(--text-xs);
  font-weight: 400; line-height: 1.35; text-align: left;
}
.f-err { color: var(--red-400); }
/* nome, email e WhatsApp: no design o erro herdava a altura de linha do campo (1.6) */
#leadForm .field:has(#f-nome, #f-email, #tel) > .f-err { line-height: 1.6; }
.f-warn { color: #F5C451; }

/* Caixa de consentimento: visto (o input real fica acessível por teclado) */
#leadForm .check-box.is-on { background: var(--royal-500) !important; border-color: var(--royal-500) !important; }
#consent { position: absolute; opacity: 0; width: 1px; height: 1px; margin: 0; }
#consent:focus-visible + span,
#leadForm label:has(#consent:focus-visible) .check-box { outline: 2px solid var(--royal-400); outline-offset: 2px; }

/* Indicativo: a lista aberta é desenhada pelo sistema operativo (Windows mostra-a clara) */
#ccode { color-scheme: dark; }
#ccode option { background-color: #07123A; color: #fff; }

/* Link ainda sem destino (variável de ambiente por definir) */
a[aria-disabled="true"] { cursor: not-allowed; }