/* ==========================================================
   Estilos específicos de cada tela
   ========================================================== */

/* ---------- Utilitários ---------- */

.opcional { margin-left: auto; font-size: 12px; font-weight: 500; color: var(--texto-3); }
.espaco-topo { margin-top: 16px; }
.espaco-baixo { margin-bottom: 16px; }
.divisor { height: 1px; margin: 22px 0; background: var(--borda); }

.subtitulo-bloco {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0 0 12px;
  font-size: 14px;
  font-weight: 650;
  color: var(--texto);
}

.subtitulo-bloco .icone { width: 17px; height: 17px; color: var(--azul-texto); }

.secao { margin-top: 36px; }
.secao-titulo { margin-bottom: 14px; }
.secao-titulo h2 { font-size: 18px; font-weight: 750; }
.secao-titulo p { margin-top: 3px; font-size: 14px; color: var(--texto-2); }
.secao-titulo--linha { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }

.link-secao { display: inline-flex; align-items: center; gap: 6px; font-size: 13.5px; font-weight: 600; text-decoration: none; }
.link-secao .icone { width: 15px; height: 15px; }

.acoes-cabecalho { display: flex; flex-wrap: wrap; gap: 10px; }

.acoes-formulario {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 24px;
  padding-top: 18px;
  border-top: 1px solid var(--borda);
}

.total-linha {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--borda);
  font-weight: 600;
}

.total-linha strong { font-size: 18px; }

.salvar-historico {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  margin-top: 20px;
  padding-top: 18px;
  border-top: 1px solid var(--borda);
}

.valor-deslizador { margin-left: auto; font-size: 15px; font-weight: 750; color: var(--azul-texto); }
.chips--compactos { margin-top: 8px; }
.chips--compactos .chip { min-height: 32px; border-style: solid; }
.campo__selo { margin-left: auto; }
.linha-campos--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }

.status-salvo {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 13px;
  font-weight: 600;
  color: var(--verde-texto);
  opacity: 0;
  transition: opacity 0.25s;
}

.status-salvo .icone { width: 16px; height: 16px; }
.status-salvo.is-visivel { opacity: 1; }

.passo-a-passo ol { display: grid; gap: 8px; margin: 12px 0 0; padding-left: 20px; color: var(--texto-2); }

/* ---------- Listas ---------- */

.lista { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.lista__vazia { padding: 8px 0; font-size: 14px; }

.item-lista {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 14px;
}

.item-lista__icone {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 11px;
  background: var(--superficie-2);
  color: var(--azul-texto);
}

.item-lista__texto { display: grid; flex: 1; gap: 2px; min-width: 0; }
.item-lista__texto strong { font-size: 14.5px; font-weight: 650; overflow-wrap: anywhere; }
.item-lista__texto > span { font-size: 13px; color: var(--texto-2); }
.item-lista__texto .selo { justify-self: start; margin-top: 4px; }
.item-lista__acoes { display: flex; flex-shrink: 0; align-items: center; gap: 4px; }

/* ---------- Ativação ---------- */

.ativacao {
  position: fixed;
  inset: 0;
  z-index: 300;
  display: grid;
  place-items: center;
  padding: 24px 16px;
  overflow-y: auto;
  background:
    radial-gradient(900px 500px at 15% 0%, rgba(47, 123, 255, 0.2), transparent 60%),
    radial-gradient(700px 500px at 100% 100%, rgba(139, 92, 246, 0.16), transparent 60%),
    var(--bg);
  transition: opacity 0.22s;
}

.ativacao.is-saindo { opacity: 0; }

.ativacao__cartao {
  width: min(420px, 100%);
  padding: 32px 28px;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 22px;
  box-shadow: var(--sombra-elevada);
  animation: entrar 0.4s var(--curva) both;
}

.ativacao__logo { width: 56px; height: 56px; margin-bottom: 18px; border-radius: 16px; box-shadow: 0 12px 30px -12px rgba(47, 123, 255, 0.8); }
.ativacao__cartao h1 { font-size: 24px; font-weight: 800; letter-spacing: -0.03em; }
.ativacao__texto { margin: 6px 0 22px; color: var(--texto-2); }

.ativacao__rodape {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin-top: 16px;
  font-size: 12.5px;
  color: var(--texto-3);
  text-align: center;
}

.ativacao__rodape .icone { width: 15px; height: 15px; }

.ativacao__palco { display: grid; place-items: center; width: 100%; }

.ativacao__aviso {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: -8px 0 18px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--vermelho-texto);
  background: var(--vermelho-suave);
}
.ativacao__aviso.is-ok { color: var(--verde-texto); background: var(--verde-suave); }
.ativacao__aviso .icone { flex-shrink: 0; width: 18px; height: 18px; margin-top: 1px; }

