/* YES B2B — CSS fixo. Só usa as variáveis de /tema.css (§13.3): nenhuma cor de marca aqui. */
html, body { font-family: var(--marca-fonte); background: var(--marca-fundo); color: #222; }
body { font-weight: 400; }
h1, h2, h3, h4 { font-weight: 700; color: var(--marca-primaria); }
h1 { font-size: 1.6rem; }
a { color: var(--marca-primaria); }

.app { display: flex; min-height: 100vh; }
.lateral { width: 240px; flex: 0 0 240px; background: var(--marca-primaria); color: #fff; display: flex; flex-direction: column; padding: 1.25rem 0; }
.lateral-logo { display: block; padding: 0 1.25rem 1.5rem; }
.lateral-logo img { width: 100%; max-width: 200px; height: auto; }
.lateral .nav-link { color: #fff; padding: .7rem 1.25rem; font-weight: 500; border-left: 4px solid transparent; }
.lateral .nav-link:hover, .lateral .nav-link:focus { background: var(--marca-escura); color: #fff; }
.lateral .nav-link.active { background: var(--marca-escura); border-left-color: var(--marca-acento); color: #fff; }
.lateral-rodape { margin-top: auto; padding: 1rem 1.25rem 0; font-size: .75rem; opacity: .75; }
.conteudo { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.topo { display: flex; justify-content: space-between; align-items: center; padding: .6rem 1.5rem; background: #fff; border-bottom: 1px solid #e6e2ea; font-size: .85rem; }
.topo .versao { color: #6E5A7A; }
.topo .btn-link { color: var(--marca-primaria); padding: 0 0 0 .5rem; vertical-align: baseline; }
.principal { padding: 1.5rem; max-width: 1200px; width: 100%; }

@media (max-width: 767px) {
  .app { flex-direction: column; }
  .lateral { width: 100%; flex: none; padding: .75rem 0; }
  .lateral-logo { padding: 0 1rem .5rem; }
  .lateral-logo img { max-width: 150px; }
  .lateral .nav { flex-direction: row !important; flex-wrap: wrap; }
  .lateral-rodape { display: none; }
  .principal { padding: 1rem; }
}

/* Acesso (login, cadastro, senha) */
body.acesso { display: flex; align-items: center; justify-content: center; min-height: 100vh; padding: 1rem; }
.cartao-acesso { background: #fff; border-radius: 12px; padding: 2rem; width: 100%; max-width: 440px; box-shadow: 0 6px 28px rgba(60, 16, 83, .10); }
.logo-acesso { display: block; width: 240px; max-width: 100%; height: auto; margin: 0 auto 1.5rem; }
.cartao-acesso .versao { font-size: .75rem; color: #6E5A7A; }

.cartao { background: #fff; border-radius: 10px; padding: 1.25rem 1.5rem; box-shadow: 0 2px 10px rgba(60, 16, 83, .06); margin-bottom: 1.25rem; }
.form-label { font-weight: 500; }
.ajuda { font-size: .85rem; color: #6E5A7A; }

/* Proposta (como orcamento.php / proposta.php do Manager) */
.tabela-proposta { width: 100%; background: #fff; border-collapse: collapse; font-size: .92rem; }
.tabela-proposta th { background: var(--marca-primaria); color: #fff; font-weight: 500; padding: .45rem .6rem; text-align: left; }
.tabela-proposta td { padding: .4rem .6rem; border-bottom: 1px solid #eee9f1; vertical-align: top; }
.tabela-proposta .num { text-align: right; white-space: nowrap; }
.tabela-proposta tr.secao td { background: #efe8f5; color: var(--marca-escura); font-weight: 700; }
.tabela-proposta tr.subtotal td { font-weight: 700; }
.tabela-proposta tr.total td { font-weight: 700; font-size: 1.05rem; border-top: 2px solid var(--marca-primaria); }
.premissa { display: block; font-style: italic; font-size: .82rem; color: #6E5A7A; }
.faixa { border-radius: 8px; padding: .75rem 1rem; margin-bottom: 1rem; }
.faixa-conferencia { background: #f6eefc; border: 1px solid var(--marca-acento); }
.faixa-substituida { background: #f1f1f1; border: 1px solid #ccc; }
.etapas { list-style: none; padding: 0; }
.etapas li { padding: .25rem 0; color: #999; }
.etapas li.feita { color: var(--marca-ok); }
.etapas li.atual { color: var(--marca-primaria); font-weight: 700; }
.badge-estado { font-weight: 500; }
.lista-anexos { font-size: .9rem; }
.text-erro { color: var(--marca-erro); }
.mono { font-family: ui-monospace, Menlo, monospace; font-size: .85rem; }

/* Combo de local: use-bootstrap-select com o tema */
.use-bootstrap-select .dropdown-item.active, .use-bootstrap-select .dropdown-item:active { background: var(--marca-primaria); }

/* Celular (intl-tel-input) com a largura dos outros campos */
.iti { width: 100%; display: block; }
.texto-livre { white-space: pre-wrap; }
.campo-qtd { width: 6em; }