/* Plenus SEGURALTA — cores tiradas do logo: laranja + grafite quase preto sobre branco. */
:root {
  --laranja: #e8641e;
  --laranja-hover: #cf5316;
  --laranja-fraco: #fdece1;
  --grafite: #2b2b2b;
  --grafite-2: #242424;
  --grafite-3: #363636;
  --branco: #ffffff;
  --fundo: #f4f5f6;
  --linha: #e3e5e8;
  --texto: #23262a;
  --texto-suave: #6a7075;
  --texto-inv: #e9eaec;
  --texto-inv-suave: #9aa0a6;
  --ok: #1f8a4c;
  --erro: #d1453d;
  --erro-fraco: #fbe9e8;
  --ok-fraco: #e6f4ec;
  --aviso: #9a6a00;
  --aviso-fraco: #fdf1d6;
  --raio: 9px;
  --sombra: 0 1px 2px rgba(20, 22, 26, .07), 0 1px 1px rgba(20, 22, 26, .05);
  --barra-larga: 236px;
  --barra-estreita: 64px;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html, body { margin: 0; height: 100%; }
body {
  background: var(--fundo); color: var(--texto);
  font-family: "Segoe UI", system-ui, -apple-system, Roboto, Arial, sans-serif;
  font-size: 14px; line-height: 1.5;
}
a { color: inherit; text-decoration: none; }

/* ---------- layout ---------- */
.app { display: grid; grid-template-columns: var(--barra-larga) 1fr; min-height: 100%; }
.app.recolhido { grid-template-columns: var(--barra-estreita) 1fr; }

.conteudo { min-width: 0; display: flex; flex-direction: column; }

/* ---------- barra lateral ---------- */
.barra {
  background: var(--grafite); color: var(--texto-inv);
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
}
.barra__topo {
  display: flex; align-items: center; justify-content: space-between;
  gap: 8px; padding: 16px 14px; border-bottom: 1px solid rgba(255, 255, 255, .08);
}
.marca { display: flex; align-items: center; gap: 9px; min-width: 0; }
.marca__pico { flex: 0 0 auto; display: block; width: 22px; height: 22px; }
.marca__nome { display: flex; flex-direction: column; line-height: 1.1; font-weight: 800; letter-spacing: .06em; font-size: 15px; white-space: nowrap; }
.marca__sub { font-weight: 600; font-size: 9px; letter-spacing: .16em; color: var(--texto-inv-suave); margin-top: 2px; }
.barra__fechar { display: none; }

.nav { padding: 8px 8px; display: flex; flex-direction: column; gap: 1px; overflow-y: auto; flex: 1;
  scrollbar-width: thin; scrollbar-color: rgba(255, 255, 255, .16) transparent; }
.nav::-webkit-scrollbar { width: 6px; }
.nav::-webkit-scrollbar-track { background: transparent; }
.nav::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .14); border-radius: 3px; }
.nav:hover::-webkit-scrollbar-thumb { background: rgba(255, 255, 255, .24); }
.nav__item, .barra__recolher {
  display: flex; align-items: center; gap: 12px;
  padding: 7px 12px; border-radius: var(--raio); color: var(--texto-inv-suave);
  font-size: 13.5px; font-weight: 600; white-space: nowrap; cursor: pointer;
  border: none; background: none; width: 100%; text-align: left; font-family: inherit;
  transition: background .12s, color .12s;
}
.nav__item:hover, .barra__recolher:hover { background: var(--grafite-3); color: var(--laranja); }
.nav__sep { height: 1px; background: rgba(255, 255, 255, .09); margin: 6px 14px; }
.app.recolhido .nav__sep { margin: 8px 12px; }
.nav__item--ativo { background: var(--laranja); color: #fff; }
.nav__item--ativo:hover { background: var(--laranja); color: #fff; }
.nav__icone { flex: 0 0 auto; display: inline-flex; }
.nav__icone svg { width: 19px; height: 19px; }
.nav__item { position: relative; }
.nav__badge {
  margin-left: auto; background: var(--erro); color: #fff; font-weight: 700;
  font-size: 11px; line-height: 1; min-width: 18px; height: 18px; padding: 0 5px;
  border-radius: 999px; display: inline-flex; align-items: center; justify-content: center;
}
.app.recolhido .nav__badge {
  position: absolute; top: 3px; right: 5px; margin: 0;
  min-width: 15px; height: 15px; padding: 0 3px; font-size: 9px;
}
/* botão de recolher: só os três traços, no topo da barra, à direita da marca */
.barra__recolher { width: auto; flex: 0 0 auto; margin-left: auto; padding: 6px; gap: 0; }
.barra__recolher svg { width: 20px; height: 20px; display: block; }

/* grupo do menu (Cadastros auxiliares) */
.nav__grupo { display: flex; flex-direction: column; gap: 2px; }
.nav__caret { margin-left: auto; display: inline-flex; transition: transform .15s; }
.nav__caret svg { width: 16px; height: 16px; }
.nav__grupo.aberto > .nav__grupo-cab .nav__caret { transform: rotate(180deg); }
.nav__filhos { display: none; flex-direction: column; gap: 1px; }
.nav__grupo.aberto > .nav__filhos { display: flex; }
/* submenu sem ícone: texto alinhado com o do item pai (12 + 19 do ícone + 12 de gap) */
.nav__subitem { padding: 5px 12px 5px 43px; font-size: 13px; font-weight: 500; }
.nav__subitem.nav__item--ativo { color: #fff; font-weight: 600; }
/* subgrupo dentro de um grupo (Fluxo de caixa > Entradas): itens um nível mais para dentro */
.nav__subitem--n2 { padding-left: 57px; }
/* campo só de leitura (ex.: Recibo no bloco de comissão): cinza, tracejado, sem cara de editável */
.campo input.so-leitura, .campo input.so-leitura:focus, .campo a.so-leitura {
  background: var(--fundo); color: var(--texto-suave); border: 1px dashed var(--linha);
  box-shadow: none; outline: none; cursor: default;
}
/* com recibo vinculado vira link: mesma caixa, número em laranja, abre o recibo */
.campo a.so-leitura {
  display: block; width: 100%; font-size: 13.5px; padding: 8px 10px; border-radius: var(--raio);
  color: var(--laranja); font-weight: 600; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.campo a.so-leitura:hover { border-color: var(--laranja); text-decoration: underline; }

/* grade de Comissões: valor/data fixos porque o repasse está vinculado a um recibo */
.tab-fluxo input[data-fixo-recibo] { border-style: dashed; color: var(--texto-suave); cursor: default; }

/* campo de data com valor inválido (static/js/datas.js) */
input.data-invalida { border-color: var(--erro); background: var(--erro-fraco); }

/* subgrupo aberto: título em laranja */
.nav__filhos .nav__grupo.aberto > .nav__grupo-cab { color: var(--laranja); font-weight: 600; }
.app.recolhido .nav__caret { display: none; }
.app.recolhido .nav__filhos { display: none; }

.app.recolhido .marca__nome,
.app.recolhido .nav__texto { display: none; }
.app.recolhido .nav__item,
.app.recolhido .barra__recolher { justify-content: center; gap: 0; }
.app.recolhido .barra__topo { flex-direction: column; justify-content: center; gap: 10px; }
.app.recolhido .barra__recolher { margin-left: 0; }

/* ---------- topo ---------- */
.topo {
  display: flex; align-items: center; gap: 12px;
  padding: 14px 22px; background: var(--branco); border-bottom: 1px solid var(--linha);
  position: sticky; top: 0; z-index: 20;
}
.topo__menu { display: none; }
.topo__titulo { margin: 0; font-size: 18px; font-weight: 700; flex: 1; }
.topo__acoes { display: flex; gap: 8px; }
.topo__usuario { display: flex; align-items: center; gap: 8px; padding-left: 12px; margin-left: 4px;
  border-left: 1px solid var(--linha); font-size: 13px; font-weight: 600; color: var(--texto-suave); white-space: nowrap; }
.topo__usuario a { color: inherit; text-decoration: none; }
.topo__usuario a:hover { color: var(--laranja, #e8641e); text-decoration: underline; }

/* ---------- telas de login / primeiro acesso ---------- */
.tela-auth { min-height: 100dvh; display: grid; place-items: center; padding: 24px; background: var(--fundo); }
.auth-box { width: 100%; max-width: 340px; background: var(--branco); border: 1px solid var(--linha);
  border-radius: var(--raio); box-shadow: var(--sombra); padding: 24px; display: flex; flex-direction: column; gap: 12px; }
.auth-box__marca { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.auth-box__marca span { display: flex; flex-direction: column; line-height: 1.1; }
.auth-box__marca strong { font-weight: 800; letter-spacing: .06em; }
.auth-box__marca small { font-size: 9px; letter-spacing: .16em; color: var(--texto-suave); margin-top: 2px; }

/* ---------- flash ---------- */
.flash { padding: 12px 22px 0; display: flex; flex-direction: column; gap: 6px; }
.flash__item { padding: 9px 12px; border-radius: var(--raio); font-size: 13px; font-weight: 600; }
.flash__item--ok  { background: var(--ok-fraco); color: var(--ok); }
.flash__item--erro { background: var(--erro-fraco); color: var(--erro); }
.flash__item--aviso { background: var(--aviso-fraco); color: var(--aviso); }

/* ---------- painel: números + gráfico ---------- */
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; margin-bottom: 16px; }
.stat { background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio); box-shadow: var(--sombra); padding: 10px 12px; }
.stat__valor { font-size: 19px; font-weight: 800; line-height: 1.15; color: var(--texto); }
.stat__rotulo { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-suave); margin-top: 4px; }
.stat__rotulo a { color: inherit; }
.stat__rotulo a:hover { color: var(--laranja-hover); }

.graf { display: flex; flex-direction: column; gap: 9px; }
.graf__linha { display: grid; grid-template-columns: 130px 1fr 32px; align-items: center; gap: 10px; font-size: 13px; }
.graf__linha:hover .graf__barra { background: var(--laranja-hover); }
.graf__rotulo { text-align: right; color: var(--texto-suave); font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.graf__trilha { background: var(--fundo); border: 1px solid var(--linha); border-radius: 999px; height: 10px; overflow: hidden; }
.graf__barra { display: block; height: 100%; background: var(--laranja); border-radius: 999px; min-width: 4px; }
.graf__valor { font-weight: 700; text-align: right; }
@media (max-width: 560px) { .graf__linha { grid-template-columns: 88px 1fr 26px; } }
/* panorama da empresa: cards em duas linhas de três (valores em R$ não quebram) */
.stats--3 { grid-template-columns: repeat(3, 1fr); }
.stats--3 .stat__valor { white-space: nowrap; }
@media (max-width: 760px) { .stats--3 { grid-template-columns: 1fr; } }
/* panorama da empresa: produtos por mês (colunas) */
.graf-meses { display: grid; grid-template-columns: repeat(12, 1fr); gap: 8px; height: 150px; align-items: end; }
.graf-meses__col { display: flex; flex-direction: column; justify-content: flex-end; align-items: center; height: 100%; text-decoration: none; color: inherit; }
.graf-meses__valor { font-size: 12px; font-weight: 700; margin-bottom: 3px; }
.graf-meses__barra { width: 70%; max-width: 46px; min-height: 2px; background: var(--laranja); border-radius: 5px 5px 0 0; }
.graf-meses__col:hover .graf-meses__barra { background: var(--laranja-hover); }
.graf-meses__mes { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--texto-suave); margin-top: 5px; }
.graf-meses__col--atual .graf-meses__mes { color: var(--laranja); }
/* panorama da empresa: balanço do mês */
.balanco__cab { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.balanco__cab h2 { margin: 0; }
.balanco__cab label { display: flex; align-items: center; gap: 8px; font-size: 12px; font-weight: 700; color: var(--texto-suave); }
.balanco__cab input { width: 170px; }
.balanco__linha { display: grid; gap: 10px; margin-top: 12px; }
.balanco__linha--4 { grid-template-columns: repeat(4, 1fr); }
.balanco__linha--3 { grid-template-columns: repeat(3, 1fr); }
.balanco__linha > div { background: var(--fundo); border: 1px solid var(--linha); border-radius: var(--raio); padding: 10px 12px; }
.balanco__valor { display: block; font-size: 19px; font-weight: 800; white-space: nowrap; }
.balanco__rotulo { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-suave); margin-top: 2px; }
.balanco__rotulo small { display: block; text-transform: none; letter-spacing: 0; font-weight: 600; font-size: 11px; margin-top: 1px; }
.balanco__rotulo small.balanco__obs { margin-top: 6px; color: var(--laranja, #e8641e); font-weight: 600; }
@media (max-width: 760px) { .balanco__linha--4, .balanco__linha--3 { grid-template-columns: 1fr 1fr; } }
/* panorama da empresa: os dois gráficos lado a lado, mais compactos */
.graf-duplo { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; align-items: start; }
.graf-duplo .cartao { margin: 0; }
.graf-duplo .graf { gap: 6px; }
.graf-duplo .graf__linha { grid-template-columns: 110px 1fr 28px; font-size: 12px; }
.graf-duplo .graf__trilha { height: 8px; }
.stat__rotulo small { text-transform: none; letter-spacing: 0; font-weight: 600; }
@media (max-width: 900px) { .graf-duplo { grid-template-columns: 1fr; } }

/* ---------- página / cartões ---------- */
.pagina { padding: 22px; flex: 1; }
.cartao {
  background: var(--branco); border: 1px solid var(--linha); border-radius: var(--raio);
  box-shadow: var(--sombra); padding: 18px; margin-bottom: 16px;
}
.cartao > h2 { margin: 0 0 14px; font-size: 14px; font-weight: 700; color: var(--laranja-hover); }

/* título em faixa: destaca o cabeçalho do card (usado no painel) */
.cartao--titulo > h2 {
  margin: -18px -18px 16px; padding: 4px 18px;
  border-radius: var(--raio) var(--raio) 0 0;
  border-bottom: 1px solid var(--grafite);
  background: var(--grafite); color: var(--texto-inv);
  letter-spacing: .02em;
}

/* ---------- botões ---------- */
.btn {
  display: inline-flex; align-items: center; gap: 7px; justify-content: center;
  font: inherit; font-size: 13px; font-weight: 700; cursor: pointer;
  border: 1px solid transparent; border-radius: var(--raio); padding: 8px 15px; white-space: nowrap;
  transition: background .12s, border-color .12s, color .12s;
}
.btn svg { width: 16px; height: 16px; }
.btn--primario { background: var(--laranja); color: #fff; }
.btn--primario:hover { background: var(--laranja-hover); }
.btn--contorno { background: var(--branco); border-color: var(--laranja); color: var(--laranja-hover); }
.btn--contorno:hover { background: var(--laranja-fraco); }
.btn--linha { background: var(--branco); border-color: var(--linha); color: var(--texto); }
.btn--linha:hover { border-color: var(--laranja); color: var(--laranja-hover); }
.btn--perigo { background: var(--branco); border-color: #f0ccc9; color: var(--erro); }
.btn--perigo:hover { background: var(--erro-fraco); }
.btn--mini { padding: 5px 9px; font-size: 12px; }

/* ---------- formulários ---------- */
.form { display: flex; flex-direction: column; gap: 14px; }
/* dentro do .form o espaçamento entre cards é só o gap acima — sem somar a margem do .cartao */
.form > .cartao { margin-bottom: 0; }
/* status do "Ler apólice": vazio não ocupa espaço acima do 1º card (o JS preenche quando há PDF) */
#ler-pdf-status:empty { display: none; }
.grade { display: grid; gap: 12px 14px; grid-template-columns: repeat(12, 1fr); }
.grade__linha { grid-column: 1 / -1; height: 1px; background: var(--linha); margin: 2px 0; }
.campo { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.campo[hidden] { display: none; }
/* linha estilo tabela: nome do campo à esquerda, controle preenchido à direita */
.linha-campo { flex-direction: row; align-items: center; gap: 12px; padding: 6px 0; border-bottom: 1px solid var(--linha); }
.linha-campo:last-child { border-bottom: none; }
.linha-campo > .linha-campo__nome { flex: 0 0 240px; font-size: 12.5px; font-weight: 600; color: var(--texto); }
.linha-campo > input, .linha-campo > select { flex: 1 1 auto; min-width: 0; }
.linha-campo > .linha-campo__uni { flex: 0 0 auto; font-size: 12px; color: var(--texto-suave); white-space: nowrap; }
@media (max-width: 720px) {
  .linha-campo { flex-direction: column; align-items: stretch; gap: 4px; }
  .linha-campo > .linha-campo__nome { flex: none; }
}
.campo label { font-size: 11.5px; font-weight: 700; color: var(--texto-suave); }
.campo input, .campo select, .campo textarea {
  font: inherit; font-size: 13.5px; padding: 8px 10px;
  border: 1px solid var(--linha); border-radius: var(--raio); background: var(--branco); color: var(--texto);
  width: 100%;
}
.campo textarea { resize: vertical; min-height: 64px; line-height: 1.45; }
.campo input:focus-visible, .campo select:focus-visible, .campo textarea:focus-visible {
  outline: none; border-color: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-fraco);
}
.campo input[aria-invalid="true"] { border-color: var(--erro); }
.foi-preenchido { background: var(--laranja-fraco); transition: background .4s; }
.campo .dica { font-size: 11px; color: var(--texto-suave); }
.campo .dica--erro { color: var(--erro); }
.link-abrir { margin-left: 8px; font-weight: 700; color: var(--laranja-hover); text-decoration: underline; }
.link-abrir[hidden] { display: none; }

/* checkbox com rótulo na mesma linha */
.campo label.check {
  flex-direction: row; align-items: center; gap: 8px;
  font-size: 13px; font-weight: 600; color: var(--texto); cursor: pointer;
}
.campo label.check input { width: auto; }

/* larguras de coluna no grid de 12 */
.c-2 { grid-column: span 2; } .c-3 { grid-column: span 3; } .c-4 { grid-column: span 4; }
.c-5 { grid-column: span 5; } .c-6 { grid-column: span 6; } .c-7 { grid-column: span 7; }
.c-8 { grid-column: span 8; } .c-9 { grid-column: span 9; } .c-12 { grid-column: 1 / -1; }

.rodape-form { display: flex; gap: 8px; justify-content: flex-end; padding-top: 4px; }

/* painel do gerador de linhas (parcelas da apólice / lançamentos da saída) */
.gerador {
  background: var(--fundo); border: 1px solid var(--linha); border-radius: var(--raio);
  padding: 12px 14px; margin-bottom: 14px;
}
.gerador .grade { margin-bottom: 0; align-items: flex-end; }
.gerador .campo input, .gerador .campo select { background: var(--branco); }

/* ---------- tabelas ---------- */
.tabela-wrap { overflow-x: auto; }
table.lista { width: 100%; border-collapse: collapse; }
table.lista th, table.lista td {
  text-align: left; padding: 7px 12px; border-bottom: 1px solid var(--linha); font-size: 12px; vertical-align: middle;
}
table.lista th { font-size: 11px; text-transform: uppercase; letter-spacing: .03em; color: var(--laranja); font-weight: 700; }
/* zebra bem suave; o :hover abaixo continua vencendo por vir depois (mesma especificidade) */
table.lista tbody tr:nth-child(even) { background: #fafbfc; }
table.lista tbody tr:hover { background: var(--fundo); }
/* coluna-identidade (nome / número): preto e negrito, destaca do resto da linha */
table.lista a.cel-nome { color: var(--texto); font-weight: 700; }
table.lista a.cel-nome:hover { color: var(--laranja); }
/* link secundário dentro da tabela (ex.: nome do cliente na lista de apólices) */
table.lista a.cel-link:hover { color: var(--laranja); }
/* selo discreto "PJ" antes do nome (cliente pessoa jurídica) */
.tag-pj {
  display: inline-block; margin-right: 6px; padding: 0 5px; border-radius: 4px;
  font-size: 10px; font-weight: 700; letter-spacing: .04em; vertical-align: 1px;
  background: var(--fundo); color: var(--texto-suave); border: 1px solid var(--linha);
}
.tag-endosso {
  display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 999px;
  font-size: 10px; font-weight: 700; vertical-align: 1px; white-space: nowrap;
  background: var(--laranja-fraco); color: var(--laranja-hover); border: 1px solid #f2ddca;
}
.tag-endosso:hover { background: #fbe0cd; }
/* "próxima parcela" quitada: check verde no lugar do traço */
table.lista .selo-quitado { display: inline-flex; color: var(--ok); }
table.lista .selo-quitado svg { width: 18px; height: 18px; }
/* coluna "Próxima parcela": conteúdo e título centralizados */
table.lista th.col-prox, table.lista td.col-prox { text-align: center; }
/* data sempre em cima e o selo (vencida/vence) sempre embaixo, em qualquer largura de tela */
table.lista td.col-prox { white-space: nowrap; }
table.lista td.col-prox .tag-venc { display: block; width: fit-content; margin: 3px auto 0; }
/* observação na lista: até 2 linhas, o texto inteiro aparece ao passar o mouse */
table.lista th.col-obs { min-width: 160px; }
table.lista td.col-obs .obs-curta { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; max-width: 260px; white-space: pre-line; }
/* ícone de ordenar por cliente no cabeçalho */
table.lista th .th-ord { display: inline-flex; vertical-align: middle; margin-left: 3px; color: var(--texto-suave); }
table.lista th .th-ord svg { width: 13px; height: 13px; }
table.lista th .th-ord:hover, table.lista th .th-ord.ativo { color: var(--laranja-hover); }
/* lista de apólices: datas da vigência nunca quebram no meio do intervalo;
   nome do cliente com fonte menor pra sobrar largura */
.vig-datas { white-space: nowrap; }
table.lista td.col-cliente { font-size: 12px; }
/* cabeçalho de grupo dentro da lista (ex.: clientes "Agrupar por") */
table.lista tr.lista-grupo td {
  background: #eceff3; font-weight: 700; font-size: 12px; letter-spacing: .02em;
  color: var(--texto); border-top: 2px solid var(--linha);
  padding-top: 9px; padding-bottom: 9px;
}
table.lista tr.lista-grupo td small { font-weight: 400; color: var(--texto-suave); }
table.lista tr.lista-grupo:hover td { background: #eceff3; }
/* mantém a célula como table-cell (senão a borda inferior sai desalinhada) */
table.lista td.acoes { text-align: right; white-space: nowrap; }
table.lista td.acoes > a,
table.lista td.acoes > form { display: inline-flex; vertical-align: middle; }
table.lista td.acoes > a + a,
table.lista td.acoes > a + form,
table.lista td.acoes > form + form { margin-left: 6px; }
table.lista td.col-arrastar { width: 28px; padding-right: 0; color: var(--texto-suave); cursor: grab; }
table.lista td.col-arrastar:active { cursor: grabbing; }
table.lista tr.arrastando { opacity: .4; }
table.lista tr.arrasta-antes { box-shadow: inset 0 2px 0 var(--laranja); }
table.lista tr.arrasta-depois { box-shadow: inset 0 -2px 0 var(--laranja); }
.tag-papel {
  display: inline-block; margin-left: 8px; padding: 1px 8px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; background: #fde7d6; color: #9a4a12; vertical-align: middle;
}
.tag-status {
  display: inline-block; padding: 1px 8px; border-radius: 999px;
  font-size: 11px; font-weight: 700; white-space: nowrap;
  background: var(--fundo); color: var(--texto-suave); border: 1px solid var(--linha);
}
#lista-opcoes { display: flex; flex-direction: column; gap: 6px; margin-bottom: 8px; }
.opcao-linha { display: flex; gap: 8px; align-items: center; }
.opcao-linha > input { flex: 1 1 auto; min-width: 0; }
.vazio { padding: 28px; text-align: center; color: var(--texto-suave); }

/* apólice perto do fim da vigência (<= 20 dias) ou já vencida */
table.lista tr.apolice-vencendo td,
table.lista tr.apolice-vencida td { background: var(--erro-fraco); }
table.lista tr.apolice-vencendo:hover td,
table.lista tr.apolice-vencida:hover td { background: #f6dcda; }
table.lista tr.apolice-vencendo td:first-child { box-shadow: inset 3px 0 0 var(--erro); }
table.lista tr.apolice-vencida td:first-child { box-shadow: inset 3px 0 0 #a52019; }
.tag-venc {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 11px; font-weight: 700; white-space: nowrap;
  background: var(--erro-fraco); color: var(--erro); border: 1px solid #f0ccc9;
}
.tag-venc--fim { background: var(--erro); color: #fff; border-color: var(--erro); }

.tag-venc--aviso { background: var(--aviso-fraco); color: var(--aviso); border-color: #f1dca6; }
.tag-venc svg { width: 11px; height: 11px; vertical-align: -1px; }

/* ---------- lista de Tarefas ---------- */
.lista--tarefas .cel-titulo { color: var(--texto); }
.lista--tarefas .cel-titulo:hover { color: var(--laranja); }
.lista--tarefas tr.tarefa-concluida .cel-titulo { text-decoration: line-through; color: var(--texto-suave); }
.lista--tarefas .col-prazo { white-space: nowrap; font-size: 12.5px; }
.lista--tarefas .col-obs { font-size: 12.5px; color: var(--texto-suave); white-space: pre-line; }
.lista--tarefas .sem-prazo { color: var(--texto-suave); }
table.lista.lista--tarefas tr.tarefa-alerta td { background: #fffaeb; }
table.lista.lista--tarefas tr.tarefa-atrasada td { background: var(--erro-fraco); }
.form-status-tarefa { display: inline-flex; margin: 0; }

/* quadro de Tarefas: um card por responsável */
.quadro-tarefas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; align-items: start; }
.quadro-tarefas__card { margin-bottom: 12px; padding-bottom: 6px; }
.quadro-tarefas__card > h2 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.quadro-tarefas__nome { display: inline-flex; align-items: center; gap: 8px; }
.quadro-tarefas__nova {
  display: inline-flex; align-items: center; gap: 4px; padding: 1px 9px; border-radius: 999px;
  font-size: 12px; font-weight: 700; color: var(--texto-inv); border: 1px solid rgba(255, 255, 255, .25);
}
.quadro-tarefas__nova svg { width: 13px; height: 13px; }
.quadro-tarefas__nova:hover { background: var(--laranja); border-color: var(--laranja); color: #fff; }
.quadro-tarefas__qtd {
  min-width: 20px; padding: 0 6px; border-radius: 999px; text-align: center;
  background: var(--laranja); color: #fff; font-size: 12px;
}
.quadro-tarefas__lista { list-style: none; margin: -6px -18px 0; padding: 0; }
.quadro-tarefas__lista li {
  display: flex; gap: 10px; align-items: flex-start;
  padding: 9px 18px; border-top: 1px solid var(--linha);
}
.quadro-tarefas__lista li:first-child { border-top: 0; }
.quadro-tarefas__lista li.tarefa-alerta { background: #fffaeb; }
.quadro-tarefas__lista li.tarefa-atrasada { background: var(--erro-fraco); }
.quadro-tarefas__status { padding-top: 1px; }
.quadro-tarefas__corpo { min-width: 0; }
.quadro-tarefas .cel-titulo { color: var(--texto); font-weight: 600; overflow-wrap: anywhere; }
.quadro-tarefas .cel-titulo:hover { color: var(--laranja); }
.quadro-tarefas__meta { display: flex; flex-wrap: wrap; gap: 4px 12px; margin-top: 2px; font-size: 12px; color: var(--texto-suave); }
.quadro-tarefas__prazo .tag-venc { margin-left: 4px; }
.quadro-tarefas__vazio { margin: 0 0 12px; color: var(--texto-suave); font-size: 13px; }
@media (max-width: 1000px) { .quadro-tarefas { grid-template-columns: 1fr; gap: 0; } }

/* planilha "Seguros novos" (Tarefas, acima dos cards) — edição direto nas células */
.planilha-tarefas { margin-bottom: 16px; }
.planilha-tarefas > h2 { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.planilha__status { font-size: 12px; font-weight: 400; color: var(--texto-suave); }
.planilha__status.erro { color: var(--erro); }
.planilha__rolagem { overflow-x: auto; margin: 0 -18px; }
.planilha { width: 100%; border-collapse: collapse; font-size: 13px; }
.planilha th {
  text-align: left; font-size: 12px; font-weight: 600; color: var(--texto-suave);
  padding: 6px 8px; border-bottom: 1px solid var(--linha); white-space: nowrap;
}
.planilha td { border-bottom: 1px solid var(--linha); border-right: 1px solid var(--linha); padding: 0; }
/* mesma zebra das listas (table.lista): branco / cinza bem claro, hover por cima */
.planilha tbody tr:nth-child(even) { background: #fafbfc; }
.planilha td:last-child { border-right: 0; }
/* para não clicar no botão da pessoa de outra linha:
   - linha em uso (a última em que se clicou/digitou): fundo laranja claro + barra laranja à esquerda;
   - linha sob o mouse (onde o clique vai cair): laranja mais forte + faixas em cima e embaixo.
   Sombra interna não mexe na altura da linha. */
.planilha tbody tr.planilha__linha-ativa { background: var(--laranja-fraco); }
.planilha tbody tr.planilha__linha-ativa td:first-child { box-shadow: inset 5px 0 0 var(--laranja); }
.planilha tbody tr:hover { background: #f9cfb3; }
.planilha tbody tr:hover td { box-shadow: inset 0 2px 0 var(--laranja), inset 0 -2px 0 var(--laranja); }
.planilha tbody tr:hover td:first-child {
  box-shadow: inset 0 2px 0 var(--laranja), inset 0 -2px 0 var(--laranja), inset 5px 0 0 var(--laranja);
}
.planilha tbody tr.planilha__linha-ativa td:first-child input,
.planilha tbody tr:hover td:first-child input { font-weight: 700; }
.planilha td input:not([type=checkbox]), .planilha td select {
  width: 100%; min-width: 0; border: 0; border-radius: 0; background: transparent;
  padding: 7px 8px; font: inherit; color: inherit;
}
.planilha td input[data-valor] { text-align: right; }
/* larguras vêm do <colgroup>; Renda estreita (título quebra em 2 linhas) */
.planilha { table-layout: fixed; min-width: 1058px; }
.planilha th.planilha__col-valor { white-space: normal; line-height: 1.2; }
.planilha td input:focus, .planilha td select:focus { outline: 2px solid var(--laranja); outline-offset: -2px; }
.planilha td input:focus, .planilha td select:not(.planilha__sistema):focus { background: #fff; }
.planilha td .celula-erro { background: var(--erro-fraco); }
.planilha__marcas { width: 1%; text-align: center; padding: 3px 6px !important; }
.planilha__marca {
  display: inline-flex; align-items: center; justify-content: center;
  width: 54px; height: 22px; padding: 0; border: 1px solid var(--linha); border-radius: 12px;
  background: var(--branco); font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; user-select: none;
}
.planilha__marca[data-com-nao] { width: 80px; }   /* cabe "Automático" */
.planilha__marca:hover { border-color: var(--texto-suave); }
.planilha__marca[data-estado="fazer"] { background: var(--erro); border-color: var(--erro); color: #fff; }
.planilha__marca[data-estado="ok"] { background: var(--ok); border-color: var(--ok); color: #fff; }
.planilha__marca[data-estado="nao"] { background: #f2c230; border-color: #f2c230; color: var(--texto); }
.planilha td select.planilha__sistema {
  height: 22px; padding: 0 6px; border: 1px solid var(--linha); border-radius: 12px;
  background: var(--branco); font-size: 12px; font-weight: 600; cursor: pointer;
}
.planilha td select.planilha__sistema[data-estado="so_nome"],
.planilha td select.planilha__sistema[data-estado="so_apolice"],
.planilha td select.planilha__sistema[data-estado="so_comissao"] { background: var(--erro); border-color: var(--erro); color: #fff; }
.planilha td select.planilha__sistema[data-estado="ok"] { background: var(--ok); border-color: var(--ok); color: #fff; }
.planilha__sistema option { background: var(--branco); color: var(--texto); }
.planilha__excluir { width: 1%; text-align: center; }
.planilha__excluir button {
  border: 0; background: none; color: var(--texto-suave); font-size: 18px; line-height: 1;
  padding: 4px 10px; cursor: pointer;
}
.planilha__excluir button:hover { color: var(--erro); }
.planilha__finalizar { width: 1%; text-align: center; }
.planilha__finalizar button {
  border: 0; background: none; color: var(--texto-suave); font-size: 16px; line-height: 1;
  padding: 4px 8px; cursor: pointer;
}
.planilha__finalizar button:hover { color: var(--ok); }
/* finalizados: guardados abaixo dos cards de tarefas */
.planilha-finalizados { margin-top: 16px; }
.assistencias-fechadas, .saidas-pagas, .clientes-leads { margin-top: 16px; }
.planilha-finalizados td.acoes .btn + .btn { margin-left: 6px; }
.planilha__adicionar { margin-top: 12px; }
.planilha__obs { margin: 10px 0 0; font-size: 12px; color: var(--texto-suave); }
.status-tarefa {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; padding: 0; border-radius: 50%; border: 0;
  color: #fff; vertical-align: middle;
}
.status-tarefa svg { width: 14px; height: 14px; stroke-width: 3; }
.status-tarefa--concluida { background: var(--ok); }
.status-tarefa--fazendo { background: #f2b705; }
.status-tarefa--a_fazer { background: var(--erro); }
button.status-tarefa { cursor: pointer; }
button.status-tarefa:hover { filter: brightness(.88); }

/* ---------- lista de Saídas (fluxo de caixa): 4 colunas, meta em sub-linha ---------- */
.lista--saidas td { vertical-align: top; }
.lista--saidas .cel-titulo { font-weight: 700; color: var(--texto); }
.lista--saidas .cel-titulo:hover { color: var(--laranja); }
.lista--saidas tr.linha-paga .cel-titulo { text-decoration: line-through; color: var(--texto-suave); }
.lista--saidas tr.linha-paga td { color: var(--texto-suave); }
.lista--saidas .tag-fixa {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; background: #e7efe7; color: #3a5a40; vertical-align: middle;
}
/* conta corrente: saída paga por fora da empresa (ex.: pelo dono) */
.tag-fora-conta {
  display: inline-block; margin-left: 6px; padding: 1px 7px; border-radius: 999px;
  font-size: 10.5px; font-weight: 700; background: var(--laranja-fraco); color: var(--laranja-hover);
  vertical-align: middle;
}
.lista--saidas .meta { display: block; margin-top: 3px; font-size: 11.5px; color: var(--texto-suave); }
.lista--saidas .col-venc .venc-data { display: block; font-size: 12.5px; }
.lista--saidas .col-venc .tag-venc { margin-left: 0; margin-top: 4px; }
.lista--saidas .selo-pago { display: block; margin-top: 3px; font-size: 11px; font-weight: 700; color: var(--ok); }
.lista--saidas .selo-apagar { display: block; margin-top: 3px; font-size: 11px; color: var(--texto-suave); }
.lista--saidas .col-valor {
  text-align: right; white-space: nowrap; font-weight: 600; font-variant-numeric: tabular-nums;
}

/* ---------- relatório de fluxo de caixa ---------- */
.filtros.rel-filtros .grade { gap: 12px 14px; align-items: start; }
.rel-presets { display: flex; flex-wrap: wrap; gap: 6px; }

/* 1ª linha: quadrinho de período (tamanho do conteúdo) + Descrição ocupa o resto */
.rel-linha1 { display: flex; gap: 14px; align-items: flex-end; }
.rel-linha1 > .campo { flex: 1 1 auto; min-width: 200px; }

/* grupo destacado dos filtros que definem a data */
.rel-periodo {
  flex: 0 0 auto;
  background: var(--fundo); border: 1px solid var(--linha); border-radius: var(--raio);
  padding: 8px 12px;
}
.rel-periodo__campos { display: flex; flex-wrap: nowrap; gap: 10px 12px; align-items: flex-start; }
.rel-periodo__campos > .campo { flex: 0 0 auto; }
.rel-periodo__campos > .campo:not(.rel-periodo__atalhos) { width: 140px; }
.rel-periodo__campos input[type="date"] { height: 36px; background: var(--branco); }
.rel-periodo__atalhos { flex: 0 0 auto; }
.rel-periodo__atalhos .rel-presets { flex-wrap: nowrap; align-items: flex-start; gap: 8px; }
.rel-periodo__atalhos .rel-presets .btn {
  height: 36px; padding: 0 11px; font-size: 12.5px; white-space: nowrap;
}
/* Entradas: só "De/Até" + 2 atalhos — aperta os campos p/ caberem no card */
.ent-filtros .rel-periodo__campos { gap: 10px 8px; }
.ent-filtros .rel-periodo__campos > .campo:not(.rel-periodo__atalhos) { width: 120px; }
/* "Agrupar por" + "Depois por" sempre juntos na mesma linha */
.rel-agrupar { display: flex; gap: 12px; align-self: start; }
.rel-agrupar .campo { flex: 1 1 0; min-width: 0; }
.rel-stats { margin-top: 14px; }
/* leve tom laranja nos 4 cards do resultado — quebra visual entre filtros e resultado */
.rel-stats .stat { background: #fdf4ee; border-color: #f2ddca; }
.rel-acoes { display: flex; align-items: stretch; gap: 12px; margin: 12px 2px; flex-wrap: wrap; }
.rel-acoes .btn { min-height: 30px; }
/* larguras fixas (colgroup 30/12/15/15/15/13); dados centralizados => ritmo parelho.
   Descrição sem % gigante: fica com 30% e as demais dividem o resto. */
.rel-tabela { table-layout: fixed; }
.rel-tabela th, .rel-tabela td { padding: 7px 12px; font-size: 12.5px; vertical-align: middle; }
.rel-tabela .rel-desc { font-weight: 600; overflow-wrap: anywhere; }
.rel-tabela .rel-col-c { text-align: center; }
.rel-nowrap { white-space: nowrap; }
.rel-tabela .col-valor { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; }
.rel-tabela .selo-pago  { color: var(--ok); font-weight: 700; }
.rel-tabela .selo-apagar { color: var(--texto-suave); }
.rel-tabela .tag-fixa {
  display: inline-block; padding: 0 6px; border-radius: 999px; font-size: 10px; font-weight: 700;
  background: #e7efe7; color: #3a5a40; vertical-align: middle;
}
.rel-tabela tr.rel-paga td { color: var(--texto-suave); }
.rel-cab td {
  background: #eceff3; font-weight: 700; font-size: 13px;
  border-top: 2px solid var(--linha); padding-top: 9px; padding-bottom: 9px;
}
.rel-cab--2 td { background: #f4f6f8; font-weight: 600; border-top-width: 1px; }
.rel-cab--2 td:first-child { padding-left: 24px; }
/* nível 3 (apólice): cabeçalho leve; só ganha fundo quando é o nível de topo (sem agrupamento) */
.rel-cab--3 td {
  background: var(--branco); font-weight: 600; font-size: 12.5px;
  border-top-width: 1px; padding-top: 8px; padding-bottom: 6px; padding-left: 36px;
}
.rel-cab--3.rel-ap-topo td { background: #f4f6f8; }
.rel-cab--3 td strong { font-weight: 700; }
.rel-cab--3 td small { color: var(--texto-suave); font-weight: 400; }
.rel-sub--3 td:first-child { padding-left: 36px; }
.rel-campo {
  color: var(--texto-suave); font-weight: 600; font-size: 10px;
  text-transform: uppercase; letter-spacing: .04em; margin-right: 8px;
}
.rel-sub td { color: var(--texto-suave); font-size: 11.5px; background: #fafbfc; }
.rel-sub td.col-valor strong { color: var(--texto); }   /* soma da apólice/grupo em preto */
.rel-sub--1 td { font-weight: 700; color: var(--texto); }
.rel-sub--2 td:first-child { padding-left: 24px; }
.rel-sub--3 td { background: var(--branco); }   /* "Total da apólice" sem sombra */
.rel-sub small, .rel-total small, .rel-resumo small { font-weight: 400; color: var(--texto-suave); }
.rel-total td { border-top: 2px solid var(--grafite); font-weight: 800; font-size: 13px; }
/* divergência: soma do repasse no sistema × total do relatório da corretora */
.rel-tabela tr.rel-diverg td {
  color: #b26a00; font-weight: 600; font-size: 11.5px;
  background: #fff7ec; padding-left: 36px;
}
.rel-diverg-nota { color: #b26a00; font-weight: 700; font-size: 12.5px; margin: 10px 0 14px; }

/* panorama de comissões: colunas fixas em %, tudo cabe sem rolagem (valores quebram se apertar) */
.rel-tabela.panorama { table-layout: fixed; width: 100%; min-width: 0; }
.rel-tabela.panorama th, .rel-tabela.panorama td { padding: 6px 6px; font-size: 11.5px; }
.rel-tabela.panorama th { white-space: normal; }   /* quebra só nos espaços, nunca no meio da palavra */
.rel-tabela.panorama td.col-valor,
.rel-tabela.panorama td.rel-col-c { white-space: normal; overflow-wrap: anywhere; }
.rel-tabela.panorama a.cel-nome { overflow-wrap: anywhere; }
.panorama .conf-ok { color: var(--ok); font-weight: 700; }
.panorama .conf-dif { color: var(--erro); font-weight: 400; }
.panorama .conf-min { color: var(--texto-suave); font-size: 11px; font-weight: 400; }
.rel-tabela.panorama th small { display: block; font-weight: 600; color: var(--texto-suave);
  font-size: 9px; line-height: 1.15; white-space: normal; }
.panorama .meta { display: block; margin-top: 3px; font-size: 11px; color: var(--texto-suave); }
.rel-tabela.panorama tr.rel-endosso td { background: #fbf7f3; }
.rel-tabela.panorama tr.rel-endosso td:first-child { box-shadow: inset 3px 0 0 var(--laranja); padding-left: 18px; }
.panorama .tipo-seg { font-size: 10px; font-weight: 700; letter-spacing: .04em; color: var(--texto-suave);
  border: 1px solid var(--linha); border-radius: 4px; padding: 1px 5px; margin-left: 6px; white-space: nowrap; }
.panorama td.saldo-pos { color: #b26a00; font-weight: 700; }
.panorama td.saldo-neg { color: var(--erro); font-weight: 700; }
.panorama .diverg { color: var(--erro); font-size: 11.5px; font-weight: 600; }
/* menos negrito: nº da apólice e rótulos de subtotal/total normais; só os VALORES em negrito */
.rel-tabela.panorama a.cel-nome { font-weight: 400; }
.rel-tabela.panorama tr.rel-sub--1 td,
.rel-tabela.panorama tr.rel-total td { font-weight: 400; }
.rel-tabela.panorama tr.rel-sub--1 td.col-valor,
.rel-tabela.panorama tr.rel-total td.col-valor { font-weight: 700; }

/* modo resumido: linha por grupo, sem fundo cinza, zebra alternada */
.rel-tabela .rel-resumo td { font-weight: 700; color: var(--texto); background: var(--branco); }
.rel-tabela .rel-resumo.rel-zebra td { background: #f6f7f9; }
.rel-tabela .rel-resumo small { font-size: 11.5px; }

/* cabeçalho do PDF — só aparece na impressão */
.pdf-cab { display: none; }

@media print {
  @page { margin: 14mm 12mm; }
  .barra, .topo, .flash, .rel-filtros, .rel-acoes, .rel-stats, .nav__badge { display: none !important; }
  .app { display: block; }
  .conteudo { margin: 0; }
  .pagina { padding: 0; }
  .cartao { box-shadow: none; border: none; }
  .rel-tabela th, .rel-tabela td { padding: 4px 6px; font-size: 10.5px; }
  .rel-cab td, .rel-sub td, .rel-total td { background: transparent !important; }
  /* não quebrar uma linha no meio; cabeçalho de grupo não fica sozinho no pé da página */
  .rel-tabela tr { break-inside: avoid; }
  .rel-cab { break-after: avoid; }

  .pdf-cab {
    display: flex; justify-content: space-between; align-items: flex-start; gap: 16px;
    margin-bottom: 16px; padding-bottom: 10px; border-bottom: 2.5px solid #2b2b2b;
  }
  .pdf-cab__marca { display: flex; align-items: center; gap: 11px; }
  .pdf-cab__logo { flex: none; }
  .pdf-cab__tit { display: flex; flex-direction: column; line-height: 1.3; }
  .pdf-cab__tit strong {
    font-size: 16px; font-weight: 800; color: #2b2b2b;
  }
  .pdf-cab__tit span { font-size: 11px; color: #555; margin-top: 1px; }
  .pdf-cab__meta { text-align: right; font-size: 10px; color: #555; line-height: 1.6; white-space: nowrap; }
  .pdf-cab, .pdf-cab * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ---------- tabela de parcelas / lançamentos: campos no mesmo padrão dos formulários ---------- */
#tab-parcelas td,
#tab-lancamentos td { padding: 8px 10px; vertical-align: middle; }
#tab-parcelas tbody td input,
#tab-parcelas tbody td select,
#tab-lancamentos tbody td input,
#tab-lancamentos tbody td select {
  width: 100%; font: inherit; font-size: 13.5px; padding: 8px 10px;
  border: 1px solid var(--linha); border-radius: var(--raio);
  background: var(--branco); color: var(--texto);
}
#tab-parcelas tbody td input:focus-visible,
#tab-parcelas tbody td select:focus-visible,
#tab-lancamentos tbody td input:focus-visible,
#tab-lancamentos tbody td select:focus-visible {
  outline: none; border-color: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-fraco);
}
#tab-parcelas td.acoes,
#tab-lancamentos td.acoes { text-align: center; }

/* linha já paga: fica discreta */
#tab-parcelas tr.parcela--paga input,
#tab-parcelas tr.parcela--paga select,
#tab-lancamentos tr.parcela--paga input,
#tab-lancamentos tr.parcela--paga select { color: var(--texto-suave); }
#tab-parcelas tr.parcela--paga td:first-child input,
#tab-lancamentos tr.parcela--paga td:first-child input { text-decoration: line-through; }

/* parcela cancelada: cinza e riscada (não entra em avisos nem pendências) */
#tab-parcelas tr.parcela--cancelada td { background: #f1f1f1; }
#tab-parcelas tr.parcela--cancelada td:first-child { box-shadow: inset 3px 0 0 #9a9a9a; }
#tab-parcelas tr.parcela--cancelada input,
#tab-parcelas tr.parcela--cancelada select { color: var(--texto-suave); }
#tab-parcelas tr.parcela--cancelada td:nth-child(-n+3) input { text-decoration: line-through; }

/* linha vencida e não paga: destaque vermelho (igual ao painel) */
#tab-parcelas tr.parcela--atrasada td,
#tab-lancamentos tr.parcela--atrasada td { background: var(--erro-fraco); }
#tab-parcelas tr.parcela--atrasada td:first-child,
#tab-lancamentos tr.parcela--atrasada td:first-child { box-shadow: inset 3px 0 0 var(--erro); }
#tab-parcelas tr.parcela--atrasada input,
#tab-parcelas tr.parcela--atrasada select,
#tab-lancamentos tr.parcela--atrasada input,
#tab-lancamentos tr.parcela--atrasada select { border-color: #f0ccc9; }

/* linha perto de vencer (<=10 dias) e não paga: amarelo */
#tab-parcelas tr.parcela--perto td,
#tab-lancamentos tr.parcela--perto td { background: #fef0ad; }
#tab-parcelas tr.parcela--perto td:first-child,
#tab-lancamentos tr.parcela--perto td:first-child { box-shadow: inset 3px 0 0 #d99a00; }
#tab-parcelas tr.parcela--perto input,
#tab-parcelas tr.parcela--perto select,
#tab-lancamentos tr.parcela--perto input,
#tab-lancamentos tr.parcela--perto select { border-color: #ecd067; }

/* despesa fixa mensal: coluna "Parcela" não faz sentido */
#tab-lancamentos.sem-parcela th:nth-child(3),
#tab-lancamentos.sem-parcela td:nth-child(3) { display: none; }

/* lançamento que saiu de outra conta (não a padrão da saída) */
#tab-lancamentos select.conta-avulsa { border-color: var(--laranja); color: var(--laranja-hover); font-weight: 700; }

/* só parcela de boleto precisa de "Cliente avisado" */
#tab-parcelas.sem-aviso th:nth-child(5),
#tab-parcelas.sem-aviso td:nth-child(5) { display: none; }

/* linha já paga: abre travada (fundo verde), o lápis libera a edição
   (parcelas da apólice e lançamentos da saída funcionam igual) */
#tab-lancamentos [data-editar-lancamento],
#tab-parcelas [data-editar-parcela] { display: none; }
#tab-lancamentos tr.lancamento--travada [data-editar-lancamento],
#tab-parcelas tr.parcela--travada [data-editar-parcela] { display: inline-flex; }
#tab-lancamentos tr.lancamento--travada [data-remover-lancamento],
#tab-parcelas tr.parcela--travada [data-remover-parcela] { display: none; }
#tab-lancamentos tr.lancamento--travada td,
#tab-parcelas tr.parcela--travada td { background: #e7f3e7; }
#tab-lancamentos tr.lancamento--travada td:first-child,
#tab-parcelas tr.parcela--travada td:first-child { box-shadow: inset 3px 0 0 #5a9367; }
#tab-lancamentos tr.lancamento--travada input,
#tab-parcelas tr.parcela--travada input,
#tab-parcelas tr.parcela--travada select {
  background: #f3f9f3; border-color: #cfe3cf; color: var(--texto-suave); pointer-events: none;
}

/* linha destravada pelo lápis: o botão continua visível (vira "Salvar" via JS) */
#tab-lancamentos tr.linha-liberada [data-editar-lancamento],
#tab-parcelas tr.linha-liberada [data-editar-parcela],
.tab-fluxo tr.linha-liberada [data-editar] { display: inline-flex; }
#tab-lancamentos tr.linha-liberada [data-remover-lancamento],
#tab-parcelas tr.linha-liberada [data-remover-parcela],
.tab-fluxo tr.linha-liberada [data-remover] { display: none; }

/* faixa dos campos "total do relatório da corretora" (diferencia da tabela acima) */
.rel-box {
  margin-top: 10px; padding: 10px 12px; border-radius: var(--raio);
  background: var(--fundo); border: 1px solid var(--linha);
}
.rel-box .grade { margin-bottom: 0; }
.rel-box .campo input { background: var(--branco); }

/* aviso de divergência (total do relatório × soma do sistema) */
.aviso-diverge { color: #b26a00; font-weight: 700; font-size: 12px; }

/* conferência da regra dos 75% (repasse × comissão) */
.conferencia {
  margin-top: 16px; padding: 10px 12px; border-radius: var(--raio);
  background: var(--fundo); border: 1px solid var(--linha); font-size: 12.5px; line-height: 1.7;
}
/* agenciamento (seguro de vida): coluna "Tipo" das tabelas de comissão só aparece
   quando a apólice tem agenciamento */
#dlg-comissao:not(.com-agenc) .col-agenc { display: none; }
/* Calculada × Lançada × Paga */
.conf-tab { font-size: 12px; }
.conf-tab th, .conf-tab td { padding-left: 8px; padding-right: 8px; }
.conf-info { margin-top: 3px; color: var(--texto-suave); line-height: 1.55; }
.conf-info strong { color: var(--texto); font-weight: 600; }
.conf-tab td { vertical-align: top; }
.conf-tab th.grp { text-align: center; border-bottom: 1px solid var(--linha); }
.conf-tab th small { text-transform: none; letter-spacing: 0; font-weight: 600; color: var(--texto-suave); }
.conf-tab td.sep, .conf-tab th.sep { border-left: 2px solid var(--linha); }
.conf-tab td.col-valor { white-space: nowrap; font-variant-numeric: tabular-nums; }
.conf-tab .dif { display: block; font-size: 11px; color: #b26a00; white-space: normal; }
.conf-tab td:first-child { min-width: 250px; }
.conf-tab .calc-linha { display: block; }
.conf-tab .calc-linha small { color: var(--texto-suave); margin-right: 3px; }
.conf-tab .calc-linha--normal { color: var(--texto-suave); text-decoration: line-through; text-decoration-color: #b9bec4; }
.conf-tab .calc-linha--normal small { text-decoration: none; display: inline-block; }
.conf-tab .calc-linha--real { font-weight: 600; }
.conf-tab .dif--alta { color: var(--erro); font-weight: 600; }
.conf-balanco { display: block; font-size: 11px; color: var(--texto-suave); white-space: nowrap; }
.conf-dif-paga { font-size: 11px; font-weight: 600; color: var(--texto-suave); font-variant-numeric: tabular-nums; }
.conf-dif-paga--menos { color: var(--erro); }
.conf-dif-paga--mais { color: var(--ok); }
.conf-tab tr.conf-subtotal td { background: #f4f5f6; border-top: 1px solid var(--linha); }
.sit { display: inline-block; padding: 1px 8px; border-radius: 9px; font-size: 11px; font-weight: 700; margin: 1px 0; }
.sit--sem_lancamento, .sit--atrasada { background: #fde7e5; color: #b3261e; }
.sit--divergente, .sit--sem_base { background: #fff1d6; color: #8a5a00; }
.sit--a_receber { background: #e6eef8; color: #2a5a94; }
.sit--cancelada { background: #2b2b2b; color: #fff; }
.sit--ok { background: #e3f3e5; color: #2f7d32; }
a.stat { text-decoration: none; display: block; }
a.stat:hover { border-color: var(--laranja); }
a.stat--ativo { border-color: var(--laranja); box-shadow: inset 0 0 0 1px var(--laranja); }
/* parcela de cocorretagem compensada (não passou pela conta corrente) */
.tag-comp {
  display: inline-block; padding: 1px 7px; border-radius: 9px; font-size: 11.5px;
  background: #e6eef8; color: #2a5a94; text-decoration: none; white-space: nowrap;
}
.tag-comp:hover { background: #d5e3f5; }
.selo-comp { color: #2a5a94; font-weight: 700; }
.selo-comp-aberta { display: block; color: #b26a00; font-size: 10.5px; white-space: nowrap; }
.tag-agenc {
  display: inline-block; margin-top: 2px; padding: 0 5px; border-radius: 8px;
  font-size: 10.5px; line-height: 16px; background: #fdebdc; color: #b24a10;
}
.conferencia strong { display: block; margin-bottom: 3px; font-size: 12px; color: var(--texto); }
.conferencia .ok, .selo-ok { color: #2f7d32; font-weight: 700; }
.conferencia .ruim, .selo-ruim { color: #b26a00; font-weight: 700; }

/* janela (dialog) — usada pela comissão parcelada */
dialog.dlg {
  width: min(900px, 94vw); max-height: 96vh; padding: 0; border: none; overflow: hidden;
  border-radius: var(--raio); box-shadow: 0 24px 70px rgba(20, 20, 25, .35);
  background: var(--branco); color: var(--texto);
}
dialog.dlg[open] { display: flex; flex-direction: column; }
dialog.dlg--estreita { width: min(480px, 94vw); }
dialog.dlg::backdrop { background: rgba(20, 20, 25, .45); }

/* cabeçalho estilo "barra de título" de janela */
.dlg__cab {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 10px 12px 10px 16px; background: var(--grafite); color: var(--texto-inv);
  flex: 0 0 auto;
}
.dlg__cab strong { font-size: 13px; font-weight: 700; color: #fff; letter-spacing: .02em; }
.dlg__cab .btn {
  background: transparent; border-color: rgba(255, 255, 255, .28); color: #fff;
}
.dlg__cab .btn:hover { background: rgba(255, 255, 255, .14); border-color: rgba(255, 255, 255, .5); }
.dlg__corpo { padding: 14px 18px 18px; overflow-y: auto; flex: 1 1 auto; }
.dlg__rodape {
  display: flex; gap: 8px; justify-content: flex-end;
  padding: 12px 18px; border-top: 1px solid var(--linha); background: var(--fundo);
  position: sticky; bottom: 0;
}

/* subtítulo de seção dentro de um cartão (ex.: tabelas de comissão / repasse) */
.titulo-secao {
  margin: 26px 0 10px; padding-bottom: 6px; font-size: 14px; font-weight: 700;
  color: var(--laranja-hover); border-bottom: 2px solid var(--laranja-fraco);
}
.titulo-secao span { font-weight: 600; color: var(--texto-suave); font-size: 12.5px; }
/* "Repasses"/"Plenus" é o nome da seção (span só p/ o JS trocar o texto na cocorretagem):
   mantém o mesmo destaque do "Comissão" ao lado */
.titulo-secao span#tit-repasse-a { font-weight: 700; color: var(--laranja-hover); font-size: 14px; }

/* ---------- tabelas de comissão / repasse (mesmo padrão) ---------- */
.tab-fluxo { max-width: 660px; }                 /* campos são curtos: tabela não estica */
.tab-fluxo td { padding: 7px 8px; vertical-align: middle; }
.tab-fluxo tbody td input,
.tab-fluxo tbody td select {
  width: 100%; font: inherit; font-size: 13.5px; padding: 8px 10px;
  border: 1px solid var(--linha); border-radius: var(--raio);
  background: var(--branco); color: var(--texto);
}
.tab-fluxo tbody td input:focus-visible,
.tab-fluxo tbody td select:focus-visible {
  outline: none; border-color: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-fraco);
}
/* na janela a tabela usa toda a largura, e o campo de valor nunca fica menor
   que "00.000,00" (a coluna de data do depósito espremia o "Pago") */
dialog.dlg .tab-fluxo { max-width: none; width: 100%; }
dialog.dlg .tab-fluxo tbody td input[data-num] { min-width: 104px; }
.tab-fluxo td.acoes { text-align: center; }
.tab-fluxo [data-editar] { display: none; }
.tab-fluxo tr.linha-travada [data-editar] { display: inline-flex; }
.tab-fluxo tr.linha-travada [data-remover] { display: none; }
.tab-fluxo tr.linha-travada td { background: #e7f3e7; }
.tab-fluxo tr.linha-travada td:first-child { box-shadow: inset 3px 0 0 #5a9367; }
.tab-fluxo tr.linha-travada input,
.tab-fluxo tr.linha-travada select {
  background: #f3f9f3; border-color: #cfe3cf; color: var(--texto-suave); pointer-events: none;
}
/* "Conferido no banco": segue editável mesmo com a linha travada pelo "recebido" */
.tab-fluxo th small { font-weight: 400; color: var(--texto-suave); }
.tab-fluxo td.col-conf { text-align: center; }
.tab-fluxo tr.linha-travada select[data-conf] {
  background: var(--branco); border-color: var(--linha); color: var(--texto); pointer-events: auto;
}
.tab-fluxo tr.linha-conferida select[data-conf] {
  border-color: var(--ok); color: var(--ok); font-weight: 700;
}
.tab-fluxo tr.linha-conferida td:first-child { box-shadow: inset 3px 0 0 var(--ok); }

/* ---------- grade editável do menu Entradas ---------- */
.ent-bloco { background: var(--branco); border: 1px solid var(--linha);
  border-radius: var(--raio); box-shadow: var(--sombra);
  padding: 14px 16px; margin-bottom: 14px; }
.ent-bloco--endosso { border-left: 3px solid var(--laranja); }
.ent-bloco__cab { padding: 0 0 8px; }
.ent-bloco__cab strong { font-size: 13.5px; }
.ent-bloco__cab small { color: var(--texto-suave); font-size: 12px; }
.ent-ap-link { color: inherit; font: inherit; text-decoration: none; }
.ent-ap-link:hover { color: var(--laranja-hover); }
.ent-bloco__acoes { display: flex; gap: 8px; align-items: center; padding: 8px 0 0; }
.ent-bloco__soma { color: var(--texto-suave); font-size: 12px; margin-left: 6px; }

.ent-grupo-cab { font-weight: 700; color: var(--laranja-hover); font-size: 13px;
  margin: 22px 0 10px; padding-bottom: 4px; border-bottom: 1px solid var(--linha); }
.ent-grupo-cab--2 { font-size: 12px; color: var(--texto-suave); font-weight: 600;
  margin: 12px 0 8px 10px; border-bottom: none; }

.ent-grid { max-width: none; width: 100%; table-layout: fixed; min-width: 940px; }
.ent-grid td, .ent-grid thead th { padding-left: 2px; padding-right: 2px; }   /* gruda as colunas */
.ent-grid td { padding-top: 4px; padding-bottom: 4px; }
/* caixinha menor (vence .tab-fluxo tbody td input na especificidade) */
.ent-grid tbody td input, .ent-grid tbody td select {
  width: 100%; min-width: 0; padding: 4px 6px; font-size: 12.5px;
}
.ent-grid tbody td input[type="date"] { font-size: 12px; }
.ent-grid thead th { text-align: center; font-size: 10.5px; line-height: 1.25; }
.ent-grid th small { display: block; text-transform: none; letter-spacing: 0;
  font-weight: 400; color: var(--texto-suave); }
/* título e valor da coluna alinhados à direita, com a mesma folga da borda */
.ent-grid thead th.col-valor { text-align: right; padding-right: 8px; }
.ent-grid td.col-valor { padding-right: 0; }
.ent-grid tbody td.col-valor input { text-align: right; padding-right: 8px; font-variant-numeric: tabular-nums; }
.ent-grid .ent-parcela { text-align: center; }
.ent-grid .ent-parc-fixa {
  display: block; text-align: center; color: var(--texto-suave); font-size: 12px; }
.ent-grid .ent-sep { border-left: 2px solid var(--linha); }
.ent-grid td.ent-situacao { text-align: center; font-size: 11.5px; }
.ent-grid td.ent-situacao .selo-pago { color: var(--ok); font-weight: 700; }
.ent-grid td.ent-situacao .selo-apagar { color: var(--texto-suave); }

/* ---------- barra de busca ---------- */
.busca { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; max-width: 420px; }
.busca__campo { position: relative; flex: 1; }
.busca__campo svg { position: absolute; left: 10px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--texto-suave); }
.busca__campo input { padding-left: 32px; }

/* ---------- painel de filtros (lista de apólices) ---------- */
.filtros .grade { align-items: end; }
.campo-busca { position: relative; }
.campo-busca svg { position: absolute; left: 11px; top: 50%; transform: translateY(-50%); width: 16px; height: 16px; color: var(--texto-suave); pointer-events: none; }
.campo-busca input { padding-left: 34px; }
.filtros__acoes { display: flex; gap: 8px; margin-top: 14px; }
/* total do que a busca trouxe, à direita dos botões */
.filtros__soma { margin-left: auto; align-self: center; font-size: 13px; font-weight: 700; color: var(--laranja); white-space: nowrap; }
.filtros__soma strong { color: var(--texto); font-size: 15px; }
/* botões na mesma linha dos campos (como mais uma coluna da .grade), alinhados embaixo */
.filtros__acoes--na-linha { margin-top: 0; align-self: end; }
/* variante de 1 linha: campo estreito + botões ao lado (card mais baixo) */
.filtros--linha { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; }
.filtros--linha .campo { flex: 0 1 260px; }
.filtros--linha .campo--busca { flex-basis: 340px; }
.filtros--linha .campo--medio { flex-basis: 190px; }
.filtros--linha .campo--curto { flex-basis: 120px; }
.filtros--linha .campo--mini { flex-basis: 90px; }

/* ---------- overlay do menu mobile ---------- */
.overlay { display: none; position: fixed; inset: 0; background: rgba(0, 0, 0, .4); z-index: 40; }

/* ---------- responsivo ---------- */
@media (max-width: 860px) {
  .app, .app.recolhido { grid-template-columns: 1fr; }
  .barra {
    position: fixed; left: 0; top: 0; z-index: 50; width: var(--barra-larga); height: 100dvh;
    transform: translateX(-100%); transition: transform .22s ease;
  }
  .app.menu-aberto .barra { transform: translateX(0); }
  .app.menu-aberto .overlay { display: block; }
  .barra__fechar { display: inline-flex; background: none; border: none; color: var(--texto-inv-suave); cursor: pointer; padding: 4px; }
  .barra__fechar svg { width: 20px; height: 20px; }
  .barra__recolher { display: none; }
  .app.recolhido .marca__nome, .app.recolhido .nav__texto { display: inline; }
  .app.recolhido .nav__item { justify-content: flex-start; gap: 12px; }
  .app.recolhido .nav__grupo.aberto > .nav__filhos { display: flex; }
  .topo__menu { display: inline-flex; background: none; border: 1px solid var(--linha); border-radius: var(--raio); padding: 7px; cursor: pointer; color: var(--texto); }
  .topo__menu svg { width: 18px; height: 18px; }
  .pagina { padding: 16px; }
  .grade { grid-template-columns: repeat(6, 1fr); }
  .c-2, .c-3, .c-4 { grid-column: span 3; }
  .c-5, .c-6, .c-7, .c-8, .c-9 { grid-column: 1 / -1; }
  .rel-periodo__campos { flex-wrap: wrap; }
  .rel-agrupar { flex-wrap: wrap; }
  .rel-linha1 { flex-wrap: wrap; }
  .rel-linha1 > .campo { flex-basis: 100%; }
}

/* serviço: escolha da apólice do cliente à qual o serviço está ligado */
.ap-opcoes { display: flex; flex-direction: column; gap: 6px; margin-bottom: 4px; }
.ap-opcao { display: flex; align-items: center; gap: 8px; padding: 8px 10px; cursor: pointer;
            border: 1px solid var(--linha); border-radius: 8px; font-size: 13px; }
.ap-opcao > span { flex: 1; }
.ap-opcao:hover { border-color: var(--laranja); }
.ap-opcao:has(input:checked) { border-color: var(--laranja); background: var(--laranja-fraco); }
.ap-opcao input { accent-color: var(--laranja); margin: 0; }

/* ---------- questionários ao cliente (Cotação › Perguntas / Enviar questionário) ---------- */
.titulo-com-acoes { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.titulo-com-acoes__acoes { display: inline-flex; gap: 14px; font-size: 12px; font-weight: 600; }
.titulo-com-acoes__acoes a { color: var(--texto-inv); display: inline-flex; align-items: center; gap: 4px; }
.titulo-com-acoes__acoes a:hover { color: var(--laranja); }
.titulo-com-acoes__acoes svg { width: 13px; height: 13px; }
/* bloco recolhível (Perguntas ao cliente; Contas pagas; Assistências fechadas) — começa fechado */
.q-bloco__alternar {
  display: inline-flex; align-items: center; gap: 8px; padding: 6px 0; margin: 0;
  border: 0; background: none; color: inherit; font: inherit; letter-spacing: inherit;
  cursor: pointer; text-align: left;
}
.q-bloco__alternar:hover { color: var(--laranja); }
.q-bloco__seta { display: inline-block; font-size: 11px; transition: transform .12s; }
.q-bloco__alternar[aria-expanded="true"] .q-bloco__seta { transform: rotate(90deg); }
.q-bloco__qtd { font-size: 11.5px; font-weight: 600; opacity: .75; }
.q-bloco--fechado.cartao--titulo > h2 { margin-bottom: 0; border-radius: var(--raio); }
.q-bloco[hidden] { display: none; }
/* tipos de seguro da pergunta, marcados na própria lista */
.q-tipos__ver {
  display: flex; align-items: flex-start; gap: 6px; width: 100%; padding: 2px 0; margin: 0;
  border: 0; background: none; font: inherit; color: inherit; cursor: pointer; text-align: left;
}
.q-tipos__chips { display: flex; flex-wrap: wrap; gap: 4px; flex: 1; }
.q-tipos__todos { color: var(--texto-suave); }
.q-tipos__lapis svg { width: 13px; height: 13px; color: var(--texto-suave); opacity: .45; }
.q-tipos__ver:hover .q-tipos__lapis svg, .q-tipos__ver[aria-expanded="true"] .q-tipos__lapis svg { color: var(--laranja); opacity: 1; }
.q-tipos__editar {
  display: flex; flex-direction: column; gap: 4px; margin-top: 6px; padding: 8px 10px;
  border: 1px solid var(--linha); border-radius: var(--raio); background: var(--fundo);
}
.q-tipos__editar[hidden] { display: none; }
.q-tipos__editar label { display: flex; align-items: center; gap: 7px; font-size: 12.5px; cursor: pointer; }
.q-tipos__editar input { accent-color: var(--laranja); margin: 0; }
.q-tipos__editar .dica { font-size: 11px; color: var(--texto-suave); }
/* vários marcáveis lado a lado (ex.: tipos de seguro da pergunta) */
.checks { display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 6px 0 2px; }
/* card "Seguros ofertados" da ficha do cliente: caixa + data por tipo de seguro */
.ofertados { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 10px 24px; }
.ofertado { display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 6px 10px; border: 1px solid var(--linha); border-radius: 8px; }
.ofertado label.check { display: flex; align-items: center; gap: 8px; font-size: 13px;
  font-weight: 600; color: var(--texto); cursor: pointer; }
.ofertado label.check input { accent-color: var(--laranja); margin: 0; }
.ofertado input[type=date] { width: 150px; flex: none; }
table.lista tr.linha-inativa td { color: var(--texto-suave); }
table.lista tr.linha-inativa .cel-nome { color: var(--texto-suave); font-weight: 400; }
.selo-q {
  display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 700;
  background: var(--aviso-fraco); color: var(--aviso); white-space: nowrap;
}
.selo-q--ok { background: var(--ok-fraco); color: var(--ok); }
.selo-q--fim { background: var(--fundo); color: var(--texto-suave); border: 1px solid var(--linha); }
.q-resumo { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px 20px; }
.q-resumo > div { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; }
.q-resumo__rot { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .03em; color: var(--texto-suave); }
.q-resumo a { color: var(--laranja-hover); font-weight: 600; }
.q-link { display: flex; gap: 8px; flex-wrap: wrap; }
.q-link input {
  flex: 1 1 320px; min-width: 0; font: inherit; font-size: 13px; padding: 8px 10px;
  border: 1px solid var(--linha); border-radius: var(--raio); background: var(--fundo); color: var(--texto);
}
.btn--whatsapp { background: #1f8a4c; color: #fff; }
.btn--whatsapp:hover { background: #18703d; color: #fff; }
table.lista.q-respostas th {
  width: 45%; text-align: left; font-weight: 600; color: var(--texto); background: none;
  text-transform: none; letter-spacing: 0; font-size: 13px; vertical-align: top;
}
table.lista.q-respostas td { white-space: pre-line; vertical-align: top; }
.q-docs { display: flex; flex-wrap: wrap; gap: 10px; white-space: normal; }
.q-doc { display: flex; flex-direction: column; gap: 2px; width: 84px; font-size: 11.5px; }
.q-doc img, .q-doc__pdf {
  display: flex; align-items: center; justify-content: center; width: 84px; height: 63px;
  object-fit: cover; border: 1px solid var(--linha); border-radius: var(--raio); background: var(--fundo);
}
.q-doc__pdf { font-weight: 700; color: var(--laranja); text-decoration: none; }
.q-doc__nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--texto-suave); }
.q-doc__baixar { font-weight: 600; }
.q-lista-perguntas { margin: 0; padding-left: 22px; color: var(--texto-suave); }
.q-lista-perguntas li { margin: 3px 0; }

/* página pública do questionário (celular primeiro, sem menu) */
.tela-publica { background: var(--fundo); min-height: 100dvh; }
.qp { max-width: 620px; margin: 0 auto; padding: 18px 16px 32px; }
.qp__topo { display: flex; justify-content: center; padding: 6px 0 16px; }
.qp__topo img { width: 100%; max-width: 280px; height: auto; }
.qp__aviso {
  background: var(--aviso-fraco); color: var(--aviso); border-radius: var(--raio);
  padding: 10px 14px; font-weight: 600; font-size: 13px; margin-bottom: 12px;
}
.qp__cartao {
  background: var(--branco); border: 1px solid var(--linha); border-radius: 12px;
  box-shadow: var(--sombra); padding: 20px 18px;
}
.qp__cartao h1 { margin: 0 0 6px; font-size: 20px; line-height: 1.25; color: var(--grafite); }
.qp__intro { margin: 0 0 16px; color: var(--texto-suave); font-size: 14px; }
.qp__obrig { color: var(--laranja-hover); font-weight: 700; }
.qp__erros {
  background: var(--erro-fraco); color: var(--erro); border: 1px solid #f0ccc9;
  border-radius: var(--raio); padding: 10px 14px; margin-bottom: 16px; font-size: 14px;
}
.qp__erros ul { margin: 6px 0 0; padding-left: 18px; }
.texto-alerta { color: var(--laranja-hover); font-weight: 600; }
.qp form { counter-reset: qp-pergunta; }
.qp__pergunta { padding: 14px 0; border-top: 1px solid var(--linha); counter-increment: qp-pergunta; }
.qp__pergunta[hidden] { display: none; }  /* escondida pela resposta anterior: não conta no número */
.qp__num::before { content: counter(qp-pergunta) ". "; }
/* pergunta de foto/documento: o input de arquivo fica escondido atrás de um botão */
.qp__arquivo { position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; cursor: pointer; }
.qp__pergunta .qp__arquivo input[type=file] {
  position: absolute; width: 1px; height: 1px; opacity: 0; overflow: hidden; pointer-events: none;
}
.qp__arquivo .btn { width: 100%; justify-content: center; padding: 12px; }
.qp__arquivo input[type=file]:focus-visible + .btn { box-shadow: 0 0 0 3px var(--laranja-fraco); }
.qp__arquivo-escolhidos { font-size: 13px; color: var(--texto); }
.qp__recebidos { list-style: none; margin: 0 0 8px; padding: 0; font-size: 13px; color: #1f7a3d; font-weight: 600; }
.qp__dica { margin: 6px 0 0; font-size: 12.5px; color: var(--texto-suave); }
.qp__rotulo { display: block; font-size: 15px; font-weight: 600; color: var(--texto); margin-bottom: 8px; }
.qp__pergunta input:not([type=radio]), .qp__pergunta select, .qp__pergunta textarea {
  font: inherit; font-size: 16px; /* 16px evita o zoom automático do iPhone */
  width: 100%; padding: 10px 12px; border: 1px solid var(--linha); border-radius: var(--raio);
  background: var(--branco); color: var(--texto);
}
.qp__pergunta textarea { resize: vertical; min-height: 60px; line-height: 1.45; }
.qp__pergunta input:focus-visible, .qp__pergunta select:focus-visible, .qp__pergunta textarea:focus-visible {
  outline: none; border-color: var(--laranja); box-shadow: 0 0 0 3px var(--laranja-fraco);
}
.qp__opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.qp__opcao { position: relative; cursor: pointer; }
.qp__opcao input { position: absolute; opacity: 0; pointer-events: none; }
.qp__opcao span {
  display: inline-block; padding: 9px 16px; border: 1px solid var(--linha); border-radius: 999px;
  font-size: 15px; background: var(--branco); color: var(--texto); transition: background .12s, border-color .12s;
}
.qp__opcao input:checked + span { background: var(--laranja); border-color: var(--laranja); color: #fff; font-weight: 600; }
.qp__opcao input:focus-visible + span { box-shadow: 0 0 0 3px var(--laranja-fraco); }
.qp__consentimento {
  display: flex; gap: 10px; align-items: flex-start; margin: 8px 0 18px; padding-top: 14px;
  border-top: 1px solid var(--linha); font-size: 13.5px; color: var(--texto-suave); cursor: pointer;
}
.qp__consentimento input { width: 20px; height: 20px; margin-top: 1px; flex: 0 0 auto; accent-color: var(--laranja); }
.qp__enviar { width: 100%; padding: 13px; font-size: 16px; }
.qp__fim { text-align: center; padding: 34px 20px; }
.qp__fim p { margin: 0; color: var(--texto-suave); }
.qp__rodape { text-align: center; margin-top: 18px; font-size: 12px; color: var(--texto-suave); letter-spacing: .06em; }

/* escolha entre duas opções em cartões (ex.: Enviar questionário › cliente cadastrado / pessoa nova) */
.rotulo-grupo { display: block; font-size: 11.5px; font-weight: 700; color: var(--texto-suave); margin-bottom: 4px; }
.escolha-dupla { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.escolha-dupla__op { position: relative; cursor: pointer; }
.escolha-dupla__op input { position: absolute; opacity: 0; pointer-events: none; }
.escolha-dupla__op span {
  display: flex; flex-direction: column; gap: 1px; padding: 9px 14px; height: 100%;
  border: 1px solid var(--linha); border-radius: var(--raio); background: var(--branco);
  transition: border-color .12s, background .12s;
}
.escolha-dupla__op strong { font-size: 13.5px; color: var(--texto); }
.escolha-dupla__op small { font-size: 11.5px; color: var(--texto-suave); }
.escolha-dupla__op:hover span { border-color: var(--laranja); }
.escolha-dupla__op input:checked + span { border-color: var(--laranja); background: var(--laranja-fraco); box-shadow: inset 0 0 0 1px var(--laranja); }
.escolha-dupla__op input:focus-visible + span { box-shadow: 0 0 0 3px var(--laranja-fraco); }
@media (max-width: 560px) { .escolha-dupla { grid-template-columns: 1fr; } }
.escolha-dupla__op strong { display: inline-flex; align-items: center; gap: 7px; }
.escolha-dupla__op strong svg { width: 17px; height: 17px; color: var(--laranja); }
a.escolha-dupla__op span { padding: 12px 16px; }
.titulo-lista { margin: 6px 0 10px; font-size: 14px; font-weight: 700; color: var(--texto); }
.troca-destinatario { justify-content: flex-end; align-items: flex-end; font-size: 12.5px; }
.troca-destinatario a { color: var(--laranja-hover); font-weight: 600; text-decoration: underline; }

/* ---------- importação do relatório de repasses (Recibos › Importar) ---------- */
.imp-sit { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: 11px;
  font-weight: 700; white-space: nowrap; border: 1px solid var(--linha);
  background: var(--fundo); color: var(--texto-suave); }
.imp-sit--confere { background: var(--ok-fraco); color: var(--ok); border-color: #bfe3cd; }
.imp-sit--centavos, .imp-sit--diferenca { background: var(--aviso-fraco); color: var(--aviso); border-color: #f1dca6; }
.imp-sit--nao_encontrado, .imp-sit--sem_parcela { background: var(--erro-fraco); color: var(--erro); border-color: #f0ccc9; }
table.imp-tab td { vertical-align: middle; }
table.imp-tab tbody { border-bottom: 1px solid var(--linha); }
table.imp-tab tr.imp-hoje td { border-bottom: 0; }
table.imp-tab td.imp-rot { font-size: 11px; font-weight: 700; color: var(--texto-suave); white-space: nowrap; }
table.imp-tab td.imp-muda { background: var(--laranja-fraco); font-weight: 700; }
table.imp-tab td.imp-igual { color: var(--texto-suave); }
table.imp-tab tbody.imp-off { opacity: .55; }
.imp-aviso { display: block; margin-top: 3px; font-size: 11px; color: var(--aviso); }
.imp-resumo { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }

/* importar parcelas do Core: botões de escolha quando o relatório tem mais de um documento */
.importar-core-escolha { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin-top: 8px; }