.ativacao__link {
  display: block;
  margin: 14px auto 0;
  padding: 6px 10px;
  font: inherit;
  font-size: 14px;
  font-weight: 600;
  color: var(--azul-texto);
  text-align: center;
  text-decoration: none;
  background: none;
  border: 0;
  border-radius: 8px;
  cursor: pointer;
}
.ativacao__link:hover { text-decoration: underline; }
.ativacao__link:focus-visible { outline: 2px solid var(--azul); outline-offset: 2px; }

.ativacao__senha input { letter-spacing: 0.3em; font-variant-numeric: tabular-nums; }
.ativacao__senha input::placeholder { letter-spacing: normal; }

.ativacao__carregando { text-align: center; color: var(--texto-2); }
.ativacao__icone-ok { display: inline-grid; place-items: center; width: 56px; height: 56px; margin-bottom: 18px; border-radius: 16px; color: var(--verde-texto); background: var(--verde-suave); }
.ativacao__icone-ok .icone { width: 28px; height: 28px; }

.ativacao__admin {
  position: fixed;
  left: max(12px, env(safe-area-inset-left));
  bottom: max(12px, env(safe-area-inset-bottom));
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: var(--texto-3);
  opacity: 0.35;
  transition: opacity 0.2s, background-color 0.2s;
}
.ativacao__admin:hover, .ativacao__admin:focus-visible { opacity: 1; background: var(--superficie-2); }
.ativacao__admin .icone { width: 16px; height: 16px; }

/* ---------- Painel do administrador ---------- */

.admin { max-width: 1180px; margin: 0 auto; padding: 20px 16px 48px; }
.admin__topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 20px; }
.admin__topo .marca { padding: 0; }
.admin__topo-acoes { display: flex; flex-wrap: wrap; gap: 8px; }

.admin__resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 16px; }
.admin-numero { padding: 16px 18px; background: var(--superficie); border: 1px solid var(--borda); border-radius: var(--raio-lg); }
.admin-numero span { display: block; font-size: 13px; color: var(--texto-2); }
.admin-numero strong { display: block; margin-top: 4px; font-size: 26px; font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }

.admin__grade { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); align-items: start; gap: 16px; margin-bottom: 16px; }
.admin__grade .cartao + .cartao { margin-top: 0; }

.admin-fieldset { min-width: 0; margin: 0 0 18px; padding: 0; border: 0; }
.admin-fieldset legend { margin-bottom: 7px; padding: 0; }
.admin-opcoes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 8px; }
.admin-opcoes label { position: relative; }
.admin-opcoes input { position: absolute; inset: 0; opacity: 0; }
.admin-opcoes span {
  display: grid;
  place-items: center;
  min-height: 44px;
  padding: 0 6px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--texto-2);
  text-align: center;
  background: var(--campo);
  border: 1px solid var(--borda-forte);
  border-radius: 12px;
  cursor: pointer;
  transition: color 0.2s, border-color 0.2s, background-color 0.2s;
}
.admin-opcoes input:checked + span { color: var(--azul-texto); background: var(--azul-suave); border-color: var(--azul); }
.admin-opcoes input:focus-visible + span { box-shadow: var(--foco); }
@media (max-width: 480px) { .admin-opcoes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

.admin-check { display: flex; align-items: center; gap: 10px; margin: 0 0 18px; font-size: 14px; color: var(--texto-2); cursor: pointer; }
.admin-check input { width: 18px; height: 18px; accent-color: var(--azul); }

.admin-status { display: grid; gap: 12px; margin: 0 0 18px; padding: 0; list-style: none; }
.admin-status li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 6px 12px; font-size: 14px; }
.admin-status li > span:first-child { color: var(--texto-2); }
.admin-status__valor { text-align: right; }
.admin-url { display: flex; align-items: flex-start; gap: 8px; }
.admin-url .codigo { flex: 1; min-width: 0; margin: 0; word-break: break-all; }
.admin-acoes { display: flex; flex-wrap: wrap; gap: 8px; }

.admin-contas__filtros { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 14px; }
.admin-contas__filtros .entrada { flex: 1 1 220px; }
.admin-contas__filtros .entrada--select { flex: 0 1 190px; }
.admin .tabela { min-width: 780px; }
.admin-cliente strong { display: block; font-weight: 600; }
.admin-cliente span { font-size: 12.5px; color: var(--texto-3); }
.admin-vazio { padding: 28px 12px; color: var(--texto-3); text-align: center; }

