/* Conferidor de CNPJ e e-mail: complementa nt.css (nt-calc, nt-campo, nt-calc-resultado, nt-destaque).
   Mobile-first; só as cores da marca. */

.cf-form [hidden] { display: none !important; }

.cf-form textarea {
  width: 100%; min-height: 9rem; padding: .7rem .8rem; border-radius: 10px; resize: vertical;
  border: 1px solid var(--nt-borda-forte, rgba(255, 255, 255, .14)); background: var(--nt-campo, #101214);
  color: var(--nt-texto, #ECEFF1); font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: .92rem; line-height: 1.55;
}
.cf-form textarea:focus { border-color: #1296FC; outline: 2px solid rgba(18, 150, 252, .5); outline-offset: 1px; }

.cf-botoes { margin-top: .9rem; gap: .5rem; }
.nt-corpo .cf-status {
  margin: 1rem 0 0; padding: .7rem .95rem; border-radius: 10px;
  background: rgba(18, 150, 252, .08); border-left: 3px solid #1296FC;
  font-size: .95rem; line-height: 1.5; color: var(--nt-texto, #ECEFF1);
}
.cf-titulo-itens { margin-top: 1.2rem; }

.nt-corpo ul.cf-itens { list-style: none; padding: 0; margin: 0 0 .4rem; display: grid; gap: .45rem; }
.nt-corpo .cf-item {
  display: grid; grid-template-columns: auto 1fr; gap: .15rem .6rem; align-items: baseline; margin: 0;
  padding: .6rem .8rem; border-radius: 10px; background: #1A1D1F;
  border: 1px solid var(--nt-borda, rgba(255, 255, 255, .05)); border-left: 3px solid #5F6A6C; font-size: .92rem;
}
.nt-corpo .cf-item-invalido, .nt-corpo .cf-item-quebrado, .nt-corpo .cf-item-malformado { border-left-color: #1296FC; }
.cf-tipo { font: 500 .72rem var(--nt-fonte-titulo); letter-spacing: .05em; text-transform: uppercase; color: #95A5A6; }
.cf-valor {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .88rem; color: #ffffff;
  overflow-wrap: anywhere;
}
.cf-motivo { grid-column: 1 / -1; color: var(--nt-texto-suave, #B8C2C4); line-height: 1.45; }

.cf-cta { margin: 1.2rem 0 0; }
.cf-cta p { margin: 0 0 .8rem; }

@media print {
  .cf-botoes, .cf-cta { display: none !important; }
  .cf-item, .cf-form textarea { background: #ffffff; color: #111111; border-color: #cccccc; }
  .cf-valor { color: #111111; }
}
