/* =============================================================
   CEAD — Página de validação de certificado (/validar/)
   cead-cert-validador.css   ·   Dependência: cead-tokens.css
   Shortcode: [cead_validar_certificado]
   ============================================================= */

.cead-validador {
  font-family: var(--cead-font, 'Montserrat', sans-serif);
  color: var(--cead-text, #1E293B);
  max-width: 640px;
  margin: 0 auto;
  padding: var(--cead-space-2, 8px) 0 var(--cead-space-8, 32px);
}

.cead-validador *,
.cead-validador *::before,
.cead-validador *::after {
  box-sizing: border-box;
}

/* ── Formulário ─────────────────────────────────────────────── */

.cead-validador__form {
  background: var(--cead-white, #fff);
  border: 1px solid var(--cead-border, #E2E8F0);
  border-radius: var(--cead-radius-lg, 12px);
  box-shadow: var(--cead-shadow-md, 0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06));
  padding: var(--cead-space-6, 24px);
}

.cead-validador__label {
  display: block;
  font-size: var(--cead-text-xs, .75rem);
  font-weight: var(--cead-font-semibold, 600);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--cead-text-soft, #64748B);
  margin: 0 0 var(--cead-space-2, 8px);
}

.cead-validador__row {
  display: flex;
  gap: var(--cead-space-2, 8px);
  flex-wrap: wrap;
}

.cead-validador__input {
  flex: 1 1 220px;
  min-width: 0;
  padding: var(--cead-input-py, 10px) var(--cead-input-px, 14px);
  font-family: inherit;
  font-size: var(--cead-text-base, 1rem);
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--cead-text, #1E293B);
  background: var(--cead-white, #fff);
  border: var(--cead-input-border, 1.5px solid #E2E8F0);
  border-radius: var(--cead-radius-md, 6px);
  transition: border-color var(--cead-transition, 180ms ease), box-shadow var(--cead-transition, 180ms ease);
}

.cead-validador__input:focus {
  outline: none;
  border-color: var(--cead-blue, #1D4ED8);
  box-shadow: 0 0 0 3px var(--cead-blue-light, #DBEAFE);
}

.cead-validador__input::placeholder {
  color: var(--cead-text-soft, #64748B);
  letter-spacing: .12em;
}

.cead-validador__submit {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--cead-btn-py, 11px) var(--cead-btn-px, 24px);
  font-family: inherit;
  font-size: var(--cead-text-sm, .875rem);
  font-weight: var(--cead-font-semibold, 600);
  text-transform: uppercase;
  letter-spacing: .04em;
  color: var(--cead-text-white, #fff);
  background: var(--cead-green, #16A34A);
  border: 0;
  border-radius: var(--cead-radius-md, 6px);
  cursor: pointer;
  transition: background var(--cead-transition, 180ms ease);
}

.cead-validador__submit:hover,
.cead-validador__submit:focus-visible {
  background: var(--cead-green-hover, #15803D);
  color: var(--cead-text-white, #fff);
}

.cead-validador__hint {
  margin: var(--cead-space-3, 12px) 0 0;
  font-size: var(--cead-text-sm, .875rem);
  line-height: var(--cead-leading-normal, 1.5);
  color: var(--cead-text-soft, #64748B);
}

/* ── Resultado ──────────────────────────────────────────────── */

.cead-validador__resultado {
  margin-top: var(--cead-space-5, 20px);
  background: var(--cead-white, #fff);
  border: 1px solid var(--cead-border, #E2E8F0);
  border-radius: var(--cead-radius-lg, 12px);
  box-shadow: var(--cead-shadow-md, 0 1px 3px rgba(0,0,0,.1), 0 1px 2px rgba(0,0,0,.06));
  padding: var(--cead-space-6, 24px);
  border-top: 4px solid var(--cead-border, #E2E8F0);
}

.cead-validador__resultado--valido        { border-top-color: var(--cead-green, #16A34A); }
.cead-validador__resultado--nao-encontrado { border-top-color: var(--cead-error, #DC2626); }
.cead-validador__resultado--invalido,
.cead-validador__resultado--limite         { border-top-color: var(--cead-warning, #F59E0B); }

.cead-validador__badge {
  display: flex;
  align-items: center;
  gap: var(--cead-space-3, 12px);
  font-size: var(--cead-text-lg, 1.125rem);
  font-weight: var(--cead-font-semibold, 600);
  color: var(--cead-navy, #0F2044);
  line-height: var(--cead-leading-snug, 1.375);
}

.cead-validador__icon {
  flex: 0 0 auto;
  width: 32px;
  height: 32px;
}

/* ── Campos (nome, curso, datas...) ─────────────────────────── */

.cead-validador__campos {
  margin: var(--cead-space-5, 20px) 0 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--cead-space-4, 16px) var(--cead-space-6, 24px);
}

.cead-validador__campos > div {
  min-width: 0;
}

.cead-validador__campos dt {
  margin: 0 0 2px;
  font-size: var(--cead-text-xs, .75rem);
  font-weight: var(--cead-font-semibold, 600);
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--cead-text-soft, #64748B);
}

.cead-validador__campos dd {
  margin: 0;
  font-size: var(--cead-text-base, 1rem);
  font-weight: var(--cead-font-medium, 500);
  color: var(--cead-text, #1E293B);
  word-break: break-word;
}

/* Nome e Curso ocupam a linha inteira */
.cead-validador__campos > div:nth-child(1),
.cead-validador__campos > div:nth-child(2) {
  grid-column: 1 / -1;
}

.cead-validador__instituicao {
  margin: var(--cead-space-5, 20px) 0 0;
  padding-top: var(--cead-space-4, 16px);
  border-top: 1px solid var(--cead-border, #E2E8F0);
  font-size: var(--cead-text-base, 1rem);
  color: var(--cead-navy, #0F2044);
}

.cead-validador__juridico {
  margin: var(--cead-space-3, 12px) 0 0;
  font-size: var(--cead-text-xs, .75rem);
  line-height: var(--cead-leading-relaxed, 1.625);
  color: var(--cead-text-soft, #64748B);
}

/* ── Mobile ─────────────────────────────────────────────────── */

@media (max-width: 560px) {
  .cead-validador__campos {
    grid-template-columns: 1fr;
  }
  .cead-validador__submit {
    flex: 1 1 100%;
  }
}