.dialogo--largo .dialogo__corpo { max-height: min(72vh, 720px); overflow-y: auto; }
.admin-dados { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px 16px; margin: 16px 0 4px; }
.admin-dados dt { font-size: 12.5px; color: var(--texto-3); }
.admin-dados dd { margin: 2px 0 0; font-size: 14.5px; font-weight: 600; }
.admin-secao { margin-top: 20px; }
.admin-secao h3 { margin-bottom: 8px; font-size: 14px; font-weight: 700; }
.admin-secao .campo__ajuda { margin-bottom: 10px; }
.admin-dialogo__acoes { flex-wrap: wrap; }
.admin-dialogo__acoes .admin-espaco { flex: 1; }
.admin-senha {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  margin: 14px 0;
  padding: 16px;
  font-size: 30px;
  font-weight: 800;
  letter-spacing: 0.25em;
  font-variant-numeric: tabular-nums;
  background: var(--superficie-2);
  border-radius: 14px;
}
.admin-login__selo { display: inline-grid; place-items: center; width: 56px; height: 56px; margin-bottom: 18px; border-radius: 16px; color: var(--azul-texto); background: var(--azul-suave); }
.admin-login__selo .icone { width: 26px; height: 26px; }

/* ---------- Início ---------- */

.destaque-inicio {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 28px;
  overflow: hidden;
  color: inherit;
  text-decoration: none;
  background:
    radial-gradient(600px 240px at 0% 0%, rgba(47, 123, 255, 0.22), transparent 70%),
    radial-gradient(500px 260px at 100% 100%, rgba(139, 92, 246, 0.16), transparent 70%),
    var(--superficie);
  border: 1px solid rgba(47, 123, 255, 0.3);
  border-radius: 22px;
  transition: border-color 0.2s, transform 0.25s var(--curva);
}

.destaque-inicio:hover { border-color: rgba(47, 123, 255, 0.55); transform: translateY(-2px); }
.destaque-inicio__texto { display: grid; gap: 6px; max-width: 560px; }

.destaque-inicio__selo {
  display: inline-flex;
  align-items: center;
  justify-self: start;
  gap: 6px;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 650;
  color: var(--azul-texto);
  background: var(--azul-suave);
}

.destaque-inicio__selo .icone { width: 14px; height: 14px; }
.destaque-inicio__titulo { font-size: clamp(20px, 2.4vw, 25px); font-weight: 800; letter-spacing: -0.025em; line-height: 1.2; }
.destaque-inicio__desc { font-size: 14.5px; color: var(--texto-2); }

.continuar {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  padding: 14px 16px;
  color: inherit;
  text-decoration: none;
  background: var(--superficie);
  border: 1px dashed var(--borda-forte);
  border-radius: 14px;
  transition: border-color 0.2s;
}

.continuar:hover { border-color: var(--azul); }
.continuar__icone { display: grid; flex-shrink: 0; place-items: center; width: 38px; height: 38px; border-radius: 11px; background: var(--azul-suave); color: var(--azul-texto); }
.continuar__texto { display: grid; flex: 1; min-width: 0; }
.continuar__texto strong { font-size: 14.5px; }
.continuar__texto span { overflow: hidden; font-size: 13px; color: var(--texto-2); text-overflow: ellipsis; white-space: nowrap; }
.continuar > .icone:last-child { color: var(--texto-3); }

/* ---------- Ferramentas ---------- */

.grade-ferramentas { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.grade-ferramentas--secundaria { margin-top: 12px; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); }

.ferramenta {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  padding: 16px;
  color: inherit;
  text-decoration: none;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 16px;
  transition: border-color 0.2s, transform 0.25s var(--curva);
}

.ferramenta:hover { border-color: rgba(47, 123, 255, 0.42); transform: translateY(-2px); }
.ferramenta--compacta { align-items: center; padding: 12px 14px; }
.ferramenta__icone { display: grid; flex-shrink: 0; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--azul-suave); color: var(--azul-texto); }
.ferramenta__titulo { display: block; font-size: 15px; font-weight: 650; }
.ferramenta__desc { display: block; margin-top: 2px; font-size: 13px; line-height: 1.45; color: var(--texto-2); }

/* ---------- Precificar ---------- */

.precificar { display: grid; gap: 16px; grid-template-areas: "form" "resultado" "simuladores"; }
.precificar__form { grid-area: form; min-width: 0; }
.precificar__resultado { grid-area: resultado; min-width: 0; }
.precificar__simuladores { grid-area: simuladores; min-width: 0; margin-top: 8px; }

@container (min-width: 880px) {
  .precificar {
    grid-template-columns: minmax(0, 1fr) minmax(360px, 420px);
    grid-template-areas: "form resultado" "simuladores resultado";
    align-items: start;
    column-gap: 24px;
  }

  .precificar__resultado { position: sticky; top: 24px; }
}

.painel-preco,
.painel-resultado { position: relative; overflow: hidden; scroll-margin-top: 80px; }

.painel-preco::before,
.painel-resultado::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 200px;
  background: radial-gradient(420px 190px at 50% -45%, rgba(47, 123, 255, 0.24), transparent 70%);
  pointer-events: none;
}

.painel-preco > *,
.painel-resultado > * { position: relative; }

.painel-vazio { display: grid; justify-items: center; gap: 6px; padding: 32px 12px; text-align: center; }
.painel-vazio h2 { font-size: 17px; }
.painel-vazio p { font-size: 14px; color: var(--texto-2); }
.painel-invalido__titulo { margin-bottom: 12px; font-size: 17px; }

.painel-preco__rotulo,
.painel-resultado__rotulo { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; color: var(--texto-2); }

.preco-destaque,
.valor-destaque {
  margin: 2px 0 6px;
  font-size: clamp(34px, 5vw, 46px);
  font-weight: 800;
  line-height: 1.08;
  letter-spacing: -0.035em;
  background: linear-gradient(135deg, #ffffff 0%, #b9d1ff 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  overflow-wrap: anywhere;
}

[data-theme="claro"] .preco-destaque,
[data-theme="claro"] .valor-destaque { background-image: linear-gradient(135deg, #0b1528 0%, #1d5fd6 100%); }

.valor-destaque.cor-verde,
.valor-destaque.cor-vermelho { background: none; }
.valor-destaque.cor-verde { color: var(--verde-texto); }
.valor-destaque.cor-vermelho { color: var(--vermelho-texto); }

.painel-preco__frase,
.painel-resultado__frase { margin-bottom: 16px; font-size: 14px; line-height: 1.5; color: var(--texto-2); }

.vitrine {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
  padding: 10px 12px 10px 14px;
  background: var(--azul-suave);
  border: 1px solid rgba(47, 123, 255, 0.22);
  border-radius: 12px;
}

.vitrine__info { display: grid; gap: 1px; min-width: 0; }
.vitrine__rotulo { display: flex; align-items: center; gap: 2px; font-size: 12px; font-weight: 500; color: var(--texto-2); }
.vitrine strong { font-size: 16px; font-weight: 750; }
.vitrine__ganho { font-size: 12px; font-weight: 600; color: var(--verde-texto); }

.kpis--painel { grid-template-columns: repeat(2, minmax(0, 1fr)); }

.saude-margem {
  margin-top: 14px;
  padding: 14px 16px;
  background: var(--superficie-2);
  border: 1px solid var(--borda);
  border-radius: 14px;
}

.saude-margem__topo { display: flex; align-items: center; justify-content: space-between; font-size: 12.5px; font-weight: 500; color: var(--texto-2); }
.composicao { margin-top: 20px; }
.painel-preco .insights,
.painel-resultado .insights { margin-top: 16px; }
.painel-preco__salvar { margin-top: 18px; }

.resumo-taxas {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  margin-top: 16px;
  padding: 10px 12px;
  background: var(--superficie-2);
  border-radius: 10px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--texto-2);
}

.resumo-taxas .icone { width: 16px; height: 16px; margin-top: 2px; color: var(--azul-texto); }
.resumo-taxas a { font-weight: 600; }
.nota-canal { margin-top: 4px; }

.gastos { display: grid; gap: 8px; margin-bottom: 10px; }
.gastos:empty { display: none; }

.gasto {
  display: grid;
  grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr) 40px;
  align-items: center;
  gap: 8px;
  animation: entrar 0.25s var(--curva);
}

.gasto__remover { color: var(--texto-3); }
.gasto__remover:hover { color: var(--vermelho-texto); background: var(--vermelho-suave); }

.barra-resultado { display: none; }

@keyframes subir {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: none; }
}

/* ---------- Simuladores ---------- */

.simulador { display: grid; gap: 16px; grid-template-areas: "form" "resultado" "extra"; }
.simulador__form { grid-area: form; min-width: 0; }
.simulador__form > .cartao + .cartao { margin-top: 16px; }
.simulador__resultado { grid-area: resultado; min-width: 0; }
.simulador__extra { grid-area: extra; min-width: 0; margin-top: 8px; }

@container (min-width: 820px) {
  .simulador {
    grid-template-columns: minmax(0, 1fr) minmax(340px, 440px);
    grid-template-areas: "form resultado" "extra extra";
    align-items: start;
    column-gap: 24px;
  }

  .simulador__resultado { position: sticky; top: 24px; }
}

.simulador__form.cartao + .cartao { margin-top: 0; }
.bloco-simulacao { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--borda); }
.tabela--clicavel tbody tr { cursor: pointer; }
.tabela--clicavel tbody tr:hover td { background: var(--superficie-2); }
.tabela--clicavel tbody tr:focus-visible { outline: 2px solid var(--azul); outline-offset: -2px; }

/* ---------- Produtos ---------- */

.filtros { display: grid; grid-template-columns: minmax(0, 1fr) 210px 220px; gap: 10px; margin-bottom: 18px; }
.entrada__icone { margin-left: 14px; color: var(--texto-3); }
.filtros__busca input { padding-left: 10px; }
#pr-insight { margin-bottom: 16px; }

.grade-produtos { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 14px; }

.produto {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding: 18px;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 18px;
  transition: border-color 0.2s, box-shadow 0.25s;
  animation: entrar 0.3s var(--curva) both;
}

.produto:hover { border-color: var(--borda-forte); box-shadow: var(--sombra-elevada); }
.produto__topo { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.produto__identidade { min-width: 0; }
.produto__nome { font-size: 16px; font-weight: 700; overflow-wrap: anywhere; }
.produto__categoria { font-size: 12.5px; color: var(--texto-3); }
.produto__preco { display: grid; }
.produto__preco span { font-size: 12px; font-weight: 500; color: var(--texto-3); }
.produto__preco strong { font-size: 26px; font-weight: 800; letter-spacing: -0.03em; }

.produto__numeros {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin: 0;
  padding: 12px;
  background: var(--superficie-2);
  border-radius: 12px;
}

.produto__numeros dt { font-size: 11.5px; font-weight: 500; color: var(--texto-3); }
.produto__numeros dd { margin: 2px 0 0; font-size: 14.5px; font-weight: 650; overflow-wrap: anywhere; }
.produto__aviso { display: flex; align-items: flex-start; gap: 6px; font-size: 12px; line-height: 1.4; color: var(--texto-3); }
.produto__aviso .icone { width: 14px; height: 14px; margin-top: 1px; }

.produto__acoes {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: auto;
  padding-top: 12px;
  border-top: 1px solid var(--borda);
}

.produto__acoes-icones { display: flex; gap: 2px; }

.formulario-produto,
.formulario-orcamento { max-width: 720px; }

.info-produto {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 18px;
  padding: 14px;
  background: var(--azul-suave);
  border: 1px solid rgba(47, 123, 255, 0.22);
  border-radius: 14px;
}

.info-produto > div { display: grid; }
.info-produto span { display: flex; align-items: center; font-size: 12px; color: var(--texto-2); }
.info-produto strong { font-size: 17px; font-weight: 750; }
.info-produto__nota { display: flex; flex-wrap: wrap; grid-column: 1 / -1; align-items: center; gap: 8px; font-size: 12.5px; color: var(--texto-2); }

/* ---------- Orçamentos ---------- */

.bloco-itens { margin-top: 20px; padding-top: 20px; border-top: 1px solid var(--borda); }
.adicionar-item { display: grid; grid-template-columns: minmax(0, 1fr) 90px auto; gap: 8px; margin-bottom: 10px; }
#or-avulso { grid-template-columns: minmax(0, 1fr) 140px auto; margin-top: 10px; }
.total-orcamento { display: flex; flex-direction: column; align-items: flex-end; justify-content: flex-end; padding-bottom: 4px; }
.total-orcamento span { font-size: 13px; color: var(--texto-2); }
.total-orcamento strong { font-size: 28px; font-weight: 800; letter-spacing: -0.03em; }

/* ---------- Nota promissória ---------- */

.abas {
  display: flex;
  gap: 4px;
  margin-bottom: 20px;
  padding: 4px;
  overflow-x: auto;
  background: var(--superficie);
  border: 1px solid var(--borda);
  border-radius: 14px;
}

.abas__item {
  display: inline-flex;
  flex: 1;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 42px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: transparent;
  color: var(--texto-2);
  font-size: 14px;
  font-weight: 600;
  white-space: nowrap;
  transition: background-color 0.18s, color 0.18s;
}

.abas__item .icone { width: 17px; height: 17px; }
.abas__item:hover { color: var(--texto); }
.abas__item[aria-selected="true"] { color: var(--texto); background: var(--superficie-3); }
[data-theme="claro"] .abas__item[aria-selected="true"] { background: var(--azul-suave); }

.abas__contador {
  min-width: 20px;
  height: 20px;
  padding: 0 6px;
  border-radius: 999px;
  background: var(--azul-suave);
  color: var(--azul-texto);
  font-size: 11.5px;
  line-height: 20px;
}

.abas__contador:empty { display: none; }

.etapas { display: grid; grid-template-columns: repeat(4, 1fr); gap: 6px; margin: 0 0 16px; padding: 0; list-style: none; }
.etapas li { display: flex; flex-direction: column; gap: 8px; font-size: 12.5px; font-weight: 600; color: var(--texto-3); }
.etapas li::before { content: ""; height: 4px; border-radius: 999px; background: var(--superficie-3); transition: background 0.3s; }
.etapas li span { display: none; }
.etapas li.is-feita { color: var(--texto-2); }
.etapas li.is-feita::before { background: var(--azul); }
.etapas li.is-atual { color: var(--texto); }
.etapas li.is-atual::before { background: var(--gradiente); }

.extenso-previa {
  margin: -6px 0 18px;
  padding: 10px 12px;
  background: var(--superficie-2);
  border-radius: 10px;
  font-size: 13.5px;
  font-style: italic;
  color: var(--texto-2);
}

.extenso-previa:empty { display: none; }

.bloco-avalista { margin-bottom: 12px; padding: 14px; background: var(--superficie-2); border: 1px solid var(--borda); border-radius: 14px; }
.bloco-avalista__topo { display: flex; align-items: center; justify-content: space-between; margin-bottom: 10px; }

.navegacao-etapas { display: flex; justify-content: space-between; gap: 10px; margin-top: 16px; }
.navegacao-etapas #np-avancar { margin-left: auto; }

.nota-previa-rolagem { margin: 0 -4px; padding: 4px; overflow-x: auto; }

.nota-previa {
  display: grid;
  grid-template-columns: 64px minmax(0, 1fr);
  gap: 8px;
  min-width: 560px;
  padding: 10px;
  background: #fff;
  border: 1px solid #cbd5e1;
  border-radius: 14px;
  color: #0f172a;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 12.5px;
}

.np-canhoto {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  padding: 10px 0;
  background: #fdf9e2;
  border: 1px solid #94a3b8;
  border-radius: 8px;
  writing-mode: vertical-rl;
  transform: rotate(180deg);
}

.np-canhoto__titulo { font-weight: 800; letter-spacing: 0.04em; }
.np-canhoto__brasao { font-size: 10px; font-weight: 700; color: #b8961c; }

.np-corpo {
  display: grid;
  gap: 9px;
  padding: 12px 14px;
  background: repeating-linear-gradient(#fdf9e2 0 5px, #f6eec4 5px 6px);
  border: 1px solid #94a3b8;
  border-radius: 8px;
}

.np-linha { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px; }
.np-rotulo { white-space: nowrap; }
.np-rotulo--forte { font-size: 15px; font-weight: 800; }
.np-valor { flex: 1; min-width: 80px; padding: 0 4px; border-bottom: 1px dotted #64748b; font-weight: 700; }
.np-caixa { padding: 3px 10px; background: #eceff4; border: 1px solid #78839a; border-radius: 6px; font-weight: 700; }
.np-caixa--numero { min-width: 50px; text-align: center; }
.np-caixa--valor { min-width: 110px; margin-left: auto; text-align: right; }
.np-caixa--extenso { flex: 1; }
.np-valor--assinatura { color: #64748b; font-style: italic; font-weight: 400; }
.np-avalistas { grid-column: 1 / -1; padding: 8px 4px 0; font-size: 12px; }
.np-avalistas p { margin: 2px 0; }
.np-rodape { grid-column: 1 / -1; padding: 0 4px; font-size: 11.5px; color: #475569; }

.quadros { display: grid; gap: 14px; margin-bottom: 18px; }

.quadro-assinatura {
  padding: 14px;
  background: var(--superficie-2);
  border: 1px solid var(--borda-forte);
  border-radius: 16px;
  transition: border-color 0.25s;
}

.quadro-assinatura.is-assinado { border-color: rgba(34, 197, 94, 0.45); }
.quadro-assinatura__topo { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 10px; }
.quadro-assinatura__topo > span:first-child { display: grid; font-size: 14px; }
.quadro-assinatura__topo .texto-3 { font-size: 12px; }

.quadro-assinatura__area {
  position: relative;
  height: 190px;
  overflow: hidden;
  background: #fff;
  border: 1px dashed #94a3b8;
  border-radius: 12px;
  touch-action: none;
}

.quadro-assinatura__area canvas { position: absolute; inset: 0; width: 100%; height: 100%; cursor: crosshair; touch-action: none; }
.quadro-assinatura__linha { position: absolute; left: 24px; right: 24px; bottom: 44px; height: 1px; background: #cbd5e1; pointer-events: none; }
.quadro-assinatura__guia { position: absolute; left: 24px; bottom: 22px; font-size: 12px; color: #64748b; pointer-events: none; transition: opacity 0.2s; }
.quadro-assinatura.is-assinado .quadro-assinatura__guia { opacity: 0; }
.quadro-assinatura__acoes { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; margin-top: 8px; }
.so-celular { display: none; }

.aceite {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 14px;
  background: var(--superficie-2);
  border-radius: 12px;
  font-size: 14px;
  line-height: 1.45;
  color: var(--texto-2);
  cursor: pointer;
}

.aceite input { flex-shrink: 0; width: 20px; height: 20px; margin: 1px 0 0; accent-color: var(--azul); }
#np-assinar-erro { margin-top: 10px; }

.nota-pronta { padding: 32px 24px; text-align: center; }

.nota-pronta__icone {
  display: grid;
  place-items: center;
  width: 64px;
  height: 64px;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: var(--verde-suave);
  color: var(--verde-texto);
  animation: aparecer 0.6s var(--curva) both;
}

.nota-pronta__icone .icone { width: 32px; height: 32px; stroke-width: 2.5; }

@keyframes aparecer {
  0% { opacity: 0; transform: scale(0.6); }
  70% { opacity: 1; transform: scale(1.06); }
  100% { transform: scale(1); }
}

.nota-pronta h2 { font-size: 22px; font-weight: 800; outline: none; }
.nota-pronta > p { margin-top: 6px; }
.nota-pronta__acoes { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.copia-email { margin-top: 22px; padding: 16px; background: var(--superficie-2); border-radius: 14px; text-align: left; }
.copia-email__linha { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; }

.codigo-bloco {
  display: grid;
  justify-items: start;
  gap: 8px;
  margin-top: 14px;
  padding: 16px;
  border: 1px solid var(--borda);
  border-radius: 14px;
  text-align: left;
}

.codigo-bloco__rotulo { display: flex; align-items: center; gap: 4px; font-size: 13px; font-weight: 600; }

.codigo {
  display: block;
  width: 100%;
  padding: 10px 12px;
  background: var(--campo);
  border: 1px solid var(--borda);
  border-radius: 10px;
  color: var(--texto);
  font-family: ui-monospace, "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: 12.5px;
  line-height: 1.5;
  overflow-wrap: anywhere;
  word-break: break-all;
}

dd.codigo { padding: 6px 8px; font-size: 11.5px; }
.codigo-entrada { font-family: ui-monospace, Consolas, "Liberation Mono", monospace; font-size: 13px; }
.nota-pronta__rodape { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px; }

.dialogo--largo { width: min(640px, calc(100vw - 32px)); }
.registro { display: grid; gap: 10px; margin: 16px 0 0; }
.registro > div { display: grid; grid-template-columns: 170px minmax(0, 1fr); gap: 10px; }
.registro dt { font-size: 12.5px; font-weight: 600; color: var(--texto-3); }
.registro dd { margin: 0; font-size: 14px; overflow-wrap: anywhere; }

.linha-do-tempo { display: grid; gap: 12px; margin: 8px 0 0; padding: 0 0 0 18px; list-style: none; border-left: 2px solid var(--borda-forte); }
.linha-do-tempo li { position: relative; display: grid; font-size: 14px; }

.linha-do-tempo li::before {
  content: "";
  position: absolute;
  left: -24px;
  top: 5px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: var(--azul);
  box-shadow: 0 0 0 3px var(--superficie);
}

.linha-do-tempo span { font-size: 12.5px; color: var(--texto-3); }

/* ---------- Página pública de verificação ---------- */

.pagina-verificar { max-width: 620px; margin: 0 auto; padding: 32px 16px 48px; }
.pagina-verificar .marca { padding: 0 0 20px; }
.pagina-verificar h1 { margin: 4px 0 8px; font-size: clamp(22px, 4vw, 28px); font-weight: 800; }
.pagina-verificar .sobretitulo { display: flex; align-items: center; gap: 6px; }
.pagina-verificar__rodape { margin-top: 16px; font-size: 13px; line-height: 1.55; }

/* ---------- Tablet e celular ---------- */

@media (hover: none) {
  .ferramenta:hover,
  .destaque-inicio:hover { transform: none; }
  .produto:hover { box-shadow: none; }
}

@media (max-width: 900px) {
  .barra-resultado:not([hidden]) {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(74px + env(safe-area-inset-bottom));
    z-index: 44;
    display: flex;
    align-items: center;
    gap: 18px;
    padding: 10px 16px;
    background: var(--bg-elevado);
    border: 1px solid rgba(47, 123, 255, 0.38);
    border-radius: 16px;
    box-shadow: var(--sombra-elevada);
    color: var(--texto);
    text-align: left;
    animation: subir 0.3s var(--curva) both;
  }

  .barra-resultado span { display: grid; line-height: 1.2; }
  .barra-resultado small { font-size: 11px; font-weight: 600; color: var(--texto-3); }
  .barra-resultado strong { font-size: 17px; font-weight: 750; }
  .barra-resultado .icone { margin-left: auto; color: var(--texto-3); }
}

@media (max-width: 760px) {
  .filtros { grid-template-columns: 1fr 1fr; }
  .filtros__busca { grid-column: 1 / -1; }
}

@media (max-width: 700px) {
  .destaque-inicio { flex-direction: column; align-items: stretch; padding: 22px 20px; }
  .destaque-inicio .btn { width: 100%; }
}

@media (max-width: 600px) {
  .acoes-cabecalho { width: 100%; }
  .acoes-cabecalho .btn { flex: 1; }
  .acoes-formulario .btn { flex: 1; }
  .salvar-historico { grid-template-columns: 1fr; }
  .linha-campos--3 { grid-template-columns: 1fr; }

  .item-lista--cartao { flex-wrap: wrap; }
  .item-lista--cartao .item-lista__acoes { justify-content: flex-end; width: 100%; padding-top: 8px; border-top: 1px solid var(--borda); }

  .grade-ferramentas { grid-template-columns: 1fr; gap: 8px; }
  .grade-ferramentas--secundaria { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ferramenta--compacta { flex-direction: column; gap: 6px; padding: 12px 8px; text-align: center; }
  .ferramenta--compacta .ferramenta__titulo { font-size: 13px; }

  .kpis--painel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .painel-preco { padding: 20px 16px; }
  .grade-produtos { grid-template-columns: 1fr; }
  .info-produto { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  .adicionar-item,
  #or-avulso { grid-template-columns: 1fr 1fr; }
  .adicionar-item > :first-child { grid-column: 1 / -1; }

  .navegacao-etapas .btn--grande { flex: 1; }
  .so-celular { display: inline; }
  .nota-pronta { padding: 26px 16px; }
  .nota-pronta__acoes .btn { width: 100%; }
  .copia-email__linha { grid-template-columns: 1fr; }
  .registro > div { grid-template-columns: 1fr; gap: 2px; }
}

@media (max-width: 480px) {
  .gasto { grid-template-columns: minmax(0, 1fr) 44px; }
  .gasto__nome { grid-column: 1 / -1; }
  .abas__item { gap: 6px; padding: 0 8px; font-size: 13px; }
  .abas__item .icone { display: none; }
  .etapas li { font-size: 11px; }
  .produto__numeros dd { font-size: 13.5px; }
}

@media (max-width: 360px) {
  .segmentado label .icone { display: none; }
}

.chip { text-align: left; }

@media (max-width: 900px) and (orientation: landscape) {
  .quadro-assinatura__area { height: 56vh; }
}

/* ---------- Impressão (orçamentos e histórico) ---------- */

.area-impressao { display: none; }

.impressao__cabecalho {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 2px solid #0f172a;
}

.impressao__empresa h2 { margin: 0 0 4px; font-size: 20px; }
.impressao__empresa p,
.impressao__titulo p { margin: 1px 0; font-size: 12.5px; color: #475569; }
.impressao__titulo { text-align: right; }
.impressao__titulo h3 { margin: 0; font-size: 18px; }
.impressao__tabela { width: 100%; margin: 16px 0; border-collapse: collapse; font-size: 13px; }
.impressao__tabela th,
.impressao__tabela td { padding: 8px 10px; border-bottom: 1px solid #cbd5e1; text-align: left; }
.impressao__tabela th { background: #f1f5f9; }
.impressao__tabela .num { text-align: right; }
.impressao__resumo { text-align: right; color: #475569; }
.impressao__total { font-size: 20px; font-weight: 800; text-align: right; }

@media print {
  @page { margin: 16mm; }
  body { background: #fff !important; color: #0f172a !important; }
  body::before,
  .app,
  #tela-ativacao,
  .toasts,
  .dica-balao,
  dialog,
  .pular-conteudo { display: none !important; }
  .area-impressao { display: block !important; font-family: Inter, Arial, sans-serif; }
  .impressao__tabela tr { break-inside: avoid; }
}