/* =====================================================================
   componentes.css · estilos das peças da versão 2.0 (MVC em PHP)
   Só aparência: cores, espaçamentos e disposição. Nenhuma regra de
   negócio e nenhum conteúdo é definido aqui.
   ===================================================================== */

[hidden] { display: none !important; }

/* Gráficos: cores de cada série */
.chart .serie-1, .legend i.serie-1 { fill: var(--brand); background: var(--brand); }
.chart .serie-2, .legend i.serie-2 { fill: var(--accent); background: var(--accent); }
.chart .serie-3, .legend i.serie-3 { fill: #5B8DD6; background: #5B8DD6; }
.chart .serie-4, .legend i.serie-4 { fill: #D9A441; background: #D9A441; }
.chart .serie-5, .legend i.serie-5 { fill: #9B6FC0; background: #9B6FC0; }
.chart .serie-6, .legend i.serie-6 { fill: #E07A5F; background: #E07A5F; }
.chart .serie-7, .legend i.serie-7 { fill: #5FA8A0; background: #5FA8A0; }
.chart .serie-8, .legend i.serie-8 { fill: var(--exc); background: var(--exc); }
.sw.serie-1 { background: var(--brand); } .sw.serie-2 { background: var(--accent); } .sw.serie-3 { background: #5B8DD6; }
.sw.serie-4 { background: #D9A441; } .sw.serie-5 { background: #9B6FC0; } .sw.serie-6 { background: #E07A5F; }
.sw.serie-7 { background: #5FA8A0; } .sw.serie-8 { background: var(--exc); }

/* Linha de sinistralidade */
.chart .linha { fill: none; stroke: var(--brand); stroke-width: 2; stroke-linejoin: round; }
.chart .ponto { stroke: var(--surface); stroke-width: 2; }
.chart .ponto.ok { fill: var(--ok); } .chart .ponto.warn { fill: var(--warn); } .chart .ponto.crit { fill: var(--crit); }
.chart .meta { stroke: var(--crit); stroke-width: 1.2; stroke-dasharray: 5 4; }
.chart .meta-txt { fill: var(--crit); font-weight: 600; }
.chart .val { fill: var(--ink); font-weight: 600; font-size: 10px; }

/* Rosca */
.chart.rosca { width: 160px; max-width: 45%; flex: none; }
.chart .rosca-total { fill: var(--ink); font-size: 15px; font-weight: 700; font-family: var(--f-display); }

/* Barras horizontais (ranking) */
.hbars { display: flex; flex-direction: column; gap: 9px; }
.hbar { display: grid; grid-template-columns: minmax(0, 38%) minmax(0, 1fr) auto; gap: 10px; align-items: center; font-size: .86rem; }
.hbar-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hbar-t { width: 100%; height: 10px; display: block; }
.hbar-t .trk { fill: var(--surface-2); }
.hbar-t .ok { fill: var(--ok); } .hbar-t .warn { fill: var(--warn); } .hbar-t .crit { fill: var(--crit); }
.hbar-t .serie-1 { fill: var(--brand); } .hbar-t .serie-2 { fill: var(--accent); }
.hbar-t .marca { stroke: var(--ink); stroke-width: .6; vector-effect: non-scaling-stroke; }
.hbar b { min-width: 58px; text-align: right; }
@media (max-width: 640px) { .hbar { grid-template-columns: minmax(0, 1fr) auto; } .hbar-t { grid-column: 1 / -1; grid-row: 2; } }

/* Card de indicador clicável */
a.kpi { color: inherit; text-decoration: none; transition: border-color .15s ease; }
a.kpi:hover { border-color: var(--accent); }

/* Botões */
.btn { text-decoration: none; display: inline-flex; align-items: center; gap: 6px; color: var(--ink); }
.btn.primary { color: #fff; }
.btn.perigo { color: var(--crit); }
.btn.perigo:hover { border-color: var(--crit); }
.btn.desativado { opacity: .45; pointer-events: none; }
form.inline { display: inline; margin: 0; }
.page-head .actions { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

/* Formulários */
.form-acoes { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding-top: 8px; border-top: 1px solid var(--line); margin-top: 4px; }
.form-login { display: flex; flex-direction: column; gap: 14px; }
.field label span { color: var(--crit); }
.produto-linha { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 12px; align-items: start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.produto-marca { display: flex; align-items: center; gap: 8px; padding-top: 22px; cursor: pointer; }
.produto-campos { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 12px; }
@media (max-width: 640px) {
  .produto-linha { grid-template-columns: minmax(0, 1fr); }
  .produto-marca { padding-top: 0; }
  .produto-campos { grid-template-columns: minmax(0, 1fr); }
}

/* Filtros da lista */
.tbl-tools .busca { flex: 1; min-width: 200px; }
.linha-filial td:first-child { padding-left: 26px; position: relative; }
.linha-filial td:first-child::before { content: ""; position: absolute; left: 12px; top: 50%; width: 8px; border-top: 1px solid var(--muted); }

/* Paginação */
.paginacao { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; padding-top: 6px; }

/* Ficha do cliente */
.dados { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 18px; margin: 0; }
.dado dt { font-size: .74rem; color: var(--muted); font-weight: 600; }
.dado dd { margin: 2px 0 0; font-size: .9rem; overflow-wrap: anywhere; }
.obs { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); font-size: .86rem; }
.contato { display: flex; flex-direction: column; gap: 2px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.contato:last-child { border-bottom: 0; }
.contato .sub { font-size: .8rem; color: var(--muted); }
@media (max-width: 520px) { .dados { grid-template-columns: minmax(0, 1fr); } }

/* Mensagens do topo */
.alerts .alert { background: var(--surface); border: 1px solid var(--line); }

/* Página de erro */
.pagina-erro { min-height: 100vh; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 12px; max-width: 560px; margin: 0 auto; padding: 32px 16px; }
.pagina-erro img { margin-bottom: 12px; }

/* Menu: item da versão antiga */
.nav-item .ph { margin-left: auto; }
.brand a { display: block; }

/* Relatório da importação */
.avisos { margin: 0; padding-left: 18px; font-size: .84rem; color: var(--muted); display: flex; flex-direction: column; gap: 4px; }

/* Listas (aniversariantes, contatos) */
.list-item .sub { display: block; font-size: .78rem; color: var(--muted); }
a.chip { color: inherit; text-decoration: none; }
td.mono { white-space: nowrap; }
.contato-topo { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.aviso-menu { font-size: .82rem; color: var(--side-ink); padding: 0 6px; }

/* Etapa 2 */
.rotulo-grupo { font-size: .78rem; font-weight: 600; color: var(--muted); }
.checks { display: flex; gap: 14px; flex-wrap: wrap; }
.checks label { display: flex; align-items: center; gap: 6px; font-size: .9rem; cursor: pointer; }
.grupo-dependente > .dform { padding: 0; }
.arquivo-atual { display: flex; flex-direction: column; gap: 6px; }
.arquivo-atual label { display: flex; align-items: center; gap: 6px; font-size: .86rem; color: var(--crit); cursor: pointer; }
.form-status { margin-bottom: 8px; }
.obs-linha { margin: 2px 0 0; font-size: .84rem; }
td.resumo { max-width: 340px; color: var(--muted); }
td.detalhes { font-size: .8rem; color: var(--muted); max-width: 360px; }
.chip.estatico { cursor: default; }
.marcar-todas { display: flex; align-items: center; gap: 6px; font-size: .84rem; cursor: pointer; }
.leitura { color: var(--ok); }
.alert .btn { margin-right: 12px; }

/* Importação por produto e método */
.importacao { display: flex; flex-direction: column; gap: 16px; }
.passo { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--brand); color: #fff; font-size: .8rem; margin-right: 8px; }
.cartoes { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.cartao { position: relative; display: flex; gap: 10px; align-items: flex-start; border: 1px solid var(--line); border-radius: 12px; padding: 14px; cursor: pointer; background: var(--surface); transition: border-color .15s ease, box-shadow .15s ease; }
.cartao:hover { border-color: var(--muted); }
.cartao input { margin-top: 3px; accent-color: var(--accent); }
.cartao:has(input:checked), .cartao.marcado { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); background: var(--accent-soft); }
.cartao-corpo { display: flex; flex-direction: column; gap: 4px; }
.cartao-corpo .muted { font-size: .82rem; }
.cartao-rodape { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; }
.resumo-importacao { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 6px; }
.titulo-erro { color: var(--crit); }
.erros-lista li { color: var(--crit); }
.carga-inicial { display: flex; gap: 10px; align-items: flex-start; margin-top: 10px; padding: 12px; border: 1px dashed var(--warn); border-radius: 10px; background: var(--warn-soft); font-size: .86rem; cursor: pointer; }
.carga-inicial input { margin-top: 3px; }
.cobertura { display: inline-block; margin: 0 8px 2px 0; font-size: .8rem; white-space: nowrap; }

/* ---------------------------------------------------------------------
   Etapa 3: contratos, indicadores e análises
   --------------------------------------------------------------------- */
.sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.nowrap { white-space: nowrap; }
.mp-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 14px; }
.mp-head .actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
a.chip { color: inherit; text-decoration: none; }
.panel-head .chips { justify-content: flex-end; }

.radar-dot.crit { background: var(--crit); } .radar-dot.warn { background: var(--warn); } .radar-dot.ok { background: var(--ok); }
.acao-radar { min-width: 210px; }

/* Simulador */
.sim-topo { display: flex; gap: 14px; align-items: center; flex-wrap: wrap; }
.sim-topo .select { max-width: 520px; flex: 1 1 320px; }
.premissas { gap: 18px; }
.badge.grande { font-size: .95rem; padding: 4px 12px; }
.kpi.economia { background: var(--ok-soft); border-color: transparent; margin: 12px 0; }
.kpi.economia .v { color: var(--ok); }
.sens td.ok { background: var(--ok-soft); } .sens td.warn { background: var(--warn-soft); } .sens td.crit { background: var(--crit-soft); }
.sens th { text-align: center; }
.sens td.rot, .sens th:first-child { text-align: left; }

/* Histórico de valores do contrato */
details.comp { margin-top: 12px; }
details.comp .dform { margin-top: 12px; }
.btn.ghost.sm { padding: 3px 8px; }
.simulador { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.simulador > *, .simulador .panel { min-width: 0; }
.sens th:first-child { white-space: normal; min-width: 110px; }

/* Contrato: cliente novo cadastrado no próprio formulário */
.novo-cliente { background: var(--surface-2); border: 1px dashed var(--line); border-radius: 12px; padding: 12px 14px 14px; }
.novo-cliente .help { margin: 0 0 10px; }
.plano-aviso { color: var(--accent); font-weight: 600; }

/* Bloco de campos que aparece ou some inteiro (ex.: matriz e filiais só para empresa) */
.bloco-form h3 { margin: 6px 0 10px; }
.bloco-form > .help { margin: 0 0 10px; }

/* ===== Etapa 4 ===== */
/* Agenda: lista por dia */
.ag-dia { margin: 18px 0 6px; font-size: .9rem; color: var(--muted); font-weight: 600; }
.ag-dia:first-of-type { margin-top: 6px; }
.ag-dia.hoje { color: var(--accent); }
.ag-lista { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.ag-lista + .ag-dia { margin-top: 18px; }
.alert + .ag-lista { margin-bottom: 14px; }
.ag-item { display: grid; grid-template-columns: 92px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line); background: var(--surface); }
.ag-item:last-child { border-bottom: 0; }
.ag-item.cancelado .ag-corpo b { text-decoration: line-through; color: var(--muted); }
.ag-hora { display: flex; flex-direction: column; font-variant-numeric: tabular-nums; }
.ag-hora span { font-weight: 600; }
.ag-hora b + span { font-weight: 400; color: var(--muted); font-size: .82rem; }
.ag-corpo { min-width: 0; display: flex; flex-direction: column; }
.ag-corpo .sub { font-size: .8rem; color: var(--muted); }
.ag-acoes { display: flex; gap: 6px; align-items: center; justify-content: flex-end; flex-wrap: wrap; }
@media (max-width: 640px) {
  .ag-item { grid-template-columns: 64px minmax(0, 1fr); }
  .ag-acoes { grid-column: 1 / -1; justify-content: flex-start; }
}

/* Agenda: calendário do mês */
.cal-topo { display: flex; align-items: center; gap: 10px; margin: 4px 0 12px; }
.cal-topo h2 { min-width: 170px; text-align: center; font-size: 1.15rem; }
.cal { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.cal-sem, .cal-grade { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); }
.cal-sem span { padding: 6px 8px; font-size: .74rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; background: var(--surface-2); }
.cal-dia { min-height: 104px; padding: 6px; border-top: 1px solid var(--line); border-left: 1px solid var(--line); display: flex; flex-direction: column; gap: 3px; min-width: 0; background: var(--surface); }
.cal-dia:nth-child(7n + 1) { border-left: 0; }
.cal-dia.fora { background: var(--bg); }
.cal-dia.fora .cal-num { color: var(--exc); }
.cal-num { align-self: flex-start; font-weight: 600; font-size: .82rem; color: var(--ink); text-decoration: none; border-radius: 99px; min-width: 24px; height: 24px; display: inline-flex; align-items: center; justify-content: center; padding: 0 6px; }
.cal-num:hover { background: var(--accent-soft); }
.cal-dia.hoje .cal-num { background: var(--accent); color: #fff; }
.cal-sem-m { display: none; }
.cal-ev { display: block; font-size: .74rem; line-height: 1.3; padding: 3px 6px; border-radius: 6px; text-decoration: none; color: var(--ink); background: var(--info-soft); border-left: 3px solid var(--info); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-ev.ok { background: var(--ok-soft); border-left-color: var(--ok); }
.cal-ev.canc { background: var(--surface-2); border-left-color: var(--exc); color: var(--muted); text-decoration: line-through; }
.cal-ev:hover { filter: brightness(.96); }
.cal-dica { font-size: .8rem; margin-top: 8px; }
@media (max-width: 760px) {
  .cal-sem { display: none; }
  .cal-grade { grid-template-columns: minmax(0, 1fr); }
  .cal-dia { min-height: 0; border-left: 0; flex-direction: row; flex-wrap: wrap; align-items: center; }
  .cal-dia.vazio, .cal-dia.fora { display: none; }
  .cal-sem-m { display: inline; font-weight: 400; color: var(--muted); }
  .cal-num { min-width: 96px; justify-content: flex-start; }
  .cal-ev { white-space: normal; flex: 1 1 100%; }
}

/* Comunicado */
.comunicado-texto { display: flex; flex-direction: column; gap: 12px; max-width: 72ch; line-height: 1.65; margin-bottom: 14px; }

/* Newsletters */
.nl-models a.modelo { display: block; border: 1px solid var(--line); background: var(--surface); border-radius: 10px; padding: 12px; font-weight: 600; color: var(--ink); text-decoration: none; }
.nl-models a.modelo span { display: block; font-weight: 400; font-size: .76rem; color: var(--muted); margin-top: 2px; }
.nl-models a.modelo:hover { border-color: var(--accent); background: var(--accent-soft); }
.nl-models a.modelo i { display: inline-block; width: 9px; height: 9px; border-radius: 50%; margin-right: 7px; vertical-align: 1px; background: #079A78; }
.nl-models .tema-azul i { background: #1D4E9E; } .nl-models .tema-alerta i { background: #B45309; } .nl-models .tema-festa i { background: #0B9C80; }
.nl-ed > .panel { min-width: 0; }
.nl-prev iframe { width: 100%; height: 760px; border: 1px solid var(--line); border-radius: 10px; background: #EEF2F3; }
.nl-variaveis { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; margin-bottom: -6px; font-size: .82rem; }
.nl-clientes { max-height: 240px; overflow: auto; border: 1px solid var(--line); border-radius: 10px; padding: 8px 12px; display: flex; flex-direction: column; gap: 4px; }
.nl-clientes label { display: flex; gap: 8px; align-items: center; font-size: .88rem; font-weight: 400; cursor: pointer; }
.nl-clientes input { accent-color: var(--accent); }
.nl-clientes .rotulo-grupo { font-size: .72rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; margin-top: 6px; }
.nl-passo { margin: 18px 0 8px; }
.nl-lista { max-height: 420px; overflow: auto; }
.grid.cols-2e > .nl-prev { position: static; }

/* Relatórios */
.rel-lista { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; margin-bottom: 16px; }
.rel-card { display: flex; flex-direction: column; gap: 6px; padding: 16px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--ink); text-decoration: none; box-shadow: var(--shadow); }
.rel-card b { font-family: var(--f-display); font-size: 1rem; }
.rel-card span { color: var(--muted); font-size: .86rem; }
.rel-card:hover { border-color: var(--accent); background: var(--accent-soft); }
form.rel-filtros { display: flex; flex-direction: row; flex-wrap: wrap; align-items: flex-end; gap: 12px; margin: 0 0 16px; padding: 14px 16px; }
.rel-filtro { display: flex; flex-direction: column; gap: 4px; font-size: .78rem; color: var(--muted); font-weight: 600; }
.rel-filtro .select, .rel-filtro .input { min-width: 170px; }
.rel-texto { flex: 1 1 100%; font-size: .8rem; }
.rel-table td .lnk { white-space: nowrap; }
.rel-outros { margin-top: 12px; }
.nl-agora { border-color: var(--accent); background: var(--accent-soft); }
.nl-sem-m365 { font-size: .82rem; margin-top: 12px; }

/* ---------- Mapa de clientes ---------- */
/* O mapa ocupa a largura toda que sobra e a altura da janela */
.mapa-grid { grid-template-columns: minmax(0, 1fr) clamp(260px, 22vw, 340px); align-items: stretch; }
.mapa-painel { display: flex; flex-direction: column; min-width: 0; }
.mapa-grid:fullscreen { background: var(--bg); padding: 16px; overflow: auto; }
.mapa-grid:fullscreen .mapa-area { height: calc(100vh - 150px); }
.mapa-grid:fullscreen .lista-estados .estados { max-height: calc(100vh - 170px); }
.mapa-painel .panel-head { align-items: flex-start; }
.trilha { font-size: .78rem; color: var(--muted); }
.trilha b { color: var(--ink); font-weight: 600; }
.acoes-mapa { display: flex; gap: 8px; flex-wrap: wrap; }
.mapa-area { margin: 8px 0 4px; height: calc(100vh - 210px); min-height: 460px; flex: 1 1 auto; }
.mapa-svg { display: block; width: 100%; height: 100%; animation: mapa-entra .35s ease-out; }
.mapa-area.saindo .mapa-svg { opacity: 0; transform: scale(.97); transition: opacity .18s ease, transform .18s ease; }
@keyframes mapa-entra { from { opacity: 0; transform: scale(.97); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .mapa-svg, .mapa-area.saindo .mapa-svg { animation: none; transition: none; } }
.mapa-svg path, .mapa-svg circle { stroke: #FFFFFF; stroke-width: 1; vector-effect: non-scaling-stroke; stroke-linejoin: round; transition: fill .15s ease; }
.mapa-uf path { stroke-width: .5; }
.mapa-svg a { cursor: pointer; outline: none; }
.mapa-svg a:hover path, .mapa-svg a:hover circle, .mapa-svg a:focus-visible path { stroke: var(--ink); stroke-width: 1.6; }
.mapa-svg .mp-sel path, .mapa-svg .mp-sel circle { stroke: var(--ink); stroke-width: 2.2; }
.mp-0 path, .mp-0 circle, .leg-0 { fill: #EEF3F3; background: #EEF3F3; }
.mp-1 path, .mp-1 circle, .leg-1 { fill: #CCEFE4; background: #CCEFE4; }
.mp-2 path, .mp-2 circle, .leg-2 { fill: #97DEC7; background: #97DEC7; }
.mp-3 path, .mp-3 circle, .leg-3 { fill: #52C2A2; background: #52C2A2; }
.mp-4 path, .mp-4 circle, .leg-4 { fill: #129675; background: #129675; }
.mp-5 path, .mp-5 circle, .leg-5 { fill: #085C4B; background: #085C4B; }
.mapa-rotulos { pointer-events: none; }
.mapa-rotulos rect { fill: #FFFFFF; stroke: var(--ink); stroke-width: 1; vector-effect: non-scaling-stroke; }
.mapa-rotulos text { fill: var(--ink); font-family: var(--f-body); font-weight: 700; text-anchor: middle; }
.mapa-rotulos text.sigla { font-weight: 600; paint-order: stroke; stroke: #FFFFFF; stroke-width: 3px; stroke-linejoin: round; }
.mapa-legenda { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .74rem; color: var(--muted); margin-top: 4px; }
.mapa-legenda span { display: inline-flex; align-items: center; gap: 6px; }
.mapa-legenda i { width: 14px; height: 10px; border-radius: 3px; border: 1px solid var(--line); }
.lista-estados { display: flex; flex-direction: column; min-width: 0; }
.lista-estados .estados { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 2px; max-height: calc(100vh - 170px); min-height: 420px; overflow: auto; flex: 1 1 auto; }
.estado-item { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 7px 8px; border-radius: 8px; color: inherit; text-decoration: none; }
.estado-item:hover { background: var(--surface-2); }
.estado-item.atual { background: var(--accent-soft); box-shadow: inset 3px 0 0 var(--accent); }
.estado-item .sigla { font-family: var(--f-mono); font-size: .76rem; font-weight: 600; color: var(--muted); }
.estado-item .nome { display: flex; flex-direction: column; gap: 4px; font-size: .86rem; min-width: 0; }
.estado-item .num { text-align: right; font-variant-numeric: tabular-nums; font-weight: 600; font-size: .9rem; }
.estado-item .num small { display: block; font-weight: 400; color: var(--muted); font-size: .7rem; }
.sem-clientes { margin-top: 10px; line-height: 1.8; }
.barra { display: block; width: 100%; height: 5px; margin-top: 3px; }
.barra rect { fill: var(--accent); }
.barra rect.fundo { fill: var(--surface-2); }
table.rank { width: 100%; }
table.rank tr.atual td { background: var(--accent-soft); }
.fonte-mapa { margin-top: 4px; }
@media (max-width: 900px) { .mapa-grid { grid-template-columns: minmax(0, 1fr); } .mapa-area { height: auto; min-height: 0; } .mapa-svg { height: auto; max-height: 75vh; } .lista-estados .estados { max-height: 360px; min-height: 0; } }

/* ---------- Usuários: acessos ---------- */
.acessos { display: flex; flex-direction: column; gap: 10px; }
.acesso-tipo, .acesso-excluir { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; background: var(--surface); }
.acesso-tipo:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.acesso-tipo input, .acesso-excluir input, .acessos-tabela input, .acesso-carteira input { accent-color: var(--accent); width: 18px; height: 18px; margin-top: 2px; flex: none; }
.acesso-tipo span, .acesso-excluir span { display: flex; flex-direction: column; gap: 2px; }
.acesso-tipo small, .acesso-excluir small, .acessos-tabela th small { color: var(--muted); font-size: .78rem; font-weight: 400; }
.acessos-lista { display: flex; flex-direction: column; gap: 12px; padding-left: 30px; }
.acesso-carteira { border: 1px solid var(--line); border-radius: 10px; padding: 10px 14px 12px; display: flex; flex-wrap: wrap; gap: 8px 22px; align-items: center; margin: 0; }
.acesso-carteira legend { font-weight: 600; font-size: .86rem; padding: 0 4px; }
.acesso-carteira label { display: inline-flex; gap: 8px; align-items: center; cursor: pointer; }
.acesso-produtor { flex: 1 1 100%; }
.acessos-tabela { width: 100%; border-collapse: collapse; }
.acessos-tabela thead th { font-size: .74rem; text-transform: uppercase; letter-spacing: .03em; color: var(--muted); font-weight: 600; padding: 8px; border-bottom: 1px solid var(--line); text-align: left; }
.acessos-tabela thead th.c { width: 112px; text-align: center; white-space: normal; }
.acessos-tabela .marcar { display: block; margin: 2px auto 0; font-size: .7rem; text-transform: none; letter-spacing: 0; font-weight: 500; background: none; border: 0; cursor: pointer; color: var(--accent); }
.acessos-tabela tbody th { text-align: left; font-weight: 400; padding: 10px 8px; border-top: 1px solid var(--line); border-bottom: 0; white-space: normal; text-transform: none; letter-spacing: 0; font-size: .9rem; color: var(--ink); }
.acessos-tabela tbody td { border-bottom: 0; }
.acessos-tabela tbody th b, .acessos-tabela tbody th small { display: block; }
.acessos-tabela tbody tr:first-child th { border-top: 0; }
.acessos-tabela tbody td { border-top: 1px solid var(--line); }
.acessos-tabela tbody tr:first-child td { border-top: 0; }
.acessos-tabela td.c { text-align: center; }
.acessos-tabela tbody tr:hover { background: var(--surface-2); }
td.resumo-acessos { max-width: 420px; font-size: .84rem; }
@media (max-width: 640px) { .acessos-lista { padding-left: 0; } .acessos-tabela thead th.c { width: 56px; font-size: .64rem; padding: 6px 2px; } .acessos-tabela thead th, .acessos-tabela tbody th { padding-left: 4px; padding-right: 4px; } .acessos-tabela tbody th small { font-size: .72rem; } }

/* ---------- Contrato: linha do tempo ---------- */
.op-0 { --op: #079A78; --op-soft: #DDF7EF; }
.op-1 { --op: #2F62A8; --op-soft: #E2ECF9; }
.op-2 { --op: #B4530A; --op-soft: #FBEBDD; }
.op-3 { --op: #6D4AA8; --op-soft: #EEE7F8; }
.op-4 { --op: #B7372B; --op-soft: #FBE3E0; }
.op-5 { --op: #0A2833; --op-soft: #E4EBED; }
.tl-legenda { display: flex; flex-wrap: wrap; gap: 8px; margin: 6px 0 12px; }
.tl-op { display: inline-flex; align-items: center; gap: 8px; padding: 6px 10px; border-radius: 999px; background: var(--op-soft); font-size: .8rem; }
.tl-op i { width: 10px; height: 10px; border-radius: 50%; background: var(--op); flex: none; }
.tl-op small { color: var(--muted); }
.tl { list-style: none; margin: 8px 0 12px; padding: 0; position: relative; }
.tl-item { position: relative; padding: 0 0 14px 30px; }
/* A linha vertical tem a cor da operadora de cada trecho */
.tl-item::before { content: ""; position: absolute; left: 9px; top: 0; bottom: 0; width: 3px; background: var(--op); border-radius: 2px; opacity: .55; }
.tl-item:last-child::before { bottom: auto; height: 22px; }
.tl-item:first-child::before { top: 14px; }
.tl-ponto { position: absolute; left: 2px; top: 12px; width: 17px; height: 17px; border-radius: 50%; background: var(--surface); border: 3px solid var(--op); z-index: 1; }
.tl-item.atual .tl-ponto { background: var(--op); box-shadow: 0 0 0 4px var(--op-soft); }
.tl-item.futuro .tl-ponto { border-style: dashed; }
.tl-card { border: 1px solid var(--line); border-left: 4px solid var(--op); border-radius: 10px; background: var(--surface); padding: 10px 14px; display: grid; grid-template-columns: 1.3fr 1fr 1fr 1.2fr; gap: 8px 18px; }
@media (max-width: 760px) { .tl-card { grid-template-columns: 1fr 1fr; } }
.tl-item.atual .tl-card { background: linear-gradient(var(--op-soft), var(--op-soft)) top / 100% 3px no-repeat, var(--surface); border-color: color-mix(in srgb, var(--op) 35%, var(--line)); }
.tl-item.outro .tl-card { background: var(--surface-2); }
.tl-campo { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.tl-campo.r { text-align: left; }
.tl-campo b { font-weight: 600; overflow-wrap: anywhere; }
.tl-campo small { font-size: .74rem; color: var(--muted); display: flex; gap: 8px; flex-wrap: wrap; }
.tl-campo .badge { align-self: flex-start; margin-top: 3px; }
.tl-rot { font-size: .68rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); font-weight: 600; }
.tl-opnome { color: var(--op); }
.tl-rodape { grid-column: 1 / -1; display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .72rem; border-top: 1px dashed var(--line); padding-top: 6px; }
/* Separador de troca de operadora */
.tl-troca { position: relative; margin: 2px 0 16px; padding: 10px 12px 10px 30px; font-size: .84rem; }
.tl-troca::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; border-top: 2px dashed var(--warn); opacity: .5; }
.tl-troca > div { position: relative; display: inline-block; background: var(--warn-soft); border: 1px solid color-mix(in srgb, var(--warn) 40%, var(--line)); border-radius: 999px; padding: 5px 14px; }
.tl-troca-marca { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 21px; height: 21px; border-radius: 50%; background: var(--warn); color: #fff; display: grid; place-items: center; font-size: .78rem; z-index: 1; }
.tl-op-inline { font-weight: 600; }

.acesso-grupos { display: flex; flex-direction: column; gap: 8px; }
.acesso-grupo { border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.acesso-grupo[open] { border-color: color-mix(in srgb, var(--accent) 35%, var(--line)); }
.acesso-grupo > summary { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 10px 14px; cursor: pointer; list-style: none; }
.acesso-grupo > summary::-webkit-details-marker { display: none; }
.acesso-grupo > summary::before { content: "▸"; color: var(--accent); margin-right: 4px; transition: transform .15s ease; }
.acesso-grupo[open] > summary::before { transform: rotate(90deg); }
.ag-nome { display: flex; flex-direction: column; flex: 1 1 auto; }
.ag-nome small { color: var(--muted); font-size: .76rem; }
.ag-todos { display: flex; gap: 6px; flex-wrap: wrap; }
.ag-todos .chip { cursor: pointer; font-size: .76rem; }
.acesso-grupo .acessos-tabela { margin: 0 0 8px; }
.acesso-grupo .acessos-tabela thead th:first-child, .acesso-grupo .acessos-tabela tbody th { padding-left: 32px; }

/* ---- Agenda em pop-up (botão de calendário no topo) ---- */
.agenda-btn .dot { top: 5px; right: 5px; }
body.com-modal { overflow: hidden; }
.agenda-pop .modal { width: min(520px, 100%); }
.agenda-pop .modal-head h2 { font-size: 1.1rem; margin: 0; }
.agenda-pop .modal-head p { margin: 2px 0 0; font-size: .8rem; }
.agp-resumo { display: flex; flex-wrap: wrap; gap: 8px; }
.agp-resumo span { background: var(--surface-2); border-radius: 999px; padding: 5px 11px; font-size: .8rem; }
.agp-resumo span.crit { background: var(--crit-soft); color: var(--crit); }
.agp-dia h3 { font-size: .78rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 0 0 6px; }
.agp-dia h3 small { display: block; text-transform: none; letter-spacing: 0; font-weight: 400; }
.agp-dia.atrasado h3 { color: var(--crit); }
.agp-item { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 10px; padding: 9px 10px; border-radius: 10px; color: inherit; text-decoration: none; border: 1px solid var(--line); margin-bottom: 6px; }
a.agp-item:hover, a.agp-item:focus-visible { border-color: var(--accent); background: var(--surface-2); }
.agp-hora { display: flex; flex-direction: column; font-variant-numeric: tabular-nums; font-weight: 600; font-size: .85rem; }
.agp-hora b { font-weight: 600; font-size: .75rem; color: var(--muted); }
.agp-corpo { min-width: 0; }
.agp-corpo b { display: block; font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agp-corpo small { display: block; color: var(--muted); font-size: .76rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.agp-vazio { margin: 0; }
.agp-acoes { display: flex; justify-content: flex-end; gap: 8px; flex-wrap: wrap; border-top: 1px solid var(--line); padding-top: 14px; }

/* ---- Painel: cards clicáveis, filtro de período e gráficos animados ---- */
a.kpi { color: inherit; text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
a.kpi:hover, a.kpi:focus-visible { border-color: var(--accent); box-shadow: 0 6px 18px rgba(10, 40, 51, .08); transform: translateY(-1px); }
.periodo-filtro { flex-wrap: wrap; }
.periodo-filtro .periodo-datas { font-size: .74rem; color: var(--muted); padding-right: 8px; white-space: nowrap; }
.periodo-filtro .input { width: auto; padding: 5px 8px; border-radius: 8px; }
.periodo-filtro .ate { text-transform: none; letter-spacing: 0; font-weight: 400; }
.painel-graficos { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-flow: row dense; gap: 16px; margin-top: 18px; } /* dense: ao reorganizar, um quadro menor preenche o buraco que sobrar na linha */
.painel-graficos .g-c4 { grid-column: span 4; } .painel-graficos .g-c8 { grid-column: span 8; } .painel-graficos .g-c12 { grid-column: 1 / -1; }
@media (max-width: 1180px) { .painel-graficos .g-c4 { grid-column: span 6; } .painel-graficos .g-c8 { grid-column: 1 / -1; } }
@media (max-width: 760px) { .painel-graficos .g-c4, .painel-graficos .g-c8 { grid-column: 1 / -1; } }
.g-bloco { display: flex; flex-direction: column; gap: 10px; border: 0; box-shadow: 0 1px 2px rgba(10, 40, 51, .05), 0 8px 24px rgba(10, 40, 51, .06); border-radius: 16px; }
/* Título numa linha só (largura toda do quadro); o destaque fica na linha do subtítulo, à direita */
.g-cab { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.g-cab h2 { font-size: .98rem; margin: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.g-sub { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 4px 10px; min-height: 26px; }
.g-cab .muted { font-size: .76rem; }
.g-destaque { flex: none; font-family: var(--f-display); font-size: .86rem; font-weight: 600; color: var(--brand); background: var(--accent-soft); border-radius: 999px; padding: 4px 11px; white-space: nowrap; }
.chart.gp { overflow: visible; }
.chart.gp .gl { stroke: #E6EDEE; }
.chart.gp .val { fill: var(--ink); font-weight: 600; font-size: 11px; }
.chart.gp .gbar { transition: filter .15s; cursor: default; outline: none; }
.chart.gp .gbar:hover, .chart.gp .gbar:focus-visible { filter: brightness(1.12) drop-shadow(0 2px 4px rgba(7, 154, 120, .35)); }
.chart.gp .linha.traco { stroke: #079A78; stroke-width: 2.5; fill: none; stroke-linecap: round; stroke-linejoin: round; }
.chart.gp .garea { opacity: 1; }
.chart.gp .gp-pt { outline: none; cursor: default; }
.chart.gp .gp-pt .hit { fill: transparent; }
.chart.gp .gp-pt .ponto { fill: #079A78; stroke: #fff; stroke-width: 1.5; transition: r .15s; }
.chart.gp .gp-pt:hover .ponto, .chart.gp .gp-pt:focus-visible .ponto { r: 6; }
.gp-leg .gp-sw { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.gp-leg .gp-sw0 { background: linear-gradient(#0FC79C, #079A78); } .gp-leg .gp-sw1 { background: linear-gradient(#4A8BC0, #2B6F9E); }
.gp-vazio { margin: auto 0; padding: 40px 0; text-align: center; }
.anel-wrap { display: flex; flex-direction: column; align-items: center; gap: 14px; padding: 4px 0 6px; }
.chart.anel { width: 228px; max-width: 80%; }
.chart.anel .anel-trilho { fill: none; stroke: #EEF4F4; }
.chart.anel .anel-seg { fill: none; stroke-linecap: butt; outline: none; transition: stroke-width .15s; }
.chart.anel .anel-seg:hover, .chart.anel .anel-seg:focus-visible { stroke-width: 22; }
.chart.anel .anel-total { font-family: var(--f-display); font-size: 30px; font-weight: 600; fill: var(--ink); }
.anel-leg { width: 100%; display: flex; flex-direction: column; gap: 6px; }
.anel-leg div { display: grid; grid-template-columns: 12px 1fr auto 44px; align-items: center; gap: 8px; font-size: .84rem; padding: 6px 2px; border-top: 1px solid var(--line); }
.anel-leg b { font-variant-numeric: tabular-nums; } .anel-leg small { color: var(--muted); text-align: right; }
.anel-sw { width: 10px; height: 10px; border-radius: 3px; } .anel-sw0 { background: linear-gradient(#0FC79C, #079A78); } .anel-sw1 { background: #B9C9CD; }
.g-tip { position: fixed; z-index: 80; pointer-events: none; background: #0A2833; color: #fff; border-radius: 10px; padding: 7px 11px; box-shadow: 0 8px 24px rgba(10, 40, 51, .25); display: flex; flex-direction: column; gap: 1px; transform: translate(-50%, calc(-100% - 12px)); white-space: nowrap; }
.g-tip b { font-family: var(--f-display); font-size: .98rem; font-weight: 600; } .g-tip span { font-size: .74rem; color: #BFE9DD; }
.g-bloco { scroll-margin-top: 80px; }
.g-bloco .chart:not(.anel) { max-height: 320px; }
.g-bloco .pie-wrap { justify-content: center; gap: 36px; padding: 6px 0; }
.g-bloco .chart.rosca { width: 200px; }
.g-bloco .pie-legend { flex: 0 1 360px; }
.g-bloco.destaque { box-shadow: 0 0 0 2px var(--accent); transition: box-shadow .3s; }
.chart .area { fill: var(--accent); opacity: .14; }
.chart .linha.traco { stroke: var(--accent); stroke-width: 2.5; }

/* Animação de entrada (só com JavaScript: o interface.js põe .g-anim e, ao aparecer na tela, .visivel) */
.g-anim .chart rect[class^="serie-"], .g-anim .chart .gbar { transform-box: fill-box; transform-origin: 50% 100%; transform: scaleY(0); }
.g-anim.visivel .chart rect[class^="serie-"], .g-anim.visivel .chart .gbar { animation: g-cresce .75s cubic-bezier(.2, .8, .2, 1) forwards; }
.g-anim .chart.anel .anel-seg { opacity: 0; }
.g-anim.visivel .chart.anel .anel-seg { animation: g-anel 1s cubic-bezier(.2, .8, .2, 1) forwards; }
.g-anim.visivel .chart.anel .anel-seg1 { animation-delay: .25s; }
.g-anim .anel-total, .g-anim .anel-leg { opacity: 0; }
.g-anim.visivel .anel-total, .g-anim.visivel .anel-leg { animation: g-surge .5s ease-out .5s forwards; }
@keyframes g-anel { from { opacity: 0; stroke-dasharray: 0 999; } to { opacity: 1; } }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(1), .g-anim.visivel .chart .gbar:nth-of-type(1) { animation-delay: 0.03s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(2), .g-anim.visivel .chart .gbar:nth-of-type(2) { animation-delay: 0.06s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(3), .g-anim.visivel .chart .gbar:nth-of-type(3) { animation-delay: 0.09s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(4), .g-anim.visivel .chart .gbar:nth-of-type(4) { animation-delay: 0.12s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(5), .g-anim.visivel .chart .gbar:nth-of-type(5) { animation-delay: 0.15s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(6), .g-anim.visivel .chart .gbar:nth-of-type(6) { animation-delay: 0.18s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(7), .g-anim.visivel .chart .gbar:nth-of-type(7) { animation-delay: 0.21s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(8), .g-anim.visivel .chart .gbar:nth-of-type(8) { animation-delay: 0.24s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(9), .g-anim.visivel .chart .gbar:nth-of-type(9) { animation-delay: 0.27s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(10), .g-anim.visivel .chart .gbar:nth-of-type(10) { animation-delay: 0.30s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(11), .g-anim.visivel .chart .gbar:nth-of-type(11) { animation-delay: 0.33s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(12), .g-anim.visivel .chart .gbar:nth-of-type(12) { animation-delay: 0.36s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(13), .g-anim.visivel .chart .gbar:nth-of-type(13) { animation-delay: 0.39s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(14), .g-anim.visivel .chart .gbar:nth-of-type(14) { animation-delay: 0.42s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(15), .g-anim.visivel .chart .gbar:nth-of-type(15) { animation-delay: 0.45s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(16), .g-anim.visivel .chart .gbar:nth-of-type(16) { animation-delay: 0.48s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(17), .g-anim.visivel .chart .gbar:nth-of-type(17) { animation-delay: 0.51s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(18), .g-anim.visivel .chart .gbar:nth-of-type(18) { animation-delay: 0.54s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(19), .g-anim.visivel .chart .gbar:nth-of-type(19) { animation-delay: 0.57s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(20), .g-anim.visivel .chart .gbar:nth-of-type(20) { animation-delay: 0.60s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(21), .g-anim.visivel .chart .gbar:nth-of-type(21) { animation-delay: 0.63s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(22), .g-anim.visivel .chart .gbar:nth-of-type(22) { animation-delay: 0.66s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(23), .g-anim.visivel .chart .gbar:nth-of-type(23) { animation-delay: 0.69s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(24), .g-anim.visivel .chart .gbar:nth-of-type(24) { animation-delay: 0.72s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(25), .g-anim.visivel .chart .gbar:nth-of-type(25) { animation-delay: 0.75s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(26), .g-anim.visivel .chart .gbar:nth-of-type(26) { animation-delay: 0.78s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(27), .g-anim.visivel .chart .gbar:nth-of-type(27) { animation-delay: 0.81s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(28), .g-anim.visivel .chart .gbar:nth-of-type(28) { animation-delay: 0.84s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(29), .g-anim.visivel .chart .gbar:nth-of-type(29) { animation-delay: 0.87s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(30), .g-anim.visivel .chart .gbar:nth-of-type(30) { animation-delay: 0.90s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(31), .g-anim.visivel .chart .gbar:nth-of-type(31) { animation-delay: 0.93s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(32), .g-anim.visivel .chart .gbar:nth-of-type(32) { animation-delay: 0.96s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(33), .g-anim.visivel .chart .gbar:nth-of-type(33) { animation-delay: 0.99s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(34), .g-anim.visivel .chart .gbar:nth-of-type(34) { animation-delay: 1.02s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(35), .g-anim.visivel .chart .gbar:nth-of-type(35) { animation-delay: 1.05s; }
.g-anim.visivel .chart rect[class^="serie-"]:nth-of-type(36), .g-anim.visivel .chart .gbar:nth-of-type(36) { animation-delay: 1.08s; }
.g-anim .chart .traco { stroke-dasharray: 1; stroke-dashoffset: 1; }
.g-anim.visivel .chart .traco { animation: g-traco 1.2s ease-out forwards; }
.g-anim .chart .area, .g-anim .chart .ponto, .g-anim .chart .val { opacity: 0; }
.g-anim .chart.gp .garea { opacity: 0; }
.g-anim.visivel .chart .area { animation: g-area .6s ease-out .7s forwards; }
.g-anim.visivel .chart .ponto, .g-anim.visivel .chart .val { animation: g-surge .4s ease-out .9s forwards; }
.g-anim .chart.rosca path { transform-box: view-box; transform-origin: 80px 80px; transform: rotate(-90deg) scale(.6); opacity: 0; }
.g-anim.visivel .chart.rosca path { animation: g-gira .9s cubic-bezier(.2, .8, .2, 1) forwards; }
.g-anim.visivel .chart.rosca path:nth-of-type(2) { animation-delay: .15s; }
.g-anim .pie-legend, .g-anim .legend { opacity: 0; }
.g-anim.visivel .pie-legend, .g-anim.visivel .legend { animation: g-surge .5s ease-out .5s forwards; }
@keyframes g-cresce { to { transform: scaleY(1); } }
@keyframes g-traco { to { stroke-dashoffset: 0; } }
@keyframes g-area { to { opacity: .14; } }
@keyframes g-area-gp { to { opacity: 1; } }
.g-anim.visivel .chart.gp .garea { animation: g-area-gp .7s ease-out .6s forwards; }
@keyframes g-surge { to { opacity: 1; } }
@keyframes g-gira { to { transform: rotate(0) scale(1); opacity: 1; } }
@media (prefers-reduced-motion: reduce) {
  .g-anim .chart *, .g-anim .pie-legend, .g-anim .legend { animation: none !important; transform: none !important; opacity: 1 !important; stroke-dashoffset: 0 !important; }
  .g-anim .chart .area { opacity: .14 !important; }
  .g-anim .chart.gp .garea { opacity: 1 !important; }
}

/* ---- Painel com um cliente escolhido: produto não contratado e renovações por produto ---- */
.kpi.nc .v { color: var(--muted); }
.kpi.nc .f { color: var(--muted); font-style: italic; }
.g-nc { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; padding: 36px 16px; border: 1px dashed var(--line); border-radius: 12px; background: var(--surface-2); color: var(--muted); }
.g-nc svg { width: 30px; height: 30px; stroke: var(--muted); fill: none; stroke-width: 1.8; }
.g-nc b { color: var(--ink); font-size: .95rem; }
.g-nc span { font-size: .8rem; }
.ren-lista { display: flex; flex-direction: column; }
.ren-linha { display: grid; grid-template-columns: 140px minmax(0, 1fr) minmax(220px, 38%); gap: 16px; align-items: center; padding: 14px 4px; border-top: 1px solid var(--line); }
.ren-linha:first-child { border-top: 0; }
.ren-prod { font-weight: 600; font-size: .9rem; display: flex; align-items: center; gap: 8px; }
.ren-prod::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: linear-gradient(#0FC79C, #079A78); }
.ren-nc .ren-prod::before { background: #B9C9CD; }
.ren-info { display: flex; flex-direction: column; min-width: 0; }
.ren-info b { font-family: var(--f-display); font-size: 1.05rem; }
.ren-info span { font-size: .78rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ren-vazio { grid-column: 2 / -1; color: var(--muted); font-size: .84rem; font-style: italic; }
.ren-tempo { display: flex; flex-direction: column; gap: 5px; outline: none; }
.ren-barra { width: 100%; height: 8px; }
.ren-trilho { fill: #EEF4F4; }
.ren-feito.ren-ok { fill: #0BB088; } .ren-feito.ren-warn { fill: #D9A441; } .ren-feito.ren-crit { fill: #C2543F; }
.ren-dias { font-size: .76rem; font-weight: 600; color: var(--ink); }
.ren-dias.ren-crit { color: var(--crit); } .ren-dias.ren-warn { color: var(--warn); }
.g-anim .ren-feito { transform-box: fill-box; transform-origin: 0 50%; transform: scaleX(0); }
.g-anim.visivel .ren-feito { animation: g-ren .9s cubic-bezier(.2, .8, .2, 1) forwards; }
@keyframes g-ren { to { transform: scaleX(1); } }
@media (max-width: 760px) { .ren-linha { grid-template-columns: 1fr; gap: 6px; } .ren-vazio { grid-column: 1; } }
@media (prefers-reduced-motion: reduce) { .g-anim .ren-feito { transform: none !important; animation: none !important; } }

/* Painel · colunas extras da grade (Top 10 = metade; velocímetros = um quarto) */
.painel-graficos .g-c6 { grid-column: span 6; } .painel-graficos .g-c3 { grid-column: span 3; }
@media (max-width: 1180px) { .painel-graficos .g-c6 { grid-column: 1 / -1; } .painel-graficos .g-c3 { grid-column: span 6; } }
@media (max-width: 760px) { .painel-graficos .g-c3 { grid-column: 1 / -1; } }

/* Painel · Top 10 clientes: barras horizontais com o gradiente da Zoe; as linhas ocupam a altura do quadro */
.gp-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.gp-rank { flex: 1; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; padding: 4px 0 2px; }
.gp-rank-l { display: grid; grid-template-columns: minmax(0, 36%) minmax(0, 1fr) 58px; align-items: center; gap: 12px; font-size: .84rem; padding-bottom: 7px; border-bottom: 1px solid #E6EDEE; }
.gp-rank-l:last-child { border-bottom: 0; padding-bottom: 0; }
.gp-rank-nome { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gp-rank-nome .lnk { color: var(--ink); font-weight: 500; }
.gp-rank-trilho { display: block; min-width: 0; }
.chart.gp.gp-rank-b { display: block; width: 100%; height: 14px; overflow: visible; }
.gp-rank-t { text-align: right; font-size: .82rem; font-weight: 600; color: var(--ink); font-variant-numeric: tabular-nums; }
.g-anim .chart .gbar-h { transform-origin: 0 50%; transform: scaleX(0); }
.g-anim.visivel .chart .gbar-h { animation: g-cresce-h .8s cubic-bezier(.2, .8, .2, 1) forwards; }
@keyframes g-cresce-h { from { transform: scaleX(0); } to { transform: scaleX(1); } }
@media (max-width: 640px) { .gp-rank-l { grid-template-columns: minmax(0, 1fr) 52px; } .gp-rank-trilho { grid-column: 1 / -1; grid-row: 2; } }

/* Painel · velocímetros (meio anel no estilo do gráfico de anel) */
.velo-wrap { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 14px; padding: 4px 0 6px; }
.chart.velo { width: 100%; max-width: 236px; display: block; } /* 236px: o arco fica com o mesmo diâmetro do anel de Quantidade de Clientes (228px) */
.chart.velo path { fill: none; }
.chart.velo .velo-trilho { stroke: #EEF4F4; }
.chart.velo .velo-meta { stroke: var(--ink); stroke-width: 2; stroke-linecap: round; }
.chart.velo .velo-meta-t { font-weight: 600; fill: var(--ink); }
.chart.velo .velo-ponteiro { fill: var(--ink); }
.chart.velo .velo-eixo { fill: var(--ink); stroke: #fff; stroke-width: 2.5; }
.chart.velo .velo-agulha.vazia .velo-ponteiro, .chart.velo .velo-agulha.vazia .velo-eixo { fill: var(--muted); }
.chart.velo .velo-agulha { outline: none; transform-box: view-box; transform-origin: 110px 108px; }
.chart.velo .anel-total { font-family: var(--f-display); font-size: 28px; font-weight: 600; fill: var(--ink); }
.velo-leg div { grid-template-columns: 1fr auto; }
.g-anim .chart.velo .velo-arco { opacity: 0; }
.g-anim.visivel .chart.velo .velo-arco { animation: g-velo 1.2s cubic-bezier(.2, .8, .2, 1) forwards; }
@keyframes g-velo { from { opacity: 1; stroke-dasharray: 0 1; } to { opacity: 1; stroke-dasharray: 1 1; } }
.g-anim .velo-valor, .g-anim .velo-leg { opacity: 0; }
.g-anim.visivel .velo-valor, .g-anim.visivel .velo-leg { animation: g-surge .5s ease-out .7s forwards; }

/* Painel · organizar os gráficos (arrastar como widgets do celular) */
.painel-organizar { display: inline-flex; align-items: center; gap: 6px; }
.painel-organizar svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; }
.painel-organizar.ativo { background: var(--accent-soft); border-color: var(--accent); color: var(--brand); }
.painel-organizar-barra { position: sticky; top: 64px; z-index: 30; margin-top: 18px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; padding: 10px 14px; border-radius: 12px; background: var(--brand); color: #fff; font-size: .86rem; box-shadow: 0 8px 24px rgba(10, 40, 51, .18); }
.painel-organizar-barra[hidden] { display: none; }
.painel-organizar-barra .org-acoes { display: flex; gap: 8px; }
.painel-organizar-barra .btn.ghost { color: #fff; border-color: rgba(255, 255, 255, .35); background: transparent; }
.painel-organizar-barra .btn.primary { background: var(--mint); border-color: var(--mint); color: var(--brand); font-weight: 600; }
.org-alca-ex { font-weight: 700; }
.org-controle { display: flex; align-items: center; justify-content: space-between; margin: -4px -4px 2px; }
.org-controle[hidden] { display: none; }
.org-controle button { all: unset; box-sizing: border-box; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 9px; color: var(--brand); cursor: pointer; }
.org-controle button:hover, .org-controle button:focus-visible { background: var(--accent-soft); }
.org-controle button:focus-visible { outline: 2px solid var(--accent); }
.org-controle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.org-controle .org-alca { cursor: grab; touch-action: none; background: var(--surface-2); }
.org-controle .org-alca svg { fill: currentColor; stroke: none; }
.org-setas { display: flex; gap: 2px; }
.painel-graficos.organizando .g-bloco { outline: 2px dashed #9FD9C8; outline-offset: -2px; user-select: none; }
.painel-graficos.organizando .g-bloco > :not(.org-controle) { pointer-events: none; }
.painel-graficos.organizando .g-bloco.arrastando { z-index: 5; outline-color: var(--accent); box-shadow: 0 18px 40px rgba(10, 40, 51, .22); transform: scale(1.015); }
.painel-graficos.organizando .g-bloco.arrastando .org-alca { cursor: grabbing; }
@media (prefers-reduced-motion: no-preference) {
  .painel-graficos.organizando .g-bloco:not(.arrastando) { animation: org-treme .32s ease-in-out infinite alternate; }
  .painel-graficos.organizando .g-bloco:nth-child(2n):not(.arrastando) { animation-delay: .16s; }
}
@keyframes org-treme { from { rotate: -.25deg; } to { rotate: .25deg; } }

/* Painel · legenda das partes do Top 10 e quadros sem espaço sobrando embaixo da legenda */
.gp-leg .gp-swp0 { background: linear-gradient(90deg, #079A78, #0FC79C); }
.gp-leg .gp-swp1 { background: linear-gradient(90deg, #2B6F9E, #4A8BC0); }
.gp-leg .gp-swp2 { background: linear-gradient(90deg, #0A2833, #2C5866); }
.chart.gp .gp-parte { outline: none; cursor: default; transition: filter .15s; }
.chart.gp .gp-parte:hover, .chart.gp .gp-parte:focus-visible { filter: brightness(1.15); }
.g-bloco > .chart.gp:not(.velo):not(.anel) { margin-top: auto; }
.g-bloco > .gp-leg { margin-top: 2px; }
.g-bloco > .anel-wrap { flex: 1; justify-content: center; }

/* Legendas no meio do quadro: Top 10 Clientes, Movimentações Cadastrais e Sinistros de Vida (pedido do Marco) */
#g-top-clientes .gp-leg, #g-movimentacoes .gp-leg, #g-sinistros .gp-leg { justify-content: center; }
/* Telas de 1181 a 1365 px: um pouco menos de respiro nas laterais para os títulos de três por linha caberem numa linha */
@media (min-width: 1181px) and (max-width: 1365px) { .painel-graficos { gap: 12px; } .painel-graficos .g-bloco { padding-left: 10px; padding-right: 10px; } }
/* No celular não há largura para todos os títulos: o mais longo pode ir para a segunda linha em vez de ser cortado */
@media (max-width: 480px) { .g-cab h2 { white-space: normal; } }
/* Títulos dos velocímetros: numa linha quando cabem; quando não, quebram só depois dos dois-pontos */
.g-cab h2.g-tit-2 { white-space: normal; }
.g-cab h2 .g-tit-l { white-space: nowrap; }

/* Clientes · importação por planilha */
.dicas-importacao { margin: 4px 0 0; padding-left: 18px; font-size: .86rem; color: var(--muted); display: flex; flex-direction: column; gap: 4px; }
.dicas-importacao b { color: var(--ink); font-weight: 600; }

/* Botões só com ícone no topo das telas (Exportar e Importar de Clientes) */
.page-head .actions .btn-icone { width: 38px; height: 38px; color: var(--brand); text-decoration: none; }
.page-head .actions .btn-icone svg { width: 19px; height: 19px; stroke-linecap: round; stroke-linejoin: round; }
.page-head .actions .btn-icone:hover { border-color: var(--accent); background: var(--accent-soft); }

/* Clientes · pop-up "+ Novo" (Pessoa Física ou Empresa) */
.novo-cliente-pop .modal { width: min(820px, 100%); }
.novo-cliente-pop .modal-head h2, .dialogo-pop .modal-head h2 { display: flex; align-items: center; gap: 10px; font-size: 1.15rem; margin: 0; }
.novo-cliente-pop .modal-head h2 svg, .dialogo-pop .modal-head h2 svg { width: 22px; height: 22px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.novo-cliente-pop .modal-body { padding-top: 16px; }
.novo-cliente-pop .form-acoes { position: sticky; bottom: -18px; background: var(--surface); margin: 0 -20px -18px; padding: 14px 20px; border-top: 1px solid var(--line); z-index: 1; }
.tipo-pessoa-escolha { display: grid; grid-template-columns: 1fr 1fr; width: min(420px, 100%); border: 1px solid var(--accent); border-radius: 10px; overflow: hidden; }
.tipo-pessoa-escolha .tp-opcao { position: relative; cursor: pointer; display: flex; }
.tipo-pessoa-escolha .tp-opcao input { position: absolute; opacity: 0; pointer-events: none; }
.tipo-pessoa-escolha .tp-opcao span { flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 12px; font-weight: 600; font-size: .9rem; color: var(--accent); background: var(--surface); transition: background .15s, color .15s; }
.tipo-pessoa-escolha .tp-opcao + .tp-opcao span { border-left: 1px solid var(--accent); }
.tipo-pessoa-escolha .tp-opcao svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.tipo-pessoa-escolha .tp-opcao input:checked + span { background: var(--accent); color: #fff; }
.tipo-pessoa-escolha .tp-opcao input:focus-visible + span { outline: 2px solid var(--brand); outline-offset: -3px; }
.tipo-pessoa-escolha .tp-opcao span:hover { background: var(--accent-soft); }
.tipo-pessoa-escolha .tp-opcao input:checked + span:hover { background: var(--accent); }
/* Ordem dos campos: cada tipo tem a sua (o-pf-N para Pessoa Física, o-pj-N para Empresa) */
.form-novo-cliente { align-items: start; }
.form-novo-cliente h3 { margin: 4px 0 -4px; font-size: .92rem; }
.form-novo-cliente .bloco-rh h3, .form-novo-cliente .bloco-matriz h3 { margin: 4px 0 8px; }
.tp-fisica .o-pf-1 { order: 1; } .tp-fisica .o-pf-2 { order: 2; } .tp-fisica .o-pf-3 { order: 3; } .tp-fisica .o-pf-4 { order: 4; } .tp-fisica .o-pf-5 { order: 5; } .tp-fisica .o-pf-6 { order: 6; } .tp-fisica .o-pf-7 { order: 7; } .tp-fisica .o-pf-8 { order: 8; }
.tp-fisica .o-pf-9 { order: 9; } .tp-fisica .o-pf-10 { order: 10; } .tp-fisica .o-pf-11 { order: 11; } .tp-fisica .o-pf-12 { order: 12; } .tp-fisica .o-pf-13 { order: 13; } .tp-fisica .o-pf-14 { order: 14; } .tp-fisica .o-pf-15 { order: 15; } .tp-fisica .o-pf-16 { order: 16; }
.tp-juridica .o-pj-1 { order: 1; } .tp-juridica .o-pj-2 { order: 2; } .tp-juridica .o-pj-3 { order: 3; } .tp-juridica .o-pj-4 { order: 4; } .tp-juridica .o-pj-5 { order: 5; } .tp-juridica .o-pj-6 { order: 6; } .tp-juridica .o-pj-7 { order: 7; } .tp-juridica .o-pj-8 { order: 8; }
.tp-juridica .o-pj-9 { order: 9; } .tp-juridica .o-pj-10 { order: 10; } .tp-juridica .o-pj-11 { order: 11; } .tp-juridica .o-pj-12 { order: 12; } .tp-juridica .o-pj-13 { order: 13; } .tp-juridica .o-pj-14 { order: 14; } .tp-juridica .o-pj-15 { order: 15; } .tp-juridica .o-pj-16 { order: 16; }
.tp-juridica .o-pj-17 { order: 17; } .tp-juridica .o-pj-18 { order: 18; } .tp-juridica .o-pj-19 { order: 19; }
.form-novo-cliente .lnk-acao { all: unset; float: right; cursor: pointer; font-size: .74rem; font-weight: 600; color: var(--accent); }
.form-novo-cliente .lnk-acao:hover { text-decoration: underline; }
.form-novo-cliente .lnk-acao[hidden] { display: none; }
/* Segmentos em pílulas, numa linha só */
.segmentos-pilulas .pilulas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.pilula { position: relative; cursor: pointer; display: flex; }
.pilula input { position: absolute; opacity: 0; pointer-events: none; }
.pilula span { flex: 1; display: flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; font-weight: 500; font-size: .88rem; background: var(--surface); transition: border-color .15s, background .15s; }
.pilula span::before { content: ""; width: 16px; height: 16px; border-radius: 4px; border: 1.5px solid var(--muted); flex: none; }
.pilula input:checked + span { border-color: var(--accent); background: var(--accent-soft); color: var(--brand); }
.pilula input:checked + span::before { background: var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 8.5l2.5 2.5L12 5.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 14px no-repeat; border-color: var(--accent); }
.pilula input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.pilula span:hover { border-color: var(--accent); }
@media (max-width: 520px) { .tipo-pessoa-escolha { width: 100%; } .segmentos-pilulas .pilulas { grid-template-columns: minmax(0, 1fr); } .form-novo-cliente .field { grid-column: 1 / -1; } }

/* ---------------------------------------------------------------------
   Widget de Contratos da ficha do cliente (pedido do Marco, 13/10/2026)
   Cor do segmento em --seg / --seg-soft: Saúde verde, Odonto azul, Vida ouro.
   --------------------------------------------------------------------- */
.ct-widget { --seg: var(--accent); --seg-soft: var(--accent-soft); }
.seg-saude { --seg: #079A78; --seg-soft: #DDF7EF; }
.seg-odonto { --seg: #3F7FC4; --seg-soft: #E3EDF9; }
.seg-vida { --seg: #B98117; --seg-soft: #FBF0D9; }
.ct-head-dir { display: flex; align-items: center; gap: 10px; }

/* Selo da operadora: logotipo ou iniciais */
.op-selo { flex: none; width: 44px; height: 44px; border-radius: 12px; background: #fff; border: 1px solid var(--line); display: grid; place-items: center; overflow: hidden; }
.op-selo img { width: 100%; height: 100%; object-fit: contain; padding: 5px; }
.op-selo b { font-family: var(--f-display); font-weight: 700; font-size: .95rem; letter-spacing: .02em; color: var(--seg, var(--accent)); }
.op-selo:has(b) { background: var(--seg-soft, var(--accent-soft)); border-color: transparent; }
.op-selo.grande { width: 56px; height: 56px; border-radius: 14px; }
.op-selo.grande b { font-size: 1.15rem; }
.op-selo.mini { width: 28px; height: 28px; border-radius: 8px; }
.op-selo.mini img { padding: 2px; }
.op-selo.mini b { font-size: .68rem; }
.campo-logo .logo-linha { display: flex; gap: 14px; align-items: flex-start; }
.campo-logo .logo-linha > div { flex: 1; display: grid; gap: 6px; }
.campo-logo .check { border: 0; padding: 0; }

/* Abas (uma por contrato) */
.ct-abas { display: flex; gap: 8px; overflow-x: auto; padding-bottom: 4px; margin-bottom: 14px; scrollbar-width: thin; }
.ct-aba { display: flex; align-items: center; gap: 9px; flex: none; padding: 7px 12px 7px 7px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); cursor: pointer; text-align: left; font: inherit; transition: border-color .15s, box-shadow .15s, background .15s; }
.ct-aba span { display: grid; line-height: 1.15; }
.ct-aba b { font-size: .82rem; font-weight: 600; white-space: nowrap; }
.ct-aba small { font-size: .7rem; color: var(--muted); white-space: nowrap; }
.ct-aba:hover { border-color: var(--seg); }
.ct-aba[aria-selected="true"] { border-color: var(--seg); background: var(--seg-soft); box-shadow: inset 0 -3px 0 var(--seg); }
.ct-aba:focus-visible { outline: 2px solid var(--seg); outline-offset: 2px; }

/* Cartão do contrato */
.ct-card { display: grid; gap: 16px; }
.ct-card + .ct-card { margin-top: 22px; padding-top: 22px; border-top: 1px dashed var(--line); }
.ct-card[hidden] { display: none; }
.ct-abas ~ .ct-card { margin-top: 0; padding-top: 0; border-top: 0; }
.ct-card.cancelado { opacity: .72; }
.ct-topo { display: grid; grid-template-columns: auto 1fr auto; gap: 14px; align-items: start; }
.ct-id { display: grid; gap: 3px; min-width: 0; }
.ct-op { font-size: .72rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ct-plano { font-family: var(--f-display); font-size: 1.12rem; font-weight: 700; color: var(--ink); line-height: 1.2; text-decoration: none; overflow-wrap: anywhere; }
.ct-plano:hover { color: var(--seg); }
.ct-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 4px; }
.ct-chips .chip { font-size: .72rem; font-weight: 500; padding: 3px 9px; border-radius: 999px; background: var(--surface-2); color: var(--ink); }
.ct-chips .chip.seg { background: var(--seg-soft); color: var(--seg); font-weight: 600; }

.ct-meio { display: grid; grid-template-columns: 1fr auto; gap: 12px; }
.ct-valor { position: relative; overflow: hidden; display: grid; gap: 2px; padding: 14px 16px; border-radius: 14px; background: linear-gradient(135deg, var(--seg-soft) 0%, var(--surface) 85%); border: 1px solid var(--line); }
.ct-valor::after { content: ""; position: absolute; right: -28px; top: -28px; width: 96px; height: 96px; border-radius: 50%; border: 14px solid var(--seg); opacity: .08; }
.ct-valor .l, .ct-fatura .l, .ct-vig .l { font-size: .74rem; color: var(--muted); font-weight: 500; }
.ct-valor .v { font-family: var(--f-display); font-size: 1.7rem; font-weight: 700; letter-spacing: -.01em; color: var(--ink); line-height: 1.15; font-variant-numeric: tabular-nums; }
.ct-valor .f { display: flex; align-items: center; gap: 6px; font-size: .76rem; color: var(--muted); }
.ct-valor .f svg, .ct-item dt svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; flex: none; }

.ct-fatura { display: flex; align-items: center; gap: 12px; padding: 12px 16px 12px 12px; border-radius: 14px; border: 1px solid var(--line); background: var(--surface); }
.ct-fatura .cal { width: 54px; border-radius: 10px; overflow: hidden; border: 1px solid var(--line); text-align: center; flex: none; box-shadow: 0 2px 6px rgba(10,40,51,.06); }
.ct-fatura .cal small { display: block; background: var(--seg); color: #fff; font-size: .62rem; font-weight: 700; letter-spacing: .12em; padding: 2px 0; }
.ct-fatura .cal b { display: block; font-family: var(--f-display); font-size: 1.45rem; line-height: 1.5; color: var(--ink); font-variant-numeric: tabular-nums; }
.ct-fatura .txt { display: grid; gap: 2px; }
.ct-fatura .txt .l { color: var(--ink); font-weight: 600; font-size: .82rem; }
.ct-fatura .txt .f { font-size: .76rem; color: var(--muted); white-space: nowrap; }
.ct-fatura.sem .cal small { background: var(--exc); }

.ct-vig { display: grid; gap: 7px; }
.ct-vig-topo, .ct-vig-base { display: flex; justify-content: space-between; gap: 10px; font-size: .76rem; color: var(--muted); }
.ct-vig-topo .l { color: var(--ink); font-weight: 600; font-size: .82rem; }
.ct-vig-base .warn { color: var(--warn); font-weight: 600; }
.ct-vig-base .crit { color: var(--crit); font-weight: 600; }
.ct-barra { height: 10px; border-radius: 999px; background: var(--surface-2); overflow: hidden; }
.ct-barra i { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, var(--seg-soft), var(--seg)); transition: width .9s cubic-bezier(.2,.7,.2,1); }

.ct-grade { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0; }
.ct-item { display: grid; align-content: start; gap: 5px; padding: 11px 13px; border-radius: 12px; background: var(--surface-2); }
.ct-item dt { display: flex; align-items: center; gap: 7px; font-size: .74rem; color: var(--muted); font-weight: 500; }
.ct-item dt svg { color: var(--seg); }
.ct-item dd { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; font-weight: 600; font-size: .9rem; color: var(--ink); }
.ct-item dd small { flex-basis: 100%; font-weight: 400; font-size: .74rem; color: var(--muted); }
.ct-item dd .muted { font-weight: 400; }
.ct-item .tog { font-size: .72rem; font-weight: 700; padding: 2px 10px; border-radius: 999px; }
.ct-item .tog.sim { background: var(--seg); color: #fff; }
.ct-item .tog.nao { background: var(--surface); color: var(--muted); border: 1px solid var(--line); }
.ct-item .escala { display: inline-flex; align-items: flex-end; gap: 3px; height: 16px; margin-left: auto; }
.ct-item .escala i { width: 5px; border-radius: 2px; background: var(--line); }
.ct-item .escala i:nth-child(1) { height: 25%; } .ct-item .escala i:nth-child(2) { height: 50%; }
.ct-item .escala i:nth-child(3) { height: 75%; } .ct-item .escala i:nth-child(4) { height: 100%; }
.ct-item .escala i.on { background: var(--seg); }

.ct-vazio { display: flex; gap: 14px; align-items: center; padding: 10px 0; }
.ct-vazio p { margin: 0; }

@media (max-width: 560px) {
  .ct-meio { grid-template-columns: 1fr; }
  .ct-topo { grid-template-columns: auto 1fr; }
  .ct-topo .badge { grid-column: 2; justify-self: start; }
}
@media (max-width: 400px) {
  .ct-grade { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) { .ct-barra i { transition: none; } }

/* Widget de Contratos de ponta a ponta (ficha do cliente): valor, fatura e vigência
   numa linha; coparticipação, abrangência, acomodação e nº do contrato em quatro colunas */
@media (min-width: 1000px) {
  .ct-widget.largo .ct-card { grid-template-columns: minmax(0, 1.15fr) auto minmax(0, 1.25fr); grid-template-areas: "topo topo topo" "valor fatura vig" "grade grade grade"; column-gap: 14px; }
  .ct-widget.largo .ct-topo { grid-area: topo; }
  .ct-widget.largo .ct-meio { display: contents; }
  .ct-widget.largo .ct-valor { grid-area: valor; }
  .ct-widget.largo .ct-fatura { grid-area: fatura; }
  .ct-widget.largo .ct-vig { grid-area: vig; align-content: center; padding: 12px 16px; border: 1px solid var(--line); border-radius: 14px; }
  .ct-widget.largo .ct-grade { grid-area: grade; grid-template-columns: repeat(4, minmax(0, 1fr)); }
}


/* ---------------------------------------------------------------------
   Produtos (Saúde, Odonto e Vida) · layout "Operadoras em foco" (David, 14/10/2026)
   --------------------------------------------------------------------- */
.pf-filtro { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 9px 14px; margin-bottom: 14px; border-radius: 12px; background: var(--accent-soft); font-size: .88rem; }
.pf-filtro .lnk { margin-left: auto; }
.pf-hero { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; padding: 22px 26px; border-radius: 18px; color: #fff;
  background: radial-gradient(120% 160% at 100% 0%, #08B98F 0%, #0E4A55 48%, #0A2833 100%); box-shadow: var(--shadow); margin-bottom: 22px; }
.pf-hero > * { display: grid; gap: 2px; color: inherit; text-decoration: none; min-width: 0; padding-left: 16px; border-left: 1px solid rgba(255,255,255,.14); }
.pf-hero > *:first-child { padding-left: 0; border-left: 0; }
.pf-hero .l { font-size: .78rem; opacity: .78; }
.pf-hero b { font-family: var(--f-display); font-size: 1.9rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pf-hero .f { font-size: .78rem; opacity: .88; display: flex; align-items: center; gap: 6px; }
.pf-hero a:hover b { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.pf-ponto { width: 8px; height: 8px; border-radius: 50%; background: var(--exc); flex: none; }
.pf-ponto.ok { background: #2BE0B2; } .pf-ponto.warn { background: #F2C14E; } .pf-ponto.crit { background: #FF7B6E; }

.pf-secao { display: flex; align-items: baseline; gap: 10px; flex-wrap: wrap; margin: 4px 0 12px; }
.pf-secao .muted { font-size: .8rem; }
.pf-ops { --pf-cols: 4; display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 22px; }
.pf-ops.c1 { --pf-cols: 1; } .pf-ops.c2 { --pf-cols: 2; } .pf-ops.c3 { --pf-cols: 3; } .pf-ops.c4 { --pf-cols: 4; } .pf-ops.c5 { --pf-cols: 5; }
.pf-ops > .pf-op { flex: 1 1 calc((100% - (var(--pf-cols) - 1) * 14px) / var(--pf-cols)); min-width: 0; }
.pf-op { --seg: #079A78; --seg-soft: #DDF7EF; display: grid; gap: 14px; padding: 16px 18px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line);
  color: var(--ink); text-decoration: none; box-shadow: var(--shadow); transition: border-color .15s, transform .15s, box-shadow .15s; }
.pf-op:hover { border-color: var(--seg); transform: translateY(-2px); }
.pf-op:focus-visible { outline: 2px solid var(--seg); outline-offset: 2px; }
.pf-op.ativa { border-color: var(--seg); box-shadow: 0 0 0 2px var(--seg) inset, var(--shadow); }
.opc-1 { --seg: #3F7FC4; --seg-soft: #E3EDF9; } .opc-2 { --seg: #B98117; --seg-soft: #FBF0D9; } .opc-3 { --seg: #8A5FB5; --seg-soft: #EFE7F7; }
.opc-4 { --seg: #D0654A; --seg-soft: #FBE7E1; } .opc-5 { --seg: #3E8E86; --seg-soft: #E0F1EF; }
.pf-op-topo { display: flex; align-items: center; gap: 12px; min-width: 0; }
.pf-op-topo > span:last-child { display: grid; min-width: 0; }
.pf-op-topo b { font-size: .98rem; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-op-topo small { font-size: .76rem; color: var(--muted); }
.pf-op-nums { display: grid; grid-template-columns: repeat(3, auto); justify-content: space-between; gap: 8px; }
.pf-op-nums > span { display: grid; }
.pf-op-nums > span:not(:first-child) { text-align: right; }
.pf-op-nums small { font-size: .72rem; color: var(--muted); }
.pf-op-nums b { font-family: var(--f-display); font-size: 1.25rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf-sin { display: grid; gap: 5px; }
.pf-sin .l { font-size: .78rem; color: var(--muted); }
.pf-sin.ok b { color: var(--ok); } .pf-sin.warn b { color: var(--warn); } .pf-sin.crit b { color: var(--crit); }
.pf-trilho { position: relative; height: 8px; border-radius: 999px; background: var(--surface-2); }
.pf-trilho i { position: absolute; left: 0; top: 0; bottom: 0; width: 0; border-radius: inherit; background: var(--accent); transition: width .9s cubic-bezier(.2,.7,.2,1); }
.pf-sin.warn .pf-trilho i { background: #D69A1F; } .pf-sin.crit .pf-trilho i { background: var(--crit); }
.pf-trilho .meta { position: absolute; top: -4px; bottom: -4px; width: 2px; margin-left: -1px; border-radius: 1px; background: var(--ink); }

.pf-linha { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 16px; align-items: stretch; margin-bottom: 16px; }
.pf-linha > .panel { margin: 0; display: flex; flex-direction: column; }
.pf-linha > .panel > .panel-head { flex: none; }
.pf-at-resumo { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: auto; padding-top: 14px; }
.pf-at-resumo > div { display: grid; gap: 2px; padding: 12px 14px; border-radius: 12px; background: var(--surface-2); }
.pf-at-resumo b { font-family: var(--f-display); font-size: 1.35rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.pf-at-resumo span { font-size: .76rem; color: var(--muted); }
.pf-at-resumo .crit b { color: var(--crit); } .pf-at-resumo .warn b { color: var(--warn); } .pf-at-resumo .ok b { color: var(--ok); }
.pf-at-pe { margin: 12px 0 0; font-size: .82rem; color: var(--muted); text-align: right; }
.pf-sub { font-size: .8rem; color: var(--muted); margin: -4px 0 6px; }
.pf-atencao { list-style: none; margin: 4px 0 0; padding: 0; }
.pf-atencao li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 11px 0; border-bottom: 1px solid var(--line); }
.pf-atencao li:last-child { border-bottom: 0; }
.chip-st { justify-self: start; font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; white-space: nowrap; }
.chip-st.crit { background: var(--crit-soft); color: var(--crit); } .chip-st.warn { background: var(--warn-soft); color: var(--warn); }
.pf-at-txt { display: grid; min-width: 0; }
.pf-at-txt .lnk { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.pf-at-txt small { font-size: .76rem; color: var(--muted); }
.pf-at-acao { font-size: .84rem; font-weight: 600; color: var(--accent); text-decoration: none; white-space: nowrap; }
.pf-at-acao:hover { text-decoration: underline; }
.pf-tudo-ok { display: flex; gap: 12px; align-items: flex-start; padding: 8px 0; }
.pf-tudo-ok .pf-ponto { margin-top: 6px; }
.pf-tudo-ok p { margin: 0; }

@media (max-width: 1100px) {
  .pf-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .pf-hero > *:nth-child(3) { padding-left: 0; border-left: 0; }
  .pf-linha { grid-template-columns: minmax(0, 1fr); }
  .pf-ops.c3, .pf-ops.c4, .pf-ops.c5 { --pf-cols: 2; }
}
@media (max-width: 640px) {
  .pf-ops.c2, .pf-ops.c3, .pf-ops.c4, .pf-ops.c5 { --pf-cols: 1; }
  .pf-at-resumo { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 520px) {
  .pf-hero { gap: 16px 12px; padding: 18px; }
  .pf-hero > * { padding-left: 0; border-left: 0; }
  .pf-hero b { font-size: 1.45rem; }
  .pf-atencao li { grid-template-columns: minmax(0, 1fr) auto; }
  .pf-atencao .chip-st { grid-column: 1 / -1; }
}
[data-tema="escuro"] .opc-0 { --seg: #22C79C; --seg-soft: #123A33; } [data-tema="escuro"] .opc-1 { --seg: #6FA3E0; --seg-soft: #1A2C45; }
[data-tema="escuro"] .opc-2 { --seg: #E0AE48; --seg-soft: #3A2E15; } [data-tema="escuro"] .opc-3 { --seg: #B48CDB; --seg-soft: #2C2240; }
[data-tema="escuro"] .opc-4 { --seg: #EC8C72; --seg-soft: #3E241D; } [data-tema="escuro"] .opc-5 { --seg: #6CC0B6; --seg-soft: #17332F; }
[data-tema="escuro"] .pf-hero { background: radial-gradient(120% 160% at 100% 0%, #0B8F70 0%, #0F3A43 50%, #0B1E25 100%); }
[data-tema="escuro"] .pf-sin.warn .pf-trilho i { background: #E0A63A; }

/* ---------------------------------------------------------------------
   Painel · cards do topo (opção 3, David, 14/10/2026): faixa de destaque com as
   vidas e os clientes ativos + quatro cartões de atenção com borda colorida.
   Os textos não quebram de linha: as colunas têm a largura do conteúdo.
   --------------------------------------------------------------------- */
.pn-hero { display: grid; grid-template-columns: max-content repeat(4, max-content); justify-content: space-between; align-items: center; gap: 0 20px;
  padding: 20px 26px; border-radius: 18px; color: #fff; box-shadow: var(--shadow);
  background: radial-gradient(120% 160% at 100% 0%, #08B98F 0%, #0E4A55 48%, #0A2833 100%); }
.pn-item { display: grid; gap: 2px; color: inherit; text-decoration: none; white-space: nowrap; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.14); }
.pn-item:first-child { padding-left: 0; border-left: 0; }
.pn-item .l { font-size: .78rem; opacity: .8; }
.pn-item b { font-family: var(--f-display); font-size: 1.85rem; font-weight: 700; letter-spacing: -.01em; line-height: 1.15; font-variant-numeric: tabular-nums; }
.pn-item.destaque b { font-size: 2.6rem; line-height: 1.05; }
.pn-item .f { font-size: .78rem; opacity: .88; }
.pn-item:hover b { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
.pn-item:focus-visible, .pn-alerta:focus-visible { outline: 2px solid var(--mint); outline-offset: 3px; border-radius: 8px; }
.pn-alertas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin: 14px 0 6px; }
.pn-alerta { --cor: var(--muted); display: grid; gap: 2px; padding: 14px 18px; border-radius: 14px; background: var(--surface); border: 1px solid var(--line);
  border-left: 4px solid var(--cor); color: var(--ink); text-decoration: none; box-shadow: var(--shadow); white-space: nowrap; min-width: 0; transition: transform .15s; }
.pn-alerta:hover { transform: translateY(-2px); }
.pn-alerta .l { font-size: .78rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; }
.pn-alerta b { font-family: var(--f-display); font-size: 1.7rem; font-weight: 700; line-height: 1.2; font-variant-numeric: tabular-nums; }
.pn-alerta .f { font-size: .76rem; color: var(--cor); overflow: hidden; text-overflow: ellipsis; }
.pn-alerta.neutro { --cor: var(--muted); } .pn-alerta.ok { --cor: var(--ok); } .pn-alerta.warn { --cor: var(--warn); } .pn-alerta.crit { --cor: var(--crit); }
@media (max-width: 1400px) {
  .pn-hero { gap: 0 14px; padding: 20px 20px; }
  .pn-item { padding-left: 14px; }
  .pn-item b { font-size: 1.65rem; }
  .pn-item.destaque b { font-size: 2.3rem; }
}
@media (max-width: 1240px) {
  .pn-hero { grid-template-columns: repeat(3, max-content); justify-content: start; gap: 18px 28px; }
  .pn-item:nth-child(4) { padding-left: 0; border-left: 0; }
  .pn-alertas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .pn-hero { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 18px; gap: 16px 14px; }
  .pn-item { padding-left: 0; border-left: 0; white-space: normal; }
  .pn-item.destaque { grid-column: 1 / -1; }
  .pn-item .l, .pn-item .f { overflow-wrap: anywhere; }
}
@media (max-width: 520px) {
  .pn-hero { grid-template-columns: minmax(0, 1fr); }
  .pn-item { white-space: nowrap; }
}
@media (max-width: 420px) { .pn-alertas { grid-template-columns: minmax(0, 1fr); } }
/* Cadastro incompleto (clientes antigos): alerta na ficha e no Editar Cadastro; o campo vazio fica com a borda âmbar */
.cad-alerta-ficha { margin-bottom: 16px; background: var(--surface); border: 1px solid var(--line); }
.cad-alerta { background: var(--surface); border: 1px solid var(--line); }
.form-novo-cliente .campo-alerta .input, .form-novo-cliente .campo-alerta .select { border-color: var(--warn); box-shadow: 0 0 0 3px color-mix(in srgb, var(--warn) 14%, transparent); }
.form-novo-cliente .campo-alerta > label::after { content: " · não preenchido"; color: var(--warn); font-weight: 500; }

/* Faixa da lista de Clientes: mesmo visual do Painel, sem link (não há gráfico para onde ir) */
.cl-hero { margin-bottom: 18px; }
.cl-hero .pn-item:hover b { text-decoration: none; }
[data-tema="escuro"] .pn-hero { background: radial-gradient(120% 160% at 100% 0%, #0B8F70 0%, #0F3A43 50%, #0B1E25 100%); }

/* ---------------------------------------------------------------------
   Cadastro do cliente com os produtos (David e Marco, 14/10/2026): um bloco
   por produto (Saúde, Odonto) com dependentes e dados do contrato; resumo
   por produto e "Falta:" no rodapé do pop-up (cadastro.js).
   --------------------------------------------------------------------- */
.form-novo-cliente.tp-fisica .so-pj, .form-novo-cliente.tp-juridica .so-pf { display: none !important; }
.field label .so-pf, .field label .so-pj { color: inherit; font-weight: inherit; margin: 0; }
.prod-bloco { border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: var(--surface); padding: 0 16px 16px; display: grid; gap: 12px; }
.prod-bloco[hidden] { display: none; }
.prod-bloco-topo { display: flex; align-items: center; gap: 10px; margin: 0 -16px; padding: 12px 16px; background: var(--surface-2); border-bottom: 1px solid var(--line); }
.prod-bloco-topo b { font-family: var(--f-display); font-size: 1rem; }
.prod-ico svg { width: 20px; height: 20px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; display: block; }
.prod-selo { margin-left: auto; font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; }
.prod-selo.ok { background: var(--accent-soft); color: var(--accent); }
.prod-selo.pend { background: var(--warn-soft); color: var(--warn); }
.prod-sec { font-size: .7rem; letter-spacing: .08em; text-transform: uppercase; font-weight: 600; color: var(--muted); margin-top: 2px; }
.prod-dica { font-size: .78rem; color: var(--muted); margin: 0; align-self: end; line-height: 1.45; }
.prod-sem-acom { align-self: center; }
.prod-mesmos { border: 0; padding: 0; font-weight: 600; }
.prod-deps { display: grid; gap: 10px; }
.prod-deps[hidden], .dep-tabela[hidden], .dep-planilha[hidden], .dep-linha[hidden] { display: none; }
.dep-tabela { display: grid; gap: 6px; }
.dep-cab, .dep-linha { display: grid; grid-template-columns: 18px minmax(0, 1.6fr) minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr); gap: 6px; align-items: start; }
.dep-cab { font-size: .72rem; font-weight: 600; }
.dep-cab .so-pf, .dep-cab .so-pj { display: block; }
.dep-n { font-weight: 600; color: var(--muted); padding-top: 8px; font-size: .82rem; }
.dep-linha .field { min-width: 0; }
.dep-linha .field[hidden] { display: none; }
.dep-linha .input, .dep-linha .select { font-size: .84rem; padding: 6px 8px; }
.dep-linha .err { font-size: .72rem; }
.dep-planilha { display: grid; gap: 8px; }
.dep-up { display: flex; gap: 10px; align-items: stretch; flex-wrap: wrap; }
.dep-arquivo { flex: 1 1 260px; display: flex; align-items: center; gap: 8px; border: 1.5px dashed var(--accent); border-radius: 12px; padding: 10px 14px; background: var(--accent-soft); cursor: pointer; font-weight: 600; font-size: .86rem; min-width: 0; }
.dep-arquivo input { position: absolute; width: 1px; height: 1px; opacity: 0; }
.dep-arquivo:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.dep-arquivo span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dep-arquivo::before { content: "📄"; }
.dep-planilha.invalid .dep-arquivo { border-color: var(--crit); background: var(--crit-soft); }
.dep-resultado { border-radius: 10px; padding: 9px 12px; font-size: .82rem; background: var(--surface-2); }
.dep-resultado.erro { background: var(--crit-soft); color: var(--crit); }
.dep-resultado.ok { background: var(--accent-soft); color: var(--accent); }
.dep-resultado ul { margin: 6px 0 0; padding-left: 18px; max-height: 160px; overflow: auto; }
.dep-resultado p { margin: 4px 0 0; }
.dep-planilha:not(.invalid) .dep-resultado:empty { display: none; }
.prod-vida { margin: 0; }
.form-novo-cliente .form-acoes { flex-wrap: wrap; row-gap: 8px; }
.form-novo-cliente .form-acoes .sp { flex: 1; }
.prod-resumo { flex: 1 1 100%; display: flex; flex-wrap: wrap; gap: 8px; }
.prod-resumo:empty, .prod-resumo[hidden] { display: none; }
.prod-res { display: grid; padding: 6px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.prod-res small { font-size: .72rem; color: var(--muted); }
.prod-res b { font-size: .88rem; white-space: nowrap; }
.prod-falta { flex: 1 1 100%; margin: 0; font-size: .8rem; color: var(--warn); background: var(--warn-soft); border-radius: 10px; padding: 7px 12px; max-height: 70px; overflow: auto; }
.form-novo-cliente button[type=submit]:disabled { opacity: .5; cursor: not-allowed; }
.vida-tipo { width: min(460px, 100%); }
.vida-sec { display: grid; gap: 12px; }
.vida-sec[hidden], [data-cap][hidden], [data-cap-valor][hidden], [data-so-multiplo][hidden], .vida-aviso-idade[hidden] { display: none !important; }
.prod-opc { text-transform: none; letter-spacing: 0; font-weight: 400; margin-left: 6px; }
.ben-tabela .dep-cab, .ben-tabela .dep-linha { grid-template-columns: 18px minmax(0, 1.8fr) minmax(0, 1fr) minmax(0, 1.1fr) minmax(0, .6fr); }
.vida-tabela .dep-cab, .vida-tabela .dep-linha { grid-template-columns: 18px minmax(0, 1.7fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1fr); }
.vida-tabela.com-salario .dep-cab, .vida-tabela.com-salario .dep-linha { grid-template-columns: 18px minmax(0, 1.6fr) minmax(0, .9fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, .9fr); }
.dep-sal-cel { min-width: 0; }
.vida-conj { border: 0; padding: 0; align-self: end; font-weight: 600; }
.vida-aviso-idade { margin: 0; font-size: .8rem; color: var(--warn); background: var(--warn-soft); border-radius: 10px; padding: 7px 12px; }
.vida-cobs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 14px; }
.vida-cob { display: grid; gap: 4px; align-content: start; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.vida-cob .check { border: 0; padding: 0; }
.vida-cob > div[hidden] { display: none; }
.vida-cob .field label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

@media (max-width: 720px) {
  .dep-cab { display: none; }
  .dep-linha { grid-template-columns: 1fr 1fr; padding: 10px; border: 1px solid var(--line); border-radius: 10px; }
  .dep-n { grid-column: 1 / -1; padding: 0; }
  .dep-linha .dep-nome, .dep-linha .dep-email { grid-column: 1 / -1; }
  .ben-tabela .dep-linha, .vida-tabela .dep-linha, .vida-tabela.com-salario .dep-linha { grid-template-columns: 1fr 1fr; }
  .vida-cobs { grid-template-columns: minmax(0, 1fr); }
}

/* =====================================================================
   Modo noite (pedido do David, 14/10/2026)
   O botão de lua/sol no rodapé do menu troca o atributo data-tema do <html>
   e guarda a escolha no cookie zoe_tema. Quase tudo usa as variáveis de cor,
   então basta trocá-las aqui; abaixo, só as poucas cores fixas que mudam.
   ===================================================================== */
.so-escuro { display: none !important; }
[data-tema="escuro"] .so-claro { display: none !important; }
[data-tema="escuro"] .brand img.brand-logo.so-escuro { display: block !important; }
[data-tema="escuro"] .brand img.brand-marca.so-escuro { display: none !important; }
[data-tema="escuro"] .menu-recolhido .brand img.brand-logo.so-escuro { display: none !important; }
[data-tema="escuro"] .menu-recolhido .brand img.brand-marca.so-escuro { display: block !important; }
.side-tema .ico-sol { display: none; }
[data-tema="escuro"] .side-tema .ico-sol { display: block; }
[data-tema="escuro"] .side-tema .ico-lua { display: none; }

[data-tema="escuro"] {
  color-scheme: dark;
  --bg: #0D161A; --surface: #142126; --surface-2: #1B2B31; --ink: #E3EDEF; --muted: #93A8AF; --line: #263A41;
  --brand: #1E6F62; --accent: #17B890; --mint: #2BE0B2; --accent-soft: #123A33; --exc: #5E747B;
  --side: #111C20; --side-2: #1A2A30; --side-ink: #A9BDC3; --side-hi: #E3EDEF;
  --ok: #4CC38A; --ok-soft: #163828; --warn: #E3A24C; --warn-soft: #3A2C15; --crit: #F2786D; --crit-soft: #3E1F1C;
  --info: #7FA9E9; --info-soft: #1A2B45; --shadow: 0 1px 2px rgba(0,0,0,.35), 0 6px 18px rgba(0,0,0,.25);
}
[data-tema="escuro"] .side { --sd-bg: #111C20; --sd-ink: #A9BDC3; --sd-hi: #E3EDEF; --sd-mut: #6F868D; --sd-line: #22353B; --sd-hover: #1A2A30; --sd-cur: #143A33; --sd-acc: #2BD1A6; --sd-pop: #142126; }

/* Gráficos e mapa: trilhos, grades e bordas que eram cinza-claro fixo */
[data-tema="escuro"] .chart.gp .gl { stroke: var(--line); }
[data-tema="escuro"] .chart.anel .anel-trilho,
[data-tema="escuro"] .ren-trilho,
[data-tema="escuro"] .chart.velo .velo-trilho { stroke: var(--surface-2); fill: none; }
[data-tema="escuro"] .ren-trilho { fill: var(--surface-2); }
[data-tema="escuro"] .mapa-svg path, [data-tema="escuro"] .mapa-svg circle { stroke: var(--surface); }
[data-tema="escuro"] .mapa-rotulos rect { fill: var(--surface); }
[data-tema="escuro"] .mapa-rotulos text.sigla { stroke: var(--surface); }
[data-tema="escuro"] .mp-0 path, [data-tema="escuro"] .mp-0 circle, [data-tema="escuro"] .leg-0 { fill: #1E3036; background: #1E3036; }
[data-tema="escuro"] .op-5 { --op: #9DB2BA; --op-soft: #24363C; }
[data-tema="escuro"] .gp-leg .gp-swp2 { background: linear-gradient(90deg, #6F8C95, #A9C0C6); }
/* Modo noite: tudo escuro, sem nada claro aparecendo ao clicar ou passar o mouse (David, 14/10/2026) */
[data-tema="escuro"] .nav-dica, [data-tema="escuro"] .g-tip { background: #1F3238; color: var(--ink); border: 1px solid #2E464E; box-shadow: 0 10px 26px rgba(0, 0, 0, .45); }
[data-tema="escuro"] .g-tip span { color: var(--mint); }
[data-tema="escuro"] select option, [data-tema="escuro"] select optgroup { background: var(--surface); color: var(--ink); }
[data-tema="escuro"] select option:disabled { color: var(--muted); }
[data-tema="escuro"] .chip[aria-pressed="true"] { background: var(--accent-soft); color: var(--mint); border-color: var(--accent); }
[data-tema="escuro"] .toast { background: #1F3238; color: var(--ink); border: 1px solid #2E464E; box-shadow: 0 10px 30px rgba(0, 0, 0, .45); }

/* Widget de Contratos: cores dos segmentos um pouco mais claras no fundo escuro */
[data-tema="escuro"] .seg-saude { --seg: #22C79C; --seg-soft: #123A33; }
[data-tema="escuro"] .seg-odonto { --seg: #6FA3E0; --seg-soft: #1A2C45; }
[data-tema="escuro"] .seg-vida { --seg: #E0AE48; --seg-soft: #3A2E15; }
[data-tema="escuro"] .ct-fatura .cal small { color: #0D161A; }
[data-tema="escuro"] .gs2-0 { stop-color: #6F8C95; }
[data-tema="escuro"] .gs2-1 { stop-color: #A9C0C6; }
[data-tema="escuro"] .g-destaque { color: var(--mint); }
[data-tema="escuro"] .ct-item .tog.sim { color: #0D161A; }
[data-tema="escuro"] .pilula input:checked + span { color: var(--mint); }
[data-tema="escuro"] img.so-escuro:not(.brand-logo):not(.brand-marca) { display: inline-block !important; }

/* ---------------------------------------------------------------------
   Ficha do cliente · gráficos no estilo do Painel e calendário (Marco, 15/10/2026)
   --------------------------------------------------------------------- */
.ficha-sec { margin-top: 22px; }
.ficha-sec-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; }
.ficha-sec-head h2 { margin: 0; font-size: 1.15rem; }
.ficha-sec-head > div { display: grid; gap: 2px; }
.ficha-sec-head .muted { font-size: .8rem; }
.ficha-graficos { margin-top: 12px; }
.painel-graficos .g-c6 { grid-column: span 6; }
@media (max-width: 760px) { .painel-graficos .g-c6 { grid-column: 1 / -1; } }
.gp-leg .gp-sw2 { background: linear-gradient(#9DB4BB, #6F8C95); }
.anel-sw.anel-cor0 { background: #0FC79C; } .anel-sw.anel-cor1 { background: #2B6F9E; } .anel-sw.anel-cor2 { background: #079A78; } .anel-sw.anel-cor3 { background: #4A8BC0; } .anel-sw.anel-cor4 { background: #2C5866; } .anel-sw.anel-cor5 { background: #6FDCC0; } .anel-sw.anel-cor6 { background: #8FB8DB; } .anel-sw.anel-cor7 { background: #9DB4BB; } .anel-sw.anel-cor8 { background: #3E9C8F; } .anel-sw.anel-cor9 { background: #C9D7DB; }
.ficha-cal { margin-top: 18px; }
.ficha-cal .cal-topo { flex-wrap: wrap; }
.cal-leg { margin-left: auto; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .76rem; color: var(--muted); }
.cal-leg span { display: inline-flex; align-items: center; gap: 6px; }
.cal-leg i { width: 10px; height: 10px; border-radius: 3px; background: var(--info-soft); border-left: 3px solid var(--info); }
.cal-leg i.ok { background: var(--ok-soft); border-left-color: var(--ok); }
.cal-leg i.canc { background: var(--surface-2); border-left-color: var(--exc); }
.ficha-cal .cal-dia { min-height: 92px; }

/* Ficha do cliente em abas (opção C · Marco, 15/10/2026) */
.ficha-abas { display: flex; width: fit-content; max-width: 100%; margin: 0; }
.ficha-abas button { display: inline-flex; align-items: center; gap: 7px; }
.ficha-aba-n { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 99px; background: var(--accent); color: #fff; font-size: .72rem; display: inline-grid; place-items: center; }
.ficha-painel[hidden] { display: none; }
.ficha-painel > :first-child { margin-top: 0; }
.ficha-painel > * + * { margin-top: 18px; }
@media (max-width: 560px) { .ficha-abas { width: auto; overflow-x: auto; flex-wrap: nowrap; } .ficha-abas button { flex: none; } }

/* Topo da ficha (Marco, 15/10/2026): sem "Voltar para a lista"; cadastro incompleto vira um aviso
   com ícone ao lado do documento; as abas encostam no cabeçalho */
.ficha-head p { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }
.cad-aviso { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 7px; border-radius: 99px; background: var(--warn-soft); color: var(--warn); font-size: .76rem; font-weight: 600; text-decoration: none; border: 1px solid color-mix(in srgb, var(--warn) 35%, transparent); cursor: pointer; }
.cad-aviso svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cad-aviso:hover, .cad-aviso:focus-visible { background: var(--warn); color: #fff; }
.ficha-head + .ficha-abas, .ficha-head ~ .modal-bg + .ficha-abas { margin-top: -8px; }
.ficha-hero { margin-bottom: 0; }
.ficha-tl .panel-head h2 { display: flex; align-items: center; gap: 10px; }
.ficha-tl .seg-chip { font-size: .72rem; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: var(--seg-soft); color: var(--seg); border: 0; }

/* ---------------------------------------------------------------------
   Contratos da ficha · opção A (Marco, 15/10/2026): lista limpa, uma linha por
   contrato; clicar abre os detalhes logo abaixo (interface.js · contratosLista)
   --------------------------------------------------------------------- */
.ct-lista { --seg: var(--accent); --seg-soft: var(--accent-soft); }
.ctl-cab, .ctl-linha { display: grid; grid-template-columns: minmax(210px, 2.3fr) minmax(0, 1fr) minmax(0, .55fr) minmax(0, 1.2fr) minmax(0, .85fr) minmax(0, 1.55fr) minmax(0, .85fr) 32px; gap: 14px; align-items: center; }
.ctl-cab { margin-top: 10px; padding: 0 0 9px; border-bottom: 1px solid var(--line); font-size: .68rem; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.ctl-item { border-bottom: 1px solid var(--line); }
.ctl-item:last-child { border-bottom: 0; }
.ctl-linha { position: relative; padding: 13px 0; cursor: pointer; }
.ctl-linha::before { content: ""; position: absolute; left: -18px; top: 13px; bottom: 13px; width: 3px; border-radius: 0 3px 3px 0; background: var(--seg); }
.ctl-linha:hover .ctl-op b { color: var(--seg); }
.ctl-op { display: flex; align-items: center; gap: 11px; min-width: 0; }
.ctl-op > span:last-child { display: grid; line-height: 1.3; min-width: 0; }
.ctl-op b { font-size: .92rem; font-weight: 600; transition: color .15s; }
.ctl-sub { font-size: .8rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ctl-op .lnk-sutil { color: inherit; text-decoration: none; }
.ctl-op .lnk-sutil:hover { color: var(--seg); text-decoration: underline; }
.ctl-c { display: grid; gap: 2px; min-width: 0; font-size: .88rem; }
.ctl-c small { font-size: .74rem; color: var(--muted); }
.ctl-c small.warn { color: var(--warn); font-weight: 600; } .ctl-c small.crit { color: var(--crit); font-weight: 600; }
.ctl-c .badge { justify-self: start; }
.ctl-seg { justify-self: start; font-size: .72rem; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: var(--seg-soft); color: var(--seg); white-space: nowrap; }
.ctl-valor b { font-family: var(--f-display); font-size: 1.02rem; font-weight: 700; letter-spacing: -.01em; }
.ctl-vig { gap: 6px; }
.ctl-barra { display: block; height: 6px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.ctl-barra i { display: block; height: 100%; width: 0; border-radius: inherit; background: var(--seg); transition: width .9s cubic-bezier(.2, .7, .2, 1); }
.ctl-abrir { width: 30px; height: 30px; border-radius: 50%; border: 1px solid var(--line); background: var(--surface); color: var(--muted); display: grid; place-items: center; cursor: pointer; padding: 0; }
.ctl-abrir svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; transition: transform .2s; }
.ctl-abrir:hover { color: var(--ink); border-color: var(--seg); }
.ctl-item.aberto .ctl-abrir svg { transform: rotate(180deg); }
.ctl-det { display: flex; align-items: center; gap: 18px; margin: 0 0 14px; padding: 14px 16px; border-radius: 12px; background: var(--surface-2); }
.ctl-campos { flex: 1; min-width: 0; margin: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px 18px; }
.ctl-info { flex: none; white-space: nowrap; }
.ctl-det[hidden] { display: none; }
.ctl-campos > div { display: grid; align-content: start; gap: 3px; min-width: 0; }
.ctl-det dt { font-size: .72rem; color: var(--muted); }
.ctl-det dd { margin: 0; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-weight: 600; font-size: .88rem; }
.ctl-det dd small { flex-basis: 100%; font-weight: 400; font-size: .74rem; color: var(--muted); }
.ctl-det .ctl-largo { grid-column: span 2; }
.ctl-det .tog { font-size: .72rem; font-weight: 700; padding: 2px 10px; border-radius: 999px; }
.ctl-det .tog.sim { background: var(--seg); color: #fff; } .ctl-det .tog.nao { background: var(--surface); color: var(--muted); border: 1px solid var(--line); }
.ctl-det .escala { display: inline-flex; align-items: flex-end; gap: 3px; height: 14px; }
.ctl-det .escala i { width: 5px; border-radius: 2px; background: var(--line); }
.ctl-det .escala i:nth-child(1) { height: 25%; } .ctl-det .escala i:nth-child(2) { height: 50%; } .ctl-det .escala i:nth-child(3) { height: 75%; } .ctl-det .escala i:nth-child(4) { height: 100%; }
.ctl-det .escala i.on { background: var(--seg); }
.ctl-item.cancelado .ctl-linha { opacity: .62; }
@media (prefers-reduced-motion: reduce) { .ctl-barra i, .ctl-abrir svg { transition: none; } }
/* Telas menores: cada contrato vira um bloco com os rótulos ao lado dos valores */
@media (max-width: 1100px) {
  .ctl-cab { display: none; }
  .ctl-linha { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 16px; padding: 16px 0; }
  .ctl-op { grid-column: 1 / -1; padding-right: 40px; }
  .ctl-c::before { content: attr(data-rot); font-size: .68rem; font-weight: 600; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); }
  .ctl-vig { grid-column: span 2; }
  .ctl-abrir { position: absolute; right: 0; top: 18px; }
  .ctl-campos { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .ctl-linha { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctl-vig { grid-column: 1 / -1; }
  .ctl-campos { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ctl-det { flex-direction: column; align-items: stretch; }
  .ctl-det .ctl-largo { grid-column: 1 / -1; }
}

/* Ficha · gráficos: legendas centralizadas como no Painel; Vidas de ponta a ponta sem espaço vazio (Marco, 15/10/2026) */
.ficha-graficos .gp-leg { justify-content: center; }
.ficha-graficos .g-c12 .chart.gp, .ficha-graficos #fg-fatura .chart.gp, .ficha-graficos #fg-sinistralidade .chart.gp { max-height: none; }
.ficha-graficos #fg-fatura .chart.gp, .ficha-graficos #fg-sinistralidade .chart.gp { margin-top: auto; }

/* Pop-up do Relatório em PDF: escolher as partes antes de gerar (Marco, 15/10/2026) */
.dialogo-pop .modal { width: min(540px, 100%); }
.rel-pdf-form { display: grid; gap: 14px; }
.rel-pdf-form > p { margin: 0; }
.rel-pdf-opcoes { display: grid; gap: 8px; }
.rel-pdf-op { display: flex; gap: 12px; align-items: flex-start; padding: 11px 13px; border: 1px solid var(--line); border-radius: 12px; cursor: pointer; background: var(--surface); transition: border-color .15s, background .15s; }
.rel-pdf-op:hover { border-color: var(--accent); }
.rel-pdf-op:has(input:checked) { border-color: var(--accent); background: var(--accent-soft); }
.rel-pdf-op input { margin-top: 3px; accent-color: var(--accent); width: 16px; height: 16px; flex: none; }
.rel-pdf-op span { display: grid; gap: 1px; }
.rel-pdf-op b { font-size: .9rem; }
.rel-pdf-op small { font-size: .76rem; color: var(--muted); }
.rel-pdf-rodape { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.rel-pdf-acoes { display: flex; gap: 8px; }

/* ---------------------------------------------------------------------
   Ficha · Dados Cadastrais, opção 2 (Marco, 15/10/2026): cartão de perfil + grade
   --------------------------------------------------------------------- */
.fd { display: grid; grid-template-columns: 320px minmax(0, 1fr); gap: 16px; align-items: stretch; }
.fd-perfil { display: flex; flex-direction: column; gap: 16px; padding: 22px; border-radius: 18px; color: #fff; box-shadow: var(--shadow);
  background: radial-gradient(120% 140% at 100% 0%, #08B98F 0%, #0E4A55 52%, #0A2833 100%); }
.fd-av { width: 58px; height: 58px; border-radius: 16px; background: rgba(255, 255, 255, .14); display: grid; place-items: center; font-family: var(--f-display); font-weight: 700; font-size: 1.3rem; }
.fd-perfil h2 { margin: 0; color: #fff; font-family: var(--f-display); font-size: 1.25rem; line-height: 1.2; overflow-wrap: anywhere; }
.fd-l { font-size: .8rem; opacity: .82; }
.fd-pill { align-self: flex-start; font-size: .72rem; font-weight: 700; padding: 3px 11px; border-radius: 99px; background: #2BE0B2; color: #0A2833; }
.fd-pill.inativo { background: #F2A39B; }
.fd-lin { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; font-size: .86rem; }
.fd-lin li { display: flex; gap: 9px; align-items: center; min-width: 0; overflow-wrap: anywhere; }
.fd-lin svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; opacity: .8; }
.fd-bts { display: flex; gap: 8px; flex-wrap: wrap; }
.fd-bts a { color: #fff; text-decoration: none; font-size: .8rem; font-weight: 600; padding: 6px 12px; border-radius: 99px; background: rgba(255, 255, 255, .14); }
.fd-bts a:hover { background: rgba(255, 255, 255, .26); }
.fd-grade { padding-top: 14px; }
.fd-topo { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.fd-topo h2 { margin: 0; }
.fd-grade h3 { font-size: .7rem; font-weight: 600; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); margin: 18px 0 2px; }
.fd-grade dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; }
.fd-grade dl > div { display: grid; gap: 2px; align-content: start; padding: 10px 14px 10px 0; border-bottom: 1px solid var(--line); min-width: 0; }
.fd-grade dl > .fd-2 { grid-column: span 2; }
.fd-grade dt { font-size: .74rem; color: var(--muted); }
.fd-grade dd { margin: 0; font-weight: 600; font-size: .9rem; overflow-wrap: anywhere; }
.fd-grade dd small { display: block; font-weight: 400; font-size: .76rem; color: var(--muted); }
.fd-vazio { color: var(--warn); font-weight: 600; }
.fd-prods { display: flex; flex-wrap: wrap; gap: 8px; padding: 8px 0 2px; }
.fd-prod { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; font-weight: 600; padding: 4px 11px; border-radius: 99px; background: var(--seg-soft); color: var(--seg); }
.fd-prod.nao { background: var(--surface-2); color: var(--muted); font-weight: 500; }
.fd-prod svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.fd-obs { margin: 6px 0 0; font-size: .88rem; color: var(--ink); }
[data-tema="escuro"] .fd-perfil { background: radial-gradient(120% 160% at 100% 0%, #0B8F70 0%, #0F3A43 50%, #0B1E25 100%); }
@media (max-width: 1000px) { .fd { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) { .fd-grade dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .fd-grade dl { grid-template-columns: minmax(0, 1fr); } .fd-grade dl > .fd-2 { grid-column: auto; } }

/* Linha do Tempo por ano, opção A (Marco, 15/10/2026): régua horizontal com os acontecimentos embaixo */
.ftl-rolagem { overflow-x: auto; padding-bottom: 6px; scrollbar-width: thin; }
.ftl-anos { list-style: none; margin: 4px 0 0; padding: 0; display: grid; grid-auto-flow: column; grid-auto-columns: minmax(230px, 1fr); position: relative; }
.ftl-anos::before { content: ""; position: absolute; left: 0; right: 0; top: 6px; height: 3px; border-radius: 3px; background: linear-gradient(90deg, var(--accent-soft), var(--accent)); }
.ftl-ano { position: relative; padding-right: 14px; }
.ftl-pt { display: block; position: relative; z-index: 1; width: 15px; height: 15px; border-radius: 50%; background: var(--surface); border: 3px solid var(--accent); box-sizing: border-box; }
.ftl-ano.atual .ftl-pt { background: var(--accent); box-shadow: 0 0 0 5px var(--accent-soft); }
.ftl-ano h3 { font-family: var(--f-display); font-size: 1.35rem; margin: 12px 0 10px; }
.ftl-ano.atual h3 { color: var(--accent); }
.ftl-ev { display: grid; gap: 2px; padding: 9px 11px; border-radius: 10px; background: var(--surface-2); border-left: 3px solid var(--seg); margin-bottom: 8px; font-size: .8rem; }
.ftl-ev b { font-size: .84rem; font-weight: 600; }
.ftl-ev small { font-size: .74rem; color: var(--muted); }
.ftl-nada { font-size: .8rem; margin: 0; }

/* Produto Não Contratado (Marco, 15/10/2026): no lugar do gráfico, na lista de contratos e nos produtos */
.nao-contratado { flex: 1; display: grid; place-items: center; align-content: center; gap: 6px; min-height: 180px; text-align: center; color: var(--muted); }
.nao-contratado svg, .ctl-nao-ic svg, .nao-contratado-linha svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.nao-contratado svg { width: 34px; height: 34px; opacity: .7; }
.nao-contratado b { color: var(--ink); font-size: .95rem; }
.nao-contratado span { font-size: .8rem; }
.nao-contratado-linha { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px 16px; margin-top: 6px; font-size: .78rem; color: var(--muted); }
.nao-contratado-linha span { display: inline-flex; align-items: center; gap: 6px; }
.nao-contratado-linha svg { width: 14px; height: 14px; }
.ctl-nao-linha { position: relative; display: flex; align-items: center; gap: 11px; padding: 12px 0; }
.ctl-nao-linha::before { content: ""; position: absolute; left: -18px; top: 12px; bottom: 12px; width: 3px; border-radius: 0 3px 3px 0; background: var(--line); }
.ctl-nao-ic { color: var(--muted); background: var(--surface-2) !important; border-color: transparent; }
.ctl-nao-ic svg { width: 20px; height: 20px; }
.ctl-nao-txt { display: grid; line-height: 1.3; flex: 1; }
.ctl-nao-txt b { font-size: .92rem; font-weight: 600; color: var(--muted); }
.ctl-nao-txt span { font-size: .8rem; color: var(--muted); }

/* Cor institucional da operadora nos Contratos da ficha (Marco, 15/10/2026): borda, selo, barra e detalhes.
   O chip do segmento continua na cor do produto. */
.ctl-item[data-cor] .ctl-linha::before { background: var(--op); }
.ctl-item[data-cor] .op-selo:has(b) { background: var(--op-soft); }
.ctl-item[data-cor] .op-selo b { color: var(--op); }
.ctl-item[data-cor] .ctl-barra i { background: var(--op); }
.ctl-item[data-cor] .ctl-linha:hover .ctl-op b { color: var(--op); }
.ctl-item[data-cor] .ctl-abrir:hover { border-color: var(--op); }
.ctl-item[data-cor] .ctl-det .tog.sim { background: var(--op); }
.ctl-item[data-cor] .ctl-det .escala i.on { background: var(--op); }
.ctl-item[data-cor] .ctl-det { background: linear-gradient(90deg, var(--op-soft), var(--surface-2) 45%); }
[data-tema="escuro"] .ctl-item[data-cor] .op-selo b { color: #fff; }
[data-tema="escuro"] .ctl-item[data-cor] .op-selo:has(b) { background: var(--op); }
/* Cadastro da operadora: campo da cor com o seletor ao lado; amostra na lista */
.campo-cor { display: flex; align-items: flex-end; gap: 10px; }
.campo-cor .field { flex: 1; }
.cor-escolher { width: 46px; height: 40px; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); cursor: pointer; margin-bottom: 22px; }
.op-cor-amostra { display: inline-block; width: 11px; height: 11px; border-radius: 3px; margin-right: 8px; vertical-align: 0; background: var(--op, var(--line)); }

/* Dados Cadastrais: o cartão tem a mesma altura da grade ao lado; "Cliente desde" desce para o rodapé (Marco, 15/10/2026) */
.fd-perfil > :last-child { margin-top: auto; }
.fd-grade { margin: 0; }
/* Resumo da Visão Geral na opção 1 "Menta suave" no modo claro (Marco, 15/10/2026); no modo noite continua escuro */
html:not([data-tema="escuro"]) .ficha-hero { background: linear-gradient(120deg, #F2FCF8 0%, #DDF7EF 60%, #C9F1E3 100%); color: #0A2833; border: 1px solid #CDEFE3;
  box-shadow: 0 1px 2px rgba(10, 40, 51, .05), 0 8px 24px rgba(10, 40, 51, .07); }
html:not([data-tema="escuro"]) .ficha-hero .pn-item { border-left-color: rgba(14, 74, 85, .14); }
html:not([data-tema="escuro"]) .ficha-hero .pn-item .l, html:not([data-tema="escuro"]) .ficha-hero .pn-item .f { opacity: 1; color: #5E747B; }
html:not([data-tema="escuro"]) .ficha-hero .pn-item b { color: #0A2833; }
html:not([data-tema="escuro"]) .ficha-hero .pn-item.destaque b { color: #079A78; }
/* Histórico de alterações com Ocultar/Mostrar */
.hist-ocultavel.oculto .panel-head { margin-bottom: 0; }

/* Cartão de perfil: vidas por produto preenchendo a altura (Marco, 15/10/2026) */
.fd-vidas { flex: 1 1 auto; margin-top: 4px; display: flex; flex-direction: column; justify-content: space-between; gap: 0; padding: 12px 14px; border-radius: 14px; background: rgba(255, 255, 255, .10); font-size: .84rem; }
.fd-vidas-t { font-size: .68rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; opacity: .78; padding-bottom: 4px; }
.fd-vidas > div { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid rgba(255, 255, 255, .14); }
.fd-vidas > div.nao b { font-weight: 500; opacity: .7; font-size: .78rem; }
.fd-vidas > .fd-vidas-total { border-bottom: 0; padding-bottom: 0; }
.fd-vidas-total b { color: #2BE0B2; font-size: 1rem; }
.fd-perfil > .fd-vidas + .fd-l { margin-top: 0; }
.fd-grade dl > .fd-3 { grid-column: 1 / -1; }

/* Ficha · "+ Lançar Indicadores" e "+ Anexar Documento" (Marco, 15/10/2026) */
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.lancar-pop .modal { width: min(820px, 100%); }
.lancar-pop .modal-body { padding-top: 16px; }
.lancar-intro { margin: 0; font-size: .86rem; }
.lancar-situacao { align-self: end; }
.lancar-status { display: inline-flex; align-items: center; min-height: 38px; font-size: .84rem; font-weight: 600; }
.lancar-status.ja { color: var(--warn); }
.lancar-status.novo { color: var(--ok); }
.lancar-abas { margin-top: 4px; }
.lancar-abas button { display: inline-flex; align-items: center; gap: 7px; position: relative; }
.lancar-sw { width: 9px; height: 9px; border-radius: 50%; background: var(--seg); }
.lancar-abas button.preenchido::after { content: ""; width: 6px; height: 6px; border-radius: 50%; background: var(--seg); margin-left: 2px; box-shadow: 0 0 0 2px var(--seg-soft); }
.lancar-prod { border: 1px solid var(--line); border-top: 3px solid var(--seg); border-radius: 12px; padding: 4px 16px 16px; margin: 0; min-width: 0; }
.lancar-prod .dform { gap: 10px 12px; }
.lancar-sub { font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--seg); margin: 12px 0 0; }
.lancar-sub .muted { text-transform: none; letter-spacing: 0; font-weight: 600; }
.lancar-passo { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.lancar-passo > div { flex: 1; min-width: 0; display: grid; gap: 6px; justify-items: start; }
.lancar-passo p { margin: 0; font-size: .86rem; }
.lancar-passo .passo { flex: none; margin: 0; }
.lancar-passo .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-right: 6px; vertical-align: -3px; }
.lancar-passo .field { width: 100%; }
.lancar-erros { margin: 4px 0 0; padding: 10px 12px 10px 28px; border-radius: 10px; background: var(--crit-soft); color: var(--crit); font-size: .82rem; display: grid; gap: 3px; }

.fd-docs { margin-top: 18px; }
.fd-docs-vazio { display: flex; gap: 14px; align-items: center; padding: 18px; border: 1px dashed var(--line); border-radius: 12px; }
.fd-docs-vazio svg { width: 30px; height: 30px; flex: none; fill: none; stroke: var(--muted); stroke-width: 1.6; stroke-linejoin: round; }
.fd-docs-vazio p { margin: 0; display: grid; gap: 2px; font-size: .88rem; }
.fd-docs-lista { list-style: none; margin: 0; padding: 0; display: grid; }
.fd-docs-lista li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto auto; gap: 14px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.fd-docs-lista li:last-child { border-bottom: 0; }
.fd-doc-ic { width: 40px; height: 40px; border-radius: 10px; display: grid; place-items: center; background: var(--seg-soft, #E3EDF9); color: #2B6F9E; font-size: .64rem; font-weight: 700; letter-spacing: .04em; }
.fd-doc-nome { display: grid; gap: 2px; min-width: 0; overflow-wrap: anywhere; font-weight: 600; }
.fd-doc-nome small { font-weight: 400; font-size: .78rem; }
.fd-doc-val { font-size: .8rem; color: var(--muted); white-space: nowrap; }
.fd-doc-val.vencido { color: var(--crit); font-weight: 600; }
.fd-docs-lista .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-right: 5px; vertical-align: -3px; }
.anexar-previa { padding: 9px 12px; border-radius: 10px; background: var(--surface-2); font-size: .86rem; }
[data-tema="escuro"] .fd-doc-ic { background: #1A2C45; color: #6FA3E0; }
@media (max-width: 640px) {
  .fd-docs-lista li { grid-template-columns: auto minmax(0, 1fr); }
  .fd-doc-val, .fd-docs-lista li > .btn { grid-column: 2; justify-self: start; }
}
/* Pizza dos procedimentos odontológicos: legenda ao lado, na altura da Sinistralidade (sem espaço vazio) */
#fg-procedimentos > .anel-wrap { flex-direction: row; align-items: center; gap: 22px; }
#fg-procedimentos > .anel-wrap > svg { flex: 0 0 210px; width: 210px; max-width: 210px; }
#fg-procedimentos .anel-leg { flex: 1; min-width: 0; gap: 0; }
#fg-procedimentos .anel-leg div { padding: 5px 2px; }
@media (max-width: 760px) { #fg-procedimentos > .anel-wrap { flex-direction: column; } }
.chart.anel.pizza .anel-seg:hover, .chart.anel.pizza .anel-seg:focus-visible { stroke-width: 82; opacity: .82; }
.fd-cad { flex: 0 0 auto; }
.fd-cad b { font-weight: 600; font-size: .8rem; }
.fd-cad a { color: #2BE0B2; text-decoration: none; }
.fd-cad a:hover { text-decoration: underline; }
.anexar-pop .modal { width: min(620px, 100%); }
/* Topo da ficha: ícones (Marco, 15/10/2026) */
.page-head .actions .btn-icone.perigo { color: var(--crit); }
.page-head .actions .btn-icone.perigo:hover { border-color: var(--crit); background: var(--crit-soft); }
.page-head .actions form.inline { display: inline-flex; }
/* Cartão de perfil dos Dados Cadastrais na cor do Resumo (Marco, 15/10/2026): menta no modo claro, escuro no noturno */
html:not([data-tema="escuro"]) .fd-perfil { background: linear-gradient(160deg, #F2FCF8 0%, #DDF7EF 60%, #C9F1E3 100%); color: #0A2833; border: 1px solid #CDEFE3; }
html:not([data-tema="escuro"]) .fd-perfil h2 { color: #0A2833; }
html:not([data-tema="escuro"]) .fd-av { background: #fff; color: #079A78; box-shadow: 0 1px 3px rgba(10, 40, 51, .08); }
html:not([data-tema="escuro"]) .fd-l { color: #5E747B; opacity: 1; }
html:not([data-tema="escuro"]) .fd-lin svg { color: #079A78; opacity: 1; }
html:not([data-tema="escuro"]) .fd-bts a { color: #0A2833; background: #fff; border: 1px solid #CDEFE3; }
html:not([data-tema="escuro"]) .fd-bts a:hover { background: #F2FCF8; border-color: #9FDFC9; }
html:not([data-tema="escuro"]) .fd-vidas { background: rgba(255, 255, 255, .72); border: 1px solid #CDEFE3; }
html:not([data-tema="escuro"]) .fd-vidas-t { color: #5E747B; opacity: 1; }
html:not([data-tema="escuro"]) .fd-vidas > div { border-bottom-color: rgba(14, 74, 85, .1); }
html:not([data-tema="escuro"]) .fd-vidas-total b, html:not([data-tema="escuro"]) .fd-cad a { color: #079A78; }
html:not([data-tema="escuro"]) .fd-pill { background: #079A78; color: #fff; }
/* Sem quebra de texto no cartão */
.fd-vidas > div > span, .fd-vidas > div > b, .fd-desde { white-space: nowrap; }
.fd-vidas > div > b { overflow: hidden; text-overflow: ellipsis; }
.fd-lin li { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; overflow-wrap: normal; display: flex; }
.fd-lin li > svg + * , .fd-lin li { min-width: 0; }
.fd-lin li > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Visualizador de documentos da ficha */
.doc-visor .modal { width: min(1000px, 100%); height: calc(100dvh - 32px); overflow: hidden; }
.doc-visor .modal-head { align-items: center; }
.doc-visor .modal-head h2 { margin: 0; font-size: 1.05rem; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-visor-acoes { display: flex; gap: 8px; align-items: center; flex: none; }
.doc-visor-acoes .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; margin-right: 5px; vertical-align: -3px; }
.doc-visor-corpo { flex: 1; min-height: 0; background: var(--surface-2); display: grid; place-items: center; }
.doc-visor-corpo iframe { width: 100%; height: 100%; border: 0; background: #fff; }
.doc-visor-corpo img { max-width: 100%; max-height: 100%; object-fit: contain; }
/* "Cliente Há" com anos, meses e dias: no tamanho dos outros números da faixa, numa linha só */
.ficha-hero .pn-item.destaque b { font-size: 1.85rem; line-height: 1.15; white-space: nowrap; }
@media (max-width: 1280px) { .ficha-hero .pn-item.destaque b { font-size: 1.65rem; } }
/* Dados Cadastrais (Marco, 15/10/2026 17h): grade em 4 colunas sem espaço vazio e cartão sem "card dentro de card" */
.fd-grade dl { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.fd-grade dl > .fd-c1 { grid-column: span 1; } .fd-grade dl > .fd-c2 { grid-column: span 2; } .fd-grade dl > .fd-c4 { grid-column: 1 / -1; }
.fd-grade h3 { margin: 16px 0 0; }
.fd-grade dl > div { padding: 9px 14px 10px 0; }
.fd-grade dd .fd-prods { padding: 2px 0 0; }
@media (max-width: 1100px) { .fd-grade dl { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fd-grade dl > .fd-c2 { grid-column: 1 / -1; } }
@media (max-width: 520px) { .fd-grade dl { grid-template-columns: minmax(0, 1fr); } .fd-grade dl > div { grid-column: 1 / -1 !important; } }
.fd-perfil .fd-vidas, html:not([data-tema="escuro"]) .fd-perfil .fd-vidas { background: none; border: 0; border-radius: 0; padding: 14px 0 0; border-top: 1px solid rgba(255, 255, 255, .18); }
html:not([data-tema="escuro"]) .fd-perfil .fd-vidas { border-top-color: rgba(14, 74, 85, .14); }
.fd-perfil .fd-vidas > div { padding: 6px 0; }
.fd-perfil .fd-vidas > div:last-child { border-bottom: 0; }
.fd-perfil { gap: 12px; }
.fd-cab { display: flex; gap: 12px; align-items: flex-start; min-width: 0; }
.fd-cab .fd-av { width: 50px; height: 50px; flex: none; border-radius: 14px; font-size: 1.1rem; }
.fd-cab > div { display: grid; gap: 3px; justify-items: start; min-width: 0; }
.fd-cab .fd-pill { margin-top: 4px; }
.fd-cab .fd-doc { white-space: nowrap; }
.fd-tags { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; white-space: nowrap; }
.fd-tags .fd-pill { margin: 0; }
.fd-cab h2 { overflow-wrap: anywhere; }
/* Dependentes / funcionários do Saúde e do Odonto: coluna "Titular ou Dependente" (Marco, 15/10/2026) */
.prod-deps .dep-tabela:not(.vida-tabela) .dep-cab, .prod-deps .dep-tabela:not(.vida-tabela) .dep-linha { grid-template-columns: 18px minmax(0, 1.35fr) minmax(0, 1.3fr) minmax(0, .95fr) minmax(0, .95fr) minmax(0, 1fr) minmax(0, 1.15fr); }
/* Cartão de perfil um pouco mais largo, para nomes extensos (Marco, 15/10/2026) */
.fd { grid-template-columns: 360px minmax(0, 1fr); }
@media (min-width: 1001px) and (max-width: 1100px) { .fd { grid-template-columns: 320px minmax(0, 1fr); } }
.fd-docs-lista .fd-doc-nome { align-self: center; }
.marcar-pop .modal { width: min(760px, 100%); }
.marcar-cliente { padding: 9px 12px; border-radius: 10px; background: var(--surface-2); font-size: .88rem; }

/* ---------------------------------------------------------------------
   Importar Sinistro (David, 15/10/2026): produto → empresa; Odonto: PDF de procedimentos
   --------------------------------------------------------------------- */
.is-prod { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 16px; }
.is-cartao { display: flex; gap: 16px; align-items: flex-start; padding: 20px; border-radius: 16px; background: var(--surface); border: 1px solid var(--line); border-top: 4px solid var(--seg); color: var(--ink); text-decoration: none; box-shadow: var(--shadow); transition: box-shadow .15s, transform .15s; }
.is-cartao:hover { transform: translateY(-1px); }
.is-cartao.on { box-shadow: 0 0 0 2px var(--seg), var(--shadow); }
.is-cartao b { display: block; font-family: var(--f-display); font-size: 1.1rem; }
.is-cartao small { display: block; color: var(--muted); font-size: .86rem; margin-top: 4px; }
.is-ic { width: 46px; height: 46px; flex: none; border-radius: 12px; display: grid; place-items: center; background: var(--seg-soft); color: var(--seg); }
.is-ic svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.is-lista { padding: 0; overflow: hidden; }
.is-lista .panel-head { padding: 18px 20px 8px; }
.is-busca { display: flex; gap: 8px; padding: 0 20px 14px; }
.is-busca .input { max-width: 360px; }
.is-vazio { padding: 0 20px 20px; }
.is-l { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.3fr) minmax(0, 1fr) 70px minmax(0, 1.1fr) 130px; gap: 14px; align-items: center; padding: 12px 20px; border-top: 1px solid var(--line); }
.is-l:not(.is-cab):hover { background: var(--surface-2); }
.is-cab { font-size: .7rem; text-transform: uppercase; letter-spacing: .06em; color: var(--muted); font-weight: 600; }
.is-l .b { font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.is-op { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; min-width: 0; }
.is-op i { width: 30px; height: 30px; flex: none; border-radius: 8px; display: grid; place-items: center; font-style: normal; font-size: .68rem; font-weight: 700; color: #fff; background: var(--op, #2B6F9E); }
.is-pill { display: inline-block; font-size: .72rem; font-weight: 700; padding: 2px 10px; border-radius: 99px; background: var(--surface-2); color: var(--muted); white-space: nowrap; }
.is-pill.warn { background: var(--warn-soft); color: var(--warn); } .is-pill.ok { background: var(--ok-soft); color: var(--ok); }
.is-acao { text-align: right; }
@media (max-width: 900px) {
  .is-prod { grid-template-columns: minmax(0, 1fr); }
  .is-cab { display: none; }
  .is-l { grid-template-columns: minmax(0, 1fr) auto; }
  .is-l > span:nth-child(3), .is-l > span:nth-child(4) { display: none; }
}
.io-grade { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.2fr); gap: 16px; align-items: start; }
.io-drop { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; text-align: center; padding: 28px 18px; border: 2px dashed var(--line); border-radius: 14px; cursor: pointer; }
.io-drop:hover { border-color: var(--accent); background: var(--accent-soft); }
.io-drop input { max-width: 100%; }
.io-drop b { display: block; } .io-drop small { display: block; color: var(--muted); font-size: .8rem; }
.io-msg { margin: 12px 0 0; font-size: .86rem; color: var(--muted); }
.io-msg.erro { color: var(--crit); font-weight: 600; }
.io-sub { font-size: .7rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); margin: 18px 0 4px; }
.io-hist { list-style: none; margin: 0; padding: 0; }
.io-hist li { display: flex; justify-content: space-between; gap: 10px; padding: 7px 0; border-bottom: 1px solid var(--line); font-size: .86rem; }
.io-aviso { display: grid; gap: 4px; padding: 10px 12px; border-radius: 10px; background: var(--warn-soft); color: var(--warn); font-size: .84rem; font-weight: 600; margin-bottom: 12px; }
.io-aviso p { margin: 0; }
.io-comp { margin-bottom: 8px; }
.io-tab { width: 100%; border-collapse: collapse; font-size: .88rem; margin-bottom: 14px; }
.io-tab th { font-size: .7rem; text-transform: uppercase; letter-spacing: .05em; color: var(--muted); text-align: left; padding: 8px; border-bottom: 1px solid var(--line); }
.io-tab td { padding: 8px; border-bottom: 1px solid var(--line); }
.io-tab .r { text-align: right; font-variant-numeric: tabular-nums; }
.io-tab tfoot td { font-weight: 700; border-bottom: 0; }
@media (max-width: 900px) { .io-grade { grid-template-columns: minmax(0, 1fr); } }
.is-nome { color: var(--ink); text-decoration: none; } .is-nome:hover { color: var(--accent); text-decoration: underline; }
#fg-procedimentos .anel-leg span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }

/* Sinistro de Vida (David, 15/10/2026): etapas, alerta de prazo, próximo passo, aviso com beneficiários */
.sv-etapas { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; }
.sv-et { position: relative; display: flex; flex-direction: column; align-items: center; text-align: center; gap: 4px; padding: 0 6px; min-width: 0; }
.sv-et::before { content: ""; position: absolute; top: 15px; left: -50%; width: 100%; height: 3px; background: var(--line); z-index: 0; }
.sv-et:first-child::before { display: none; }
.sv-et.ok::before, .sv-et.atual::before { background: var(--accent); }
.sv-et .pt { position: relative; z-index: 1; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; font-size: .85rem; background: var(--surface-2); color: var(--muted); border: 2px solid var(--line); }
.sv-et.ok .pt { background: var(--accent); border-color: var(--accent); color: #fff; }
.sv-et.atual .pt { background: var(--surface); border-color: var(--accent); color: var(--accent); box-shadow: 0 0 0 4px var(--accent-soft); }
.sv-et.recusado.ok .pt { background: var(--crit); border-color: var(--crit); }
.sv-et b { font-size: .84rem; line-height: 1.25; }
.sv-et small { font-size: .74rem; color: var(--muted); min-height: 1em; }
.sv-alerta { margin: 14px 0 0; padding: 10px 14px; border-radius: 10px; font-size: .88rem; font-weight: 500; border-left: 4px solid var(--accent); background: var(--accent-soft); color: var(--ink); }
.sv-alerta.warn { border-color: var(--warn); background: var(--warn-soft); color: var(--warn); }
.sv-alerta.crit { border-color: var(--crit); background: var(--crit-soft); color: var(--crit); }
.sv-alerta.ok { border-color: var(--ok); background: var(--ok-soft); color: var(--ok); }
.sv-al.warn { color: var(--warn); } .sv-al.crit { color: var(--crit); font-weight: 600; }
.sv-grade { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.sv-col { display: flex; flex-direction: column; gap: 16px; min-width: 0; }
.sv-col > .panel { margin: 0; }
.sv-opcoes { display: flex; flex-wrap: wrap; gap: 8px; }
.sv-op { position: relative; cursor: pointer; }
.sv-op input { position: absolute; opacity: 0; pointer-events: none; }
.sv-op span { display: inline-block; padding: 8px 14px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); font-size: .86rem; font-weight: 500; }
.sv-op input:checked + span { background: var(--accent); border-color: var(--accent); color: #fff; }
.sv-op-recusado input:checked + span { background: var(--crit); border-color: var(--crit); }
.sv-op input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.sv-dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; margin: 0; }
.sv-dl dt { font-size: .76rem; color: var(--muted); }
.sv-dl dd { margin: 2px 0 0; font-weight: 500; overflow-wrap: anywhere; }
.sv-desc { margin: 12px 0 0; padding: 10px 12px; background: var(--surface-2); border-radius: 10px; font-size: .88rem; }
.sv-sub { font-size: .82rem; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); margin: 14px 0 6px; grid-column: 1 / -1; }
.sv-movs { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.sv-movs li { display: flex; gap: 10px; align-items: center; flex-wrap: wrap; font-size: .86rem; }
.sv-movs li span { color: var(--muted); }
.sv-kit-txt { margin: 0 0 10px; font-size: .86rem; }
.sv-firma { display: flex; gap: 10px; align-items: center; margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: var(--ok-soft); font-size: .88rem; }
.sv-firma svg { width: 22px; height: 22px; flex: none; fill: none; stroke: var(--ok); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sv-tag { text-decoration: none; }
.sv-form > .panel { margin-bottom: 16px; }
.sv-seg { font-size: .82rem; font-weight: 600; color: var(--accent); }
.sv-exclusao { display: flex; gap: 12px; align-items: flex-start; padding: 12px 14px; border-radius: 10px; background: var(--crit-soft); color: var(--crit); }
.sv-exclusao svg { width: 22px; height: 22px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sv-exclusao b { display: block; }
.sv-exclusao span { font-size: .86rem; color: var(--ink); }
.sv-ben { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 4px 12px; padding: 14px 0; border-top: 1px solid var(--line); margin-top: 14px; }
.sv-ben-n { grid-row: span 2; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); font-weight: 700; font-size: .85rem; margin-top: 22px; }
.sv-mais { grid-column: 2; }
.sv-mais summary { cursor: pointer; font-size: .86rem; font-weight: 600; color: var(--accent); padding: 6px 0; }
.sv-mais > .dform { padding-top: 8px; }
.sv-acoes { display: flex; justify-content: flex-end; gap: 8px; }
@media (max-width: 1000px) { .sv-grade { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 640px) {
  .sv-etapas { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .sv-et { flex-direction: row; text-align: left; gap: 10px; }
  .sv-et::before { display: none; }
  .sv-dl { grid-template-columns: minmax(0, 1fr); }
  .sv-ben { grid-template-columns: minmax(0, 1fr); } .sv-ben-n { grid-row: auto; margin: 0; } .sv-mais { grid-column: 1; }
}

/* Formulários das seguradoras no sinistro de vida (David, 16/10/2026) */
.sv-forms-txt { margin: 0 0 14px; font-size: .86rem; }
.sv-forms-lista { display: flex; flex-direction: column; gap: 10px; }
.sv-fc { border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; background: var(--surface); }
.sv-fc.aviso { border-left: 4px solid var(--accent); }
.sv-fc-cab { display: flex; gap: 12px; align-items: flex-start; }
.sv-fc-cab > svg { width: 22px; height: 22px; flex: none; fill: none; stroke: var(--accent); stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; margin-top: 2px; }
.sv-fc-cab b { display: block; font-size: .95rem; }
.sv-fc-cab small { display: block; margin-top: 4px; font-size: .78rem; }
.sv-fc-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 5px; }
.sv-fc-nada { margin: 8px 0 0 34px; font-size: .84rem; }
.sv-fl { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 10px; align-items: center; margin: 10px 0 0 34px; padding-top: 10px; border-top: 1px dashed var(--line); }
.sv-fl-nome { font-size: .86rem; color: var(--muted); min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sv-fl-acoes { display: flex; gap: 6px; }
.sv-st { font-size: .76rem; font-weight: 600; padding: 3px 10px; border-radius: 99px; background: var(--surface-2); color: var(--muted); white-space: nowrap; }
.sv-st.pre { background: var(--warn-soft); color: var(--warn); }
.sv-st.ok { background: var(--ok-soft); color: var(--ok); }
.sv-aviso { margin: 0 0 12px; padding: 9px 12px; border-radius: 10px; background: var(--accent-soft); color: var(--ink); font-size: .86rem; font-weight: 500; }
.sv-aviso.erro { background: var(--crit-soft); color: var(--crit); }
.sv-vazio { margin: 0; padding: 14px; border-radius: 10px; background: var(--surface-2); font-size: .88rem; }
.sv-erro { color: var(--crit); }
.sv-sem-forms, .sv-erro-forms { margin-bottom: 16px; }
.sv-exclusao.info { background: var(--accent-soft); color: var(--accent); }
.sv-pop .modal { width: min(940px, 100%); }
.sv-pop .modal-head p { margin: 2px 0 0; font-size: .8rem; }
.sv-pop .modal-foot { align-items: center; }
.sv-pop-msg { margin-right: auto; font-size: .84rem; color: var(--crit); }
/* Formulários do sinistro "Na Folha" (Marco, 20/10/2026): mesmo visual da proposta, dentro do pop-up */
.sv-pop.folha .modal { width: min(1240px, 100%); }
.sv-oculta { display: none !important; }
.sv-pop .pr-vista { margin-bottom: 12px; justify-self: start; width: max-content; }
.sv-fo .fo-topo { top: -18px; }
.sv-fo .fo-lado { top: 52px; max-height: calc(100vh - 220px); }
.sv-fo .fo-c.marca { font-weight: 700; }
@media (max-width: 980px) { .sv-fo { grid-template-columns: minmax(0, 1fr); } .sv-fo .fo-lado { position: static; max-height: none; } }
.sv-grp { border: 0; margin: 0; padding: 0; min-width: 0; }
.sv-grp legend { font-size: .78rem; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--accent); padding: 0; margin-bottom: 8px; }
.sv-grp + .sv-grp { border-top: 1px solid var(--line); padding-top: 14px; }
.sv-cond { color: var(--muted); }
.sv-lista-linhas { display: flex; flex-direction: column; gap: 6px; margin: 6px 0; }
.sv-lista-l { display: flex; gap: 6px; align-items: center; }
.sv-lista-n { width: 22px; flex: none; font-size: .8rem; font-weight: 700; color: var(--muted); text-align: right; }
.sv-lista-c { flex: 1 1 120px; min-width: 0; }
.sv-lista-c.c-nome, .sv-lista-c.c-email, .sv-lista-c.c-nome_social { flex: 2 1 200px; }
.sv-lista-c .input { width: 100%; }
.sv-lista-c .input[aria-invalid] { border-color: var(--crit); }
.sv-check { gap: 4px; }
.sv-check-g { display: block; margin: 10px 0 2px; font-size: .82rem; }
.sv-check-i { display: flex; gap: 8px; align-items: flex-start; font-weight: 400; font-size: .86rem; padding: 3px 0; cursor: pointer; }
.sv-check-i input { margin-top: 3px; flex: none; }
@media (max-width: 700px) {
  .sv-fl { grid-template-columns: minmax(0, 1fr); margin-left: 0; }
  .sv-lista-l { flex-wrap: wrap; }
}
.sv-voltar { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 10px; }
.sv-voltar summary { display: inline-flex; gap: 8px; align-items: center; cursor: pointer; font-size: .86rem; font-weight: 600; color: var(--muted); }
.sv-voltar summary svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.sv-voltar[open] summary { color: var(--ink); margin-bottom: 10px; }
.sv-voltar .form-acoes { align-self: end; }
.is-op > span { display: flex; flex-direction: column; min-width: 0; }
.is-forms { font-size: .74rem; color: var(--muted); font-weight: 400; }
.is-acao { display: flex; gap: 6px; flex-wrap: wrap; justify-content: flex-end; }
.sv-rasc { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.sv-rasc li { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 0; border-top: 1px solid var(--line); }
.sv-rasc li:first-child { border-top: 0; }
.sv-rasc small { display: block; color: var(--muted); font-size: .78rem; }
.sv-rasc .acoes { display: flex; gap: 6px; }

/* Importar Sinistro · Odonto, painel da empresa (David, 16/10/2026) */
.io-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 16px; }
.io-k { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; box-shadow: var(--shadow); min-width: 0; }
.io-k span { display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--muted); font-weight: 600; }
.io-k span svg { width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.io-k b { font-family: var(--f-display); font-size: 1.8rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.io-k small { font-size: .78rem; color: var(--muted); display: flex; flex-wrap: wrap; gap: 4px 8px; }
.io-k em { font-style: normal; font-weight: 700; }
.io-k em.sobe { color: var(--crit); } .io-k em.desce { color: var(--ok); }
.io-k.destaque { background: linear-gradient(135deg, var(--brand), #12404F); border-color: transparent; color: #fff; }
.io-k.destaque span, .io-k.destaque small { color: rgba(255, 255, 255, .78); }
.io-k.destaque span svg { stroke: var(--mint); }
.io-k.destaque em.sobe { color: #FFB4A8; } .io-k.destaque em.desce { color: var(--mint); }
.io-graficos { display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(0, 1fr); gap: 16px; margin-bottom: 16px; align-items: stretch; }
.io-graficos > .panel { margin: 0; }
.io-drop { position: relative; flex-direction: row; gap: 16px; padding: 26px 22px; text-align: left; background: var(--surface-2); }
.io-drop > svg { width: 38px; height: 38px; flex: none; fill: none; stroke: var(--accent); stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; padding: 8px; border-radius: 12px; background: var(--accent-soft); }
.io-drop input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.io-drop:focus-within { outline: 2px solid var(--accent); outline-offset: 2px; }
.io-drop b { font-size: 1rem; }
.io-envio { margin-bottom: 16px; }
.io-mini { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.io-mini > div { background: var(--surface-2); border-radius: 12px; padding: 12px 14px; min-width: 0; }
.io-mini span { display: block; font-size: .74rem; color: var(--muted); font-weight: 600; }
.io-mini b { display: block; font-size: 1.25rem; margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.io-mini small { display: block; font-size: .74rem; color: var(--muted); }
.io-tab td.b { font-weight: 700; }
.io-pct { min-width: 150px; }
.io-pct { display: flex; align-items: center; gap: 8px; }
.io-barra { flex: 1; height: 8px; border-radius: 99px; background: var(--surface-2); overflow: hidden; }
.io-barra i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, var(--accent), var(--mint)); }
.io-pct small { width: 46px; text-align: right; font-variant-numeric: tabular-nums; color: var(--muted); }
.io-var.sobe { color: var(--crit); font-weight: 600; } .io-var.desce { color: var(--ok); font-weight: 600; } .io-var.igual { color: var(--muted); }
.io-previa .io-comp { align-items: end; margin-top: 4px; }
.io-hist-tab { width: 100%; }
@media (max-width: 1100px) { .io-kpis, .io-mini { grid-template-columns: repeat(2, minmax(0, 1fr)); } .io-graficos { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 560px) { .io-kpis, .io-mini { grid-template-columns: minmax(0, 1fr); } }

/* Aba Beneficiários da ficha do cliente (David, 16/10/2026) */
.fb .panel-head { align-items: flex-start; }
.fb .panel-head h2 { margin: 0; }
.fb-cont { margin: 4px 0 0; font-size: .82rem; }
.fb-acoes { display: flex; gap: 8px; flex-wrap: wrap; }
.fb-tab td { vertical-align: middle; }
.fb-email { max-width: 260px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.fb-p-exc { text-decoration: line-through; opacity: .7; }
.fb-mais { display: flex; justify-content: center; margin-top: 10px; }
/* Produtos: o gráfico Prêmio × Indenizações ocupa a altura do painel ao lado (David, 16/10/2026) */
.pf-graf > svg, .pf-graf .grafico { margin-top: auto; margin-bottom: auto; }

/* ===== Importar Vidas · Seguro de Vida (David, 16/10/2026) ===== */
.is-prod.tres { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mv-tab .mv-l { display: grid; grid-template-columns: minmax(0, 2.2fr) minmax(0, 1.5fr) 100px minmax(0, 1.4fr) 90px; gap: 14px; align-items: center; padding: 12px 20px; border-top: 1px solid var(--line); color: var(--ink); text-decoration: none; }
.mv-tab a.mv-l:hover { background: var(--surface-2); }
.mv-tab a.mv-l:hover .btn { border-color: var(--seg); }
.mv-tab .mv-l[hidden] { display: none; }
.mv-l .b small { font-weight: 400; }
.mv-l .num { font-variant-numeric: tabular-nums; font-weight: 600; }
.mv-ult { display: flex; flex-direction: column; font-size: .84rem; }
.mv-ult small { font-size: .78rem; }
.mv-mais { color: var(--ok); } .mv-menos { color: var(--crit); }
.mv-apolices { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 14px; }
.mv-apolices .chip { padding: 6px 12px; border-radius: 99px; border: 1px solid var(--line); background: var(--surface); font-size: .84rem; }
.mv-apolices .chip.on { border-color: var(--seg, var(--accent)); box-shadow: 0 0 0 1px var(--seg, var(--accent)) inset; font-weight: 600; }
.mv-kpis { display: grid; grid-template-columns: 1fr 1.6fr 1fr 1fr; gap: 14px; margin-bottom: 16px; }
.mv-k { background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 16px 18px; display: flex; flex-direction: column; gap: 4px; box-shadow: var(--shadow); min-width: 0; }
.mv-k > span { font-size: .8rem; color: var(--muted); font-weight: 600; }
.mv-k > b { font-family: var(--f-display); font-size: 1.6rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.mv-k small { font-size: .8rem; color: var(--muted); }
.mv-k.destaque { border-top: 4px solid var(--seg); }
.mv-k-ult > b { font-size: 1.15rem; }
.mv-planilha .panel-head .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; }
.mv-txt { margin: 0 0 12px; color: var(--ink-2, var(--ink)); font-size: .9rem; }
.mv-colunas { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 14px; padding: 0; }
.mv-colunas li { display: inline-flex; align-items: center; gap: 8px; padding: 5px 12px 5px 5px; border-radius: 99px; background: var(--surface-2); font-size: .84rem; }
.mv-colunas b { display: inline-grid; place-items: center; width: 24px; height: 24px; border-radius: 50%; background: var(--seg-soft, var(--accent-soft)); color: var(--seg, var(--accent)); font-size: .78rem; }
.io-drop.sobre { border-color: var(--accent); background: var(--accent-soft); }
.mv-duas { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: stretch; margin-bottom: 16px; }
.mv-duas > .panel { margin: 0; }
.mv-sel { height: auto; min-height: 170px; padding: 4px; margin-top: 6px; }
.mv-sel option { padding: 6px 8px; border-radius: 6px; }
.mv-hist .mv-det small { display: block; color: var(--muted); font-size: .78rem; max-width: 420px; }
.mv-conta { display: flex; flex-wrap: wrap; align-items: stretch; gap: 10px; margin-bottom: 10px; }
.mv-conta > div { flex: 1 1 130px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; box-shadow: var(--shadow); }
.mv-conta > div span { font-size: .78rem; color: var(--muted); font-weight: 600; }
.mv-conta > div b { font-family: var(--f-display); font-size: 1.7rem; font-weight: 700; font-variant-numeric: tabular-nums; }
.mv-conta > i { align-self: center; font-style: normal; font-size: 1.4rem; font-weight: 700; color: var(--muted); }
.mv-conta .menos b { color: var(--crit); } .mv-conta .mais b { color: var(--ok); }
.mv-conta .total { border-top: 4px solid var(--brand); }
.mv-conta .mv-conta-pl { margin-left: 8px; background: var(--surface-2); box-shadow: none; }
.mv-conta-pl small { font-size: .78rem; font-weight: 600; }
.mv-conta-pl.ok small { color: var(--ok); } .mv-conta-pl.warn small { color: var(--warn); }
.mv-alerta { padding: 12px 16px; border-radius: 12px; background: var(--info-soft); color: var(--ink); border-left: 4px solid var(--info); margin-bottom: 16px; font-size: .9rem; }
.mv-filtro-previa { margin: 6px 0 12px; } .mv-filtro-previa .input { max-width: 420px; }
.mv-lista-mov .panel-head h2 { display: flex; align-items: center; gap: 8px; }
.mv-ponto { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.mv-ponto.mais { background: var(--ok); } .mv-ponto.menos { background: var(--crit); }
.mv-rolagem { max-height: 460px; overflow: auto; }
.mv-rolagem thead th { position: sticky; top: 0; background: var(--surface); z-index: 1; }
.mv-rolagem tr[hidden] { display: none; }
.mv-aceite p { margin: 0 0 12px; }
.mv-confirma { display: flex; gap: 10px; align-items: flex-start; padding: 12px 14px; border-radius: 12px; background: var(--warn-soft); margin-bottom: 12px; cursor: pointer; }
.mv-confirma input { margin-top: 3px; }
.mv-erros { border-top: 4px solid var(--crit); }
@media (max-width: 1100px) {
  .is-prod.tres { grid-template-columns: minmax(0, 1fr); }
  .mv-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mv-duas { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 700px) {
  .mv-tab .mv-l { grid-template-columns: minmax(0, 1fr) auto; }
  .mv-tab .mv-l > span:nth-child(2), .mv-tab .mv-l > span:nth-child(4) { display: none; }
  .mv-conta > i { display: none; }
  .mv-conta .mv-conta-pl { margin-left: 0; }
}
.mv-duas.mv-previa { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
.mv-lista-mov table { font-size: .84rem; }
.mv-lista-mov td.b { min-width: 150px; }
.mv-lista-mov th, .mv-lista-mov td { padding-left: 8px; padding-right: 8px; }
.mv-filtro-previa .input { width: 100%; }
@media (max-width: 1100px) { .mv-duas.mv-previa { grid-template-columns: minmax(0, 1fr); } }
.mv-tab .mv-l .b { font-weight: 600; }

/* Faixa de números em Relatórios e Análises (David, 16/10/2026): mesmo visual da lista de Clientes, com 3 a 6 números */
.pn-hero.faixa { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: max-content; }
.pn-hero.faixa .pn-item { min-width: 0; }
.pn-hero.faixa .pn-item b { max-width: 22ch; overflow: hidden; text-overflow: ellipsis; }
.pn-hero.faixa .pn-item.ok .f { color: #8CF0CF; opacity: 1; } .pn-hero.faixa .pn-item.warn .f { color: #FFD27A; opacity: 1; } .pn-hero.faixa .pn-item.crit .f { color: #FFB1A8; opacity: 1; }
.pn-hero.faixa a.pn-item.link:hover b { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
@media (max-width: 1240px) {
  .pn-hero.faixa { grid-auto-flow: row; grid-template-columns: repeat(3, max-content); }
  .pn-hero.faixa .pn-item:nth-child(4) { padding-left: 0; border-left: 0; }
}
@media (max-width: 760px) {
  .pn-hero.faixa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 520px) {
  .pn-hero.faixa { grid-template-columns: minmax(0, 1fr); }
}

/* Importar Vidas · Saúde e Odonto (David, 19/10/2026) */
.mv-modelos { display: flex; flex-wrap: wrap; gap: 8px; }
.mv-modelos .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; }
.mv-seg { display: flex; flex-wrap: wrap; align-items: center; gap: 0; border: 0; padding: 0; margin: 0 0 4px; }
.mv-seg label { cursor: pointer; }
.mv-seg input { position: absolute; opacity: 0; pointer-events: none; }
.mv-seg span { display: inline-block; padding: 8px 18px; border: 1px solid var(--line); background: var(--surface); font-weight: 600; font-size: .88rem; }
.mv-seg label:first-of-type span { border-radius: 10px 0 0 10px; }
.mv-seg label:nth-of-type(2) span { border-radius: 0 10px 10px 0; border-left: 0; }
.mv-seg input:checked + span { background: var(--brand); color: #fff; border-color: var(--brand); }
.mv-seg input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.mv-seg input:disabled + span { opacity: .5; cursor: not-allowed; }
.mv-seg small { margin-left: 10px; }
.mv-endereco { border: 1px dashed var(--line); border-radius: 12px; padding: 10px 14px; }
.mv-endereco summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.mv-endereco .dform { margin-top: 10px; }
.mv-consequencia { margin: 0; padding: 10px 14px; border-radius: 10px; background: var(--warn-soft); color: var(--ink); font-size: .86rem; border-left: 4px solid var(--warn); }
.mv-consequencia.definitiva { background: var(--crit-soft); border-left-color: var(--crit); }
.mv-junto { display: block; font-size: .74rem; color: var(--muted); font-weight: 400; }
.mv-mot { font-size: .8rem; max-width: 260px; }
.mv-pilha { display: flex; flex-direction: column; gap: 12px; margin-bottom: 16px; }
.mv-pilha > .panel { margin: 0; }
.mv-pilha > .panel:has(> p.muted:only-of-type) { order: 2; }

/* ---------------------------------------------------------------- Propostas do Plano de Saúde (David, 19/10/2026) */
.pr-topo { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 24px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 12px 18px; margin-bottom: 14px; box-shadow: var(--shadow); }
.pr-st { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.pr-st > span:first-child { font-size: .8rem; color: var(--muted); font-weight: 600; }
.pr-passos { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; flex-wrap: wrap; }
.pr-passos li { display: flex; align-items: center; gap: 6px; font-size: .84rem; color: var(--muted); padding: 4px 10px 4px 4px; border-radius: 99px; background: var(--surface-2); }
.pr-passos li b { display: inline-grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--line); color: var(--ink); font-size: .74rem; }
.pr-passos li.on { background: var(--accent-soft); color: var(--ink); font-weight: 600; }
.pr-passos li.on b { background: var(--accent); color: #fff; }
.pr-passos li.ok b { background: var(--ok); color: #fff; }
.pr-falta { margin-left: auto; font-size: .84rem; font-weight: 600; padding: 4px 12px; border-radius: 99px; }
.pr-falta:empty { display: none; }
.pr-falta.pend { background: var(--warn-soft); color: var(--warn); }
.pr-falta.ok { background: var(--ok-soft); color: var(--ok); }
.pr-aviso { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-radius: 12px; background: var(--warn-soft); border-left: 4px solid var(--warn); margin: 0 0 14px; font-size: .9rem; }
.pr-aviso svg { width: 20px; height: 20px; flex: none; fill: none; stroke: var(--warn); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pr-aviso.ok { background: var(--ok-soft); border-left-color: var(--ok); }
.pr-aviso.muted { background: var(--surface-2); border-left-color: var(--exc); }
.pr-geral { margin: 0 0 12px; }
.pr-lista-erros { background: var(--crit-soft); border-left: 4px solid var(--crit); border-radius: 12px; padding: 10px 16px; margin-bottom: 14px; font-size: .88rem; }
.pr-lista-erros ul { margin: 6px 0 0; padding-left: 18px; }
.pr-sec { margin-bottom: 16px; }
.pr-h3 { font-size: .95rem; margin: 16px 0 8px; color: var(--ink); }
.pr-grupos > .pr-h3:first-child { margin-top: 4px; }
.pr-opc { border: 1px dashed var(--line); border-radius: 12px; padding: 8px 14px; margin-top: 12px; }
.pr-opc summary { cursor: pointer; font-weight: 600; font-size: .9rem; }
.pr-opc .dform { margin-top: 10px; }
.pr-pessoa { border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; margin-bottom: 12px; background: var(--surface); }
.pr-pessoa.tem-erro { border-color: var(--crit); }
.pr-pes-cab { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.pr-pes-cab > div { display: flex; flex-direction: column; min-width: 0; flex: 1; }
.pr-pes-cab small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pr-av { flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--brand); color: #fff; font-weight: 700; font-family: var(--f-display); }
.pr-add { width: 100%; justify-content: center; border-style: dashed; }
.pr-add svg, .pr-pes-cab .btn svg, .pr-barra .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.pr-anexos { margin-top: 8px; }
.pr-sn { display: inline-flex; gap: 0; }
.pr-sn label { cursor: pointer; }
.pr-sn input { position: absolute; opacity: 0; pointer-events: none; }
.pr-sn span { display: inline-block; padding: 7px 16px; border: 1px solid var(--line); background: var(--surface); font-weight: 600; font-size: .86rem; }
.pr-sn label:first-child span { border-radius: 9px 0 0 9px; }
.pr-sn label:last-child span { border-radius: 0 9px 9px 0; border-left: 0; }
.pr-sn input:checked + span { background: var(--brand); color: #fff; border-color: var(--brand); }
.pr-sn input[value="S"]:checked + span { background: var(--warn); border-color: var(--warn); }
.pr-sn input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.pr-sn input:disabled + span { opacity: .6; cursor: default; }
.pr-sn.sm span { padding: 4px 9px; font-size: .8rem; }
.pr-atalhos { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 10px; }
.pr-ds-wrap { max-height: 70vh; overflow: auto; border: 1px solid var(--line); border-radius: 12px; }
.pr-ds { border-collapse: separate; border-spacing: 0; width: 100%; font-size: .84rem; }
.pr-ds th, .pr-ds td { border-bottom: 1px solid var(--line); padding: 6px 8px; vertical-align: middle; background: var(--surface); }
.pr-ds thead th { position: sticky; top: 0; z-index: 2; background: var(--surface-2); }
.pr-ds .pr-q { text-align: left; min-width: 280px; max-width: 520px; position: sticky; left: 0; z-index: 1; }
.pr-ds thead .pr-q { z-index: 3; }
.pr-ds .pr-col { text-align: center; min-width: 92px; }
.pr-ds th.pr-col b, .pr-ds th.pr-col small { display: block; }
.pr-ds th.pr-col small { font-weight: 400; color: var(--muted); max-width: 90px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin: 0 auto; }
.pr-ds td.sim { background: var(--warn-soft); }
.pr-ds td.invalid { background: var(--crit-soft); box-shadow: inset 0 0 0 2px var(--crit); }
.pr-ds .pr-med .input { width: 76px; text-align: center; padding: 5px 6px; }
.pr-esc { margin-top: 8px; }
.pr-esc-l { display: grid; grid-template-columns: 200px 150px minmax(0, 1fr); gap: 8px; align-items: center; padding: 6px 0; border-bottom: 1px dashed var(--line); }
.pr-esc-q { display: flex; flex-direction: column; }
.pr-esc-q small { color: var(--muted); }
.pr-esc .input.invalid { border-color: var(--crit); }
.pr-barra { position: sticky; bottom: 0; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; background: var(--surface); border: 1px solid var(--line); border-radius: 14px; padding: 10px 14px; margin: 0 0 16px; box-shadow: 0 -4px 18px rgba(10,40,51,.08); }
.pr-barra-txt { margin-right: auto; font-size: .86rem; }
.pr-fim .panel { margin: 0; }
/* Propostas na tela do cliente */
.pr-lista { display: flex; flex-direction: column; gap: 8px; }
.pr-item { display: grid; grid-template-columns: minmax(0, 2fr) auto auto auto; gap: 12px; align-items: center; padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); text-decoration: none; color: inherit; }
.pr-item:hover { border-color: var(--accent); }
.pr-item b { display: block; }
.pr-item small { color: var(--muted); }
.pr-nova { display: flex; flex-direction: column; gap: 12px; }
.pr-nova .mv-txt { margin: 0; }
@media (max-width: 760px) {
  .pr-esc-l { grid-template-columns: minmax(0, 1fr); }
  .pr-item { grid-template-columns: minmax(0, 1fr) auto; }
  .pr-falta { margin-left: 0; }
  .pr-ds .pr-q { min-width: 200px; }
}
.pr-fim > .panel + .panel { margin-top: 0; } .pr-fim:not(.mv-duas) > .panel { margin-bottom: 16px; }

/* Aba Clientes no desenho do Prontuário do Cliente (Marco, 20/10/2026): faixa clara e filtros como o "Período",
   todos numa linha só (cada filtro do tamanho da escolha) */
.ficha-hero.cl-lista-hero { margin-bottom: 18px; }
.cl-filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 14px; }
.cl-chip { padding: 3px 2px 3px 10px; gap: 2px; }
.cl-chip span { font-size: .62rem; letter-spacing: .04em; }
.cl-chip .select { width: auto; max-width: none; padding-left: 4px; padding-right: 2px; font-size: .86rem; text-overflow: ellipsis; }
.cl-chip.largo .select { width: 112px; }
.cl-busca { flex: 1 1 150px; padding-right: 2px; }
.cl-busca .input { font-size: .86rem; }
.cl-busca .input { border: 0; background: transparent; padding: 5px 2px; min-width: 0; width: 100%; flex: 1; font-weight: 600; box-shadow: none; }
.cl-busca .input:focus { outline: none; }
.cl-busca:focus-within { border-color: var(--accent); }
.cl-lupa { width: 26px; height: 26px; border: 0; background: transparent; flex: none; }
.cl-lupa svg { width: 15px; height: 15px; }
.cl-limpar { width: 26px; height: 26px; border: 0; background: transparent; color: var(--crit); flex: none; }
.cl-limpar svg { width: 16px; height: 16px; }
@media (max-width: 640px) { .cl-chip, .cl-busca { width: 100%; flex: 1 1 100%; box-sizing: border-box; } .cl-chip .select, .cl-chip.largo .select { width: auto; max-width: none; flex: 1; } }

/* Ícones de ação em cada cliente da lista e o mesmo desenho dos ícones do topo fora do cabeçalho (Marco, 20/10/2026) */
.btn-icone { color: var(--brand); text-decoration: none; }
.btn-icone svg { stroke-linecap: round; stroke-linejoin: round; }
.btn-icone:hover { border-color: var(--accent); background: var(--accent-soft); }
.btn-icone.perigo { color: var(--crit); }
.btn-icone.perigo:hover { border-color: var(--crit); background: var(--crit-soft); }
td.cl-acoes { white-space: nowrap; text-align: right; }
td.cl-acoes .btn-icone, td.cl-acoes form.inline { display: inline-grid; vertical-align: middle; }
td.cl-acoes { padding-left: 4px; padding-right: 4px; }
td.cl-acoes .btn-icone { width: 28px; height: 28px; border-radius: 8px; margin-left: 2px; }
td.cl-acoes .btn-icone svg { width: 15px; height: 15px; }
td.cl-acoes form.inline { margin: 0; }

/* Quadros de resumo de todas as páginas no desenho claro da lista de Clientes (Marco, 20/10/2026): Html::kpis e Html::faixa */
.pn-hero.resumo { margin-bottom: 18px; }
html:not([data-tema="escuro"]) .pn-hero.resumo .pn-item.ok .f { color: #079A78; }
html:not([data-tema="escuro"]) .pn-hero.resumo .pn-item.warn .f { color: #B76E00; }
html:not([data-tema="escuro"]) .pn-hero.resumo .pn-item.crit .f { color: #C2362B; }
html:not([data-tema="escuro"]) .pn-hero.resumo .pn-item.crit b { color: #C2362B; }
.pn-hero.resumo .pn-item.nc b { opacity: .55; }
.pn-hero.resumo a.pn-item.link { border-radius: 0; }
.pn-hero.resumo a.pn-item.link:hover b { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
/* Com 6 a 8 números, duas linhas de 3 ou 4 */
.pn-hero.resumo.n6 { grid-auto-flow: row; grid-template-columns: repeat(3, max-content); row-gap: 16px; }
.pn-hero.resumo.n7, .pn-hero.resumo.n8 { grid-auto-flow: row; grid-template-columns: repeat(4, max-content); row-gap: 16px; }
.pn-hero.resumo.n6 .pn-item:nth-child(3n+1), .pn-hero.resumo.n7 .pn-item:nth-child(4n+1), .pn-hero.resumo.n8 .pn-item:nth-child(4n+1) { padding-left: 0; border-left: 0; }
.panel .pn-hero.resumo, .tab-panel .pn-hero.resumo { box-shadow: none; }
/* Números sem rodapé ficam alinhados pelo topo com os demais */
.pn-hero.resumo { align-items: start; }
.pn-hero.resumo .pn-item .f:empty::before { content: "\00a0"; }

/* Nova Movimentação: escolha do produto (Marco, 20/10/2026) */
.nm-pergunta { margin: 0 0 14px; }
.nm-opcoes { display: grid; gap: 10px; margin-bottom: 6px; }
.nm-op { display: grid; grid-template-columns: 42px minmax(0, 1fr) 20px; align-items: center; gap: 14px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px;
  background: var(--surface); color: var(--ink); text-decoration: none; transition: border-color .15s, box-shadow .15s, transform .15s; }
.nm-op:hover, .nm-op:focus-visible { border-color: var(--accent); box-shadow: 0 6px 18px rgba(10, 40, 51, .08); transform: translateY(-1px); outline: none; }
.nm-ic { width: 42px; height: 42px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft, #E2F7F0); }
.nm-ic svg, .nm-seta { width: 22px; height: 22px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.nm-seta { width: 18px; height: 18px; stroke: var(--muted); }
.nm-txt { display: grid; gap: 2px; }
.nm-txt b { font-size: .98rem; }
.nm-txt small { font-size: .78rem; color: var(--ok, #079A78); }
.nm-op.off { cursor: not-allowed; background: var(--surface-2, #F4F6F7); opacity: .75; }
.nm-op.off:hover { border-color: var(--line); box-shadow: none; transform: none; }
.nm-op.off .nm-ic { background: transparent; border: 1px dashed var(--line); }
.nm-op.off .nm-ic svg { stroke: var(--muted); }
.nm-op.off .nm-txt small { color: var(--muted); }
.nm-op.off .nm-seta { visibility: hidden; }

/* Nova newsletter: lista "Clientes que vão receber" antes do Tipo (David, 20/10/2026) */
.nl-lista-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-bottom: 8px; }
.nl-lista-barra .cl-busca { flex: 1 1 180px; }
.nl-lista-barra .cl-busca .input { width: 100%; }
.nl-lista-total { margin: 0 0 6px; font-size: .82rem; color: var(--muted); }
.nl-lista-total b { color: var(--ink); }
.nl-clientes.nl-tabela { max-height: 340px; padding: 4px 0; gap: 0; }
.nl-tabela .rotulo-grupo { padding: 8px 12px 4px; margin-top: 0; position: sticky; top: -4px; background: var(--surface); z-index: 1; }
.nl-tabela label.nl-cli { display: grid; grid-template-columns: 18px minmax(0, 1fr) auto minmax(90px, auto); gap: 10px; align-items: center; padding: 7px 12px; border-top: 1px solid var(--line); }
.nl-tabela label.nl-cli[hidden] { display: none; }
.nl-tabela label.nl-cli:hover { background: color-mix(in srgb, var(--accent) 5%, transparent); }
.nl-tabela label.nl-cli:has(input:checked) { background: color-mix(in srgb, var(--accent) 9%, transparent); }
.nl-cli-nome { display: grid; min-width: 0; }
.nl-cli-nome b { font-weight: 600; font-size: .88rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nl-cli-nome small { font-size: .74rem; color: var(--muted); }
.nl-cli-prod { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; }
.nl-cli-mail { font-size: .74rem; color: var(--muted); text-align: right; white-space: nowrap; }
.nl-cli-mail em { color: var(--warn); font-style: normal; }
.nl-sem-resultado { padding: 10px 12px; margin: 0; }
@media (max-width: 760px) { .nl-tabela label.nl-cli { grid-template-columns: 18px minmax(0, 1fr); } .nl-cli-prod, .nl-cli-mail { grid-column: 2; justify-content: flex-start; text-align: left; } }
/* Na lista não vale o vermelho do "*" de campo obrigatório (.field label span) */
.field.nl-lista label span { color: var(--ink); }
.field.nl-lista label .badge { color: var(--muted); }
.field.nl-lista .emp-filter label span, .field.nl-lista .nl-cli-nome small, .field.nl-lista .nl-cli-mail { color: var(--muted); }
.field.nl-lista .nl-cli-mail em { color: var(--warn); }
.field.nl-lista .emp-filter.on label span { color: var(--accent); }

/* Painel de Movimentações: filtros em chip numa linha só (Marco, 20/10/2026) */
.mv-filtros .cl-chip.medio .select { width: 132px; }
.mv-filtros .cl-chip.largo .select { width: 132px; }

/* Pop-up "+ Nova Movimentação" do Painel de Movimentações: produto e cliente (Marco, 20/10/2026) */
.imp-pop .modal { width: min(640px, 100%); }
.imp-passos { display: flex; gap: 14px; margin: 0 0 14px; padding: 0; list-style: none; font-size: .8rem; color: var(--muted); }
.imp-passos li { display: flex; gap: 6px; align-items: center; }
.imp-passos b { width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; background: var(--line); color: var(--ink); font-size: .72rem; }
.imp-passos .on { color: var(--ink); font-weight: 600; }
.imp-passos .on b { background: var(--accent); color: #fff; }
.imp-produtos { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 14px; }
.imp-prod { display: grid; gap: 6px; justify-items: start; text-align: left; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); color: var(--ink); font: inherit; cursor: pointer; transition: border-color .15s, box-shadow .15s; }
.imp-prod:hover:not(:disabled), .imp-prod:focus-visible { border-color: var(--accent); outline: none; }
.imp-prod.sel { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); }
.imp-prod:disabled { cursor: not-allowed; opacity: .6; }
.imp-prod .nm-ic { width: 36px; height: 36px; }
.imp-prod b { font-size: .95rem; }
.imp-prod small { color: var(--muted); font-size: .76rem; }
.imp-busca { display: flex; flex: none; margin-bottom: 8px; }
.imp-busca .input { flex: 1; }
.imp-lista { border: 1px solid var(--line); border-radius: 12px; max-height: 280px; overflow: auto; }
.imp-cli { display: grid; grid-template-columns: minmax(0, 1fr) auto 18px; gap: 12px; align-items: center; padding: 9px 12px; border-top: 1px solid var(--line); cursor: pointer; }
.imp-cli:first-child { border-top: 0; }
.imp-cli > span { display: grid; min-width: 0; }
.imp-cli b { font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.imp-cli small { color: var(--muted); font-size: .76rem; }
.imp-cli:hover, .imp-cli:focus-visible { background: color-mix(in srgb, var(--accent) 6%, transparent); outline: none; }
.imp-cli.sel { background: color-mix(in srgb, var(--accent) 12%, transparent); }
.imp-cli.sel b { color: var(--accent); }
.imp-vazio { margin: 0; padding: 14px 12px; }
.imp-pop [data-imp-abrir][aria-disabled="true"] { opacity: .45; pointer-events: none; }
@media (max-width: 640px) { .imp-produtos { grid-template-columns: minmax(0, 1fr); } }

/* Movimentação do cliente, opção 3 (Marco, 20/10/2026): lista de beneficiários com ações, Formulários e Importar Planilha ao lado */
.mc-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; margin-bottom: 16px; }
.mc-grid > .panel, .mc-lado > .panel { margin: 0; }
.mc-lado { display: grid; gap: 16px; }
.mc-benef .panel-head, .mc-forms .panel-head { align-items: center; }
.mc-btn { display: inline-flex; gap: 8px; align-items: center; }
.mc-btn svg, .mc-modelos .btn svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.mc-busca { display: flex; flex: none; margin-bottom: 6px; }
.mc-busca .input { flex: 1; }
.mc-total { font-size: .8rem; margin: 0 0 4px; }
.mc-lista { max-height: 620px; overflow: auto; margin: 0 -4px; padding: 0 4px; }
.mc-pessoa { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px 4px; border-top: 1px solid var(--line); }
.mc-pessoa[hidden] { display: none; }
.mc-pessoa.dep { padding-left: 26px; position: relative; }
.mc-pessoa.dep::before { content: ""; position: absolute; left: 10px; top: 0; bottom: 50%; width: 10px; border-left: 1px solid var(--line); border-bottom: 1px solid var(--line); border-bottom-left-radius: 6px; }
.mc-pessoa:hover { background: color-mix(in srgb, var(--accent) 4%, transparent); }
.mc-nome { display: grid; min-width: 0; }
.mc-nome b { font-size: .9rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mc-nome small { color: var(--muted); font-size: .78rem; }
.mc-acoes { display: flex; gap: 6px; }
.mc-acoes .icon-btn { width: 30px; height: 30px; }
.mc-vazio { margin: 6px 0 0; }
.mc-n { min-width: 22px; height: 22px; padding: 0 7px; border-radius: 99px; background: var(--crit, #C2362B); color: #fff; font-size: .74rem; font-weight: 700; display: inline-grid; place-items: center; }
.mc-prop { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 11px 12px; border: 1px solid var(--line); border-radius: 12px; margin-top: 8px; color: var(--ink); text-decoration: none; }
.mc-prop:hover { border-color: var(--accent); }
.mc-prop > span:first-child { display: grid; min-width: 0; }
.mc-prop b { font-size: .86rem; }
.mc-prop small { color: var(--muted); font-size: .76rem; }
.mc-planilha .io-drop { padding: 16px; gap: 12px; }
.mc-planilha .io-drop b { font-size: .92rem; }
.mc-modelos { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }
.mc-ajuda { margin-top: 10px; font-size: .84rem; }
.mc-ajuda summary { cursor: pointer; color: var(--accent); font-weight: 600; }
.mc-ajuda .mv-colunas { flex-wrap: wrap; }
.mc-pop .modal { width: min(720px, 100%); }
@media (max-width: 1100px) { .mc-grid { grid-template-columns: minmax(0, 1fr); } }

/* Proposta "Na Folha", estilo DocuSign (Marco, 20/10/2026): a folha da operadora com os campos no lugar e tamanho do papel.
   Na folha, só a letra (Arial), sem fundo; o contorno mostra a situação do campo (legenda acima da folha). */
.pr-vista { display: inline-flex; gap: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; margin-bottom: 14px; background: var(--surface); }
.pr-vista-bt { display: inline-flex; align-items: center; gap: 6px; padding: 8px 16px; border: 0; background: transparent; font: inherit; font-weight: 600; color: var(--muted); cursor: pointer; }
.pr-vista-bt + .pr-vista-bt { border-left: 1px solid var(--line); }
.pr-vista-bt.on { background: #0A2833; color: #fff; }
.pr-vista-bt svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.fo { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 16px; align-items: start; margin-bottom: 16px; }
.fo-doc { min-width: 0; background: #56636B; border-radius: 16px; padding: 0 18px 22px; }
.fo-topo { position: sticky; top: 56px; z-index: 6; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 -18px 14px; padding: 10px 18px; background: var(--surface); border: 1px solid var(--line); border-radius: 16px 16px 0 0; box-shadow: 0 4px 14px rgba(10, 40, 51, .08); }
.fo-topo-dir { display: flex; align-items: center; gap: 10px; }
.fo-status { font-size: .84rem; font-weight: 600; }
.fo-prox svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: -3px; }
.fo-legenda { display: flex; flex-wrap: wrap; gap: 6px 16px; font-size: .78rem; color: var(--ink); }
.fo-leg { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.fo-sw { width: 18px; height: 11px; border-radius: 2px; display: inline-block; }
.fo-sw.falta { border: 2px solid #E0A800; }
.fo-sw.opc { border: 1.5px dashed #8FA0A8; }
.fo-sw.ok { width: auto; height: auto; font: 700 11px/1 Arial, Helvetica, sans-serif; color: #0D1F59; }
.fo-sw.atual { border: 2.5px solid #2F6FC0; }
.fo-sw.auto { border-bottom: 2px dotted #8FA0A8; border-radius: 0; height: 9px; }
.fo-folhas { display: grid; justify-items: center; gap: 6px; }
.fo-pag-rot { color: #DDE5E8 !important; font-size: .76rem; justify-self: start; margin-top: 6px; }
.fo-folha { position: relative; background: #fff; box-shadow: 0 6px 22px rgba(0, 0, 0, .35); }
.fo-canvas { display: block; }
.fo-c { position: absolute; box-sizing: border-box; padding: 0 1px; overflow: hidden; white-space: nowrap; font-family: Arial, Helvetica, sans-serif; color: #0D1F59; background: transparent; border-radius: 2px; cursor: pointer; outline-offset: 0; }
.fo-c.multi { white-space: normal; }
.fo-c.marca { text-align: center; font-weight: 700; }
.fo-c.falta { outline: 1.5px solid #E0A800; }
.fo-c.opc { outline: 1px dashed #A9B6BC; }
.fo-c.ok { box-shadow: none; } /* preenchido: só a letra */
.fo-c.auto { cursor: default; box-shadow: inset 0 -1px 0 rgba(143, 160, 168, .0); }
.fo-c.atual { outline: 2.5px solid #2F6FC0; z-index: 2; }
.fo-c:focus-visible { outline: 2.5px solid #2F6FC0; }
.fo-c:hover:not(.auto) { outline-width: 2px; }
.fo-pop { position: absolute; z-index: 8; background: var(--surface); border: 1px solid #BFD4EC; border-radius: 12px; box-shadow: 0 14px 34px rgba(0, 0, 0, .28); padding: 12px; display: grid; gap: 8px; font-family: inherit; }
.fo-pop .field { margin: 0; }
.fo-pop .help { display: none; }
.fo-pop-rot { font-size: .78rem; font-weight: 700; }
.fo-pop-acoes { display: flex; justify-content: space-between; gap: 6px; }
.fo-outros { display: flex; flex-wrap: wrap; gap: 6px; }
.fo-outros .chip { font-size: .74rem; }
.fo-lado { position: sticky; top: 64px; max-height: calc(100vh - 84px); overflow: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.fo-lado-in { padding: 14px; display: grid; gap: 10px; }
.fo-lado h3 { margin: 0; font-size: 1rem; }
.fo-lado h4 { margin: 4px 0 0; font-size: .86rem; }
.fo-grupos { display: grid; gap: 4px; }
.fo-g { display: grid; grid-template-columns: 22px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 8px; border: 0; border-radius: 10px; background: transparent; font: inherit; text-align: left; cursor: pointer; color: var(--ink); }
.fo-g:hover { background: var(--accent-soft); }
.fo-g .fo-ck { width: 20px; height: 20px; border-radius: 50%; border: 2px solid #E0A800; display: grid; place-items: center; font-size: .7rem; }
.fo-g.ok .fo-ck { border-color: var(--accent); background: var(--accent); color: #fff; }
.fo-g b { color: #9A5B00; font-size: .8rem; }
.fo-g-nome { font-size: .86rem; }
.fo-fora { display: grid; gap: 8px; padding-top: 8px; border-top: 1px solid var(--line); }
.fo-fora .field { margin: 0; }
.fo-deps { display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid var(--line); }
.fo-dep { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: .84rem; }
.fo-dep .icon-btn { width: 28px; height: 28px; }
.fo-deps .btn svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; vertical-align: -3px; }
@media (max-width: 1240px) { .fo { grid-template-columns: minmax(0, 1fr); } .fo-lado { position: static; max-height: none; } }
.fo-c.livre { outline: none; }
.fo-c.livre:hover { outline: 1px dashed #A9B6BC; }

/* Operações › Inclusões, Exclusões, Alterações e Avisos de Sinistros (Marco, 21/10/2026): uma aba por produto */
.op-abas { margin: 0 0 14px; width: max-content; max-width: 100%; }
.op-abas a { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 9px; font-weight: 600; font-size: .9rem; color: var(--muted); text-decoration: none; }
.op-abas a:hover { color: var(--ink); }
.op-abas a[aria-selected="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 3px rgba(10, 40, 51, .12); }
.op-aba-n { min-width: 22px; height: 20px; padding: 0 7px; border-radius: 99px; background: var(--line); color: var(--ink); font-size: .74rem; display: inline-grid; place-items: center; }
.op-abas a[aria-selected="true"] .op-aba-n { background: var(--accent); color: #fff; }
.sv-graficos > summary { cursor: pointer; font-weight: 700; }
.sv-graficos[open] > summary { margin-bottom: 12px; }
/* Pop-up de Inclusões e Exclusões: primeiro "Inclusão ou Exclusão?" (Marco, 21/10/2026) */
.imp-pergunta { margin: 0 0 8px; font-weight: 700; font-size: .9rem; }
.imp-acoes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.imp-acoes.falta .imp-prod { border-color: var(--crit); animation: imp-falta .35s; }
@keyframes imp-falta { 25% { transform: translateX(-4px); } 75% { transform: translateX(4px); } }
@media (prefers-reduced-motion: reduce) { .imp-acoes.falta .imp-prod { animation: none; } }
/* Produtos › Odonto: Renovações em 60 dias ao lado de Procedimentos Utilizados ocupa a altura do quadro (Marco, 21/10/2026) */
.pf-graficos #g-renovacoes.g-c8 .chart:not(.anel) { max-height: none; }
/* Simulador de Reajuste: Contrato no desenho dos filtros das outras páginas (Marco, 21/10/2026) */
.sim-topo.cl-filtros { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0; }
.sim-topo .sim-contrato { flex: 0 1 560px; min-width: min(100%, 360px); }
.sim-topo .sim-contrato .select { width: 100%; }
/* Pop-up "+ Novo Reajuste" com os dados do reajuste dentro (Marco, 21/10/2026) */
.rj-pop .modal { width: min(760px, 100%); }
.rj-form { margin-top: 4px; }
.rj-resumo { margin: 0 0 4px; padding: 10px 12px; border-radius: 10px; background: var(--accent-soft); font-weight: 600; font-size: .88rem; }
/* Títulos do menu sem cortar com "…" (ex.: "Renovações e Indicadores"): quebram em duas linhas quando não cabem (21/10/2026) */
.nav-topic .nav-tt { white-space: normal; text-overflow: clip; line-height: 1.25; }
/* Ficha do Reajuste · Opção 3 (Marco, 21/10/2026): aviso do Aplicar no Contrato e três cartões */
.rj-banner { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 18px; border-radius: 14px; background: #EEF5FF; border: 1px solid #CFE0F7; margin-bottom: 16px; color: #1F4E7A; font-weight: 600; }
.rj-banner small { display: block; font-weight: 500; color: #4A6B8A; margin-top: 2px; }
.rj-banner.pronto { background: #FFF6E5; border-color: #F3DDAE; color: #8A5300; } .rj-banner.pronto small { color: #8A6A3A; }
.rj-banner.ok { background: #E9FBF5; border-color: #BFEBDC; color: #076B55; } .rj-banner.ok small { color: #3D6F63; }
.rj-banner form { margin: 0; }
.rj-cartoes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; margin: 16px 0; }
.rj-cartao h3 { margin: 0 0 12px; font-size: 1rem; display: flex; align-items: center; gap: 8px; }
.rj-cartao h3 svg { width: 20px; height: 20px; stroke: var(--accent); fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rj-cartao h3 .lnk { margin-left: auto; font-size: .82rem; }
.rj-linha { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); font-size: .9rem; }
.rj-linha:last-child { border-bottom: 0; } .rj-linha span { color: var(--muted); } .rj-linha b { text-align: right; }
.rj-valores { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; padding: 4px 0 12px; }
.rj-valores div > span { display: block; font-size: .78rem; color: var(--muted); }
.rj-valores { column-gap: 12px; }
.rj-valores b { font-family: "Bricolage Grotesque", inherit; font-size: clamp(1.15rem, 1.6vw, 1.45rem); white-space: nowrap; }
.rj-valores .depois b { color: var(--accent); }
.rj-seta { font-size: 1.4rem; color: var(--accent); }
.rj-mais { display: inline-block; padding: 4px 12px; border-radius: 99px; background: #FFF4E0; color: #9A5B00; font-weight: 700; font-size: .82rem; margin-bottom: 8px; }
.rj-obs { background: var(--surface-2); border-radius: 10px; padding: 12px; font-size: .9rem; min-height: 84px; }
@media (max-width: 1100px) { .rj-cartoes { grid-template-columns: minmax(0, 1fr); } }
/* Indicadores Mensais (Marco, 21/10/2026): etiqueta "Automático" e a coluna Origem */
.ind-auto { display: inline-block; margin-left: 4px; padding: 1px 7px; border-radius: 99px; background: var(--accent-soft); color: var(--accent); font-size: .68rem; font-weight: 700; vertical-align: 1px; }
.ind-form .field.auto .input { border-color: color-mix(in srgb, var(--accent) 45%, var(--line)); background: color-mix(in srgb, var(--accent) 5%, var(--surface)); }
.ind-legenda { margin: 0; align-self: end; font-size: .78rem; color: var(--muted); }
.ind-origem { display: inline-block; padding: 2px 9px; border-radius: 99px; font-size: .76rem; font-weight: 600; white-space: nowrap; }
.ind-origem.aut { background: var(--accent-soft); color: var(--accent); } .ind-origem.man { background: var(--surface-2); color: var(--muted); } .ind-origem.mix { background: #EEF5FF; color: #2B6F9E; }
.field label .ind-auto { color: var(--accent); }

/* Conferência da Planilha (Marco, 21/10/2026): chips do que foi conferido, Card de Resumo com a conta (− + =),
   Entram e Saem lado a lado e a barra de aceite embaixo */
.cf-chips { display: flex; flex-wrap: wrap; gap: 8px; margin: -6px 0 16px; }
.cf-chip { display: inline-flex; align-items: center; gap: 6px; padding: 5px 12px; border-radius: 99px; background: var(--surface); border: 1px solid var(--line); font-size: .82rem; font-weight: 600; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cf-chip small { color: var(--muted); font-weight: 500; font-size: .78rem; }
.cf-conta { margin-bottom: 16px; }
.cf-conta .pn-item.cf-op { position: relative; }
.cf-conta .pn-item.cf-op::before { content: attr(data-op); position: absolute; left: -13px; top: 50%; transform: translateY(-50%); width: 26px; height: 26px; border-radius: 50%;
  display: grid; place-items: center; background: var(--surface); border: 1px solid var(--line); color: var(--muted); font-weight: 700; font-size: 1rem; line-height: 1; box-shadow: 0 1px 3px rgba(10, 40, 51, .08); }
html:not([data-tema="escuro"]) .cf-conta .pn-item.crit b { color: #C0392B; }
html:not([data-tema="escuro"]) .cf-conta .pn-item.ok b { color: #079A78; }
html:not([data-tema="escuro"]) .cf-conta .pn-item.crit .f { color: #C0392B; }
html:not([data-tema="escuro"]) .cf-conta .pn-item.ok .f { color: #076B55; font-weight: 600; }
html:not([data-tema="escuro"]) .cf-conta .pn-item.warn .f { color: #A86400; font-weight: 600; }
.cf-filtros { margin-bottom: 10px; }
.cf-listas { margin-bottom: 8px; }
.cf-listas .panel-head { margin-bottom: 8px; }
.cf-ent { border-top: 4px solid var(--ok); }
.cf-sai { border-top: 4px solid var(--crit); }
.cf-n { margin-left: auto; font-weight: 700; color: var(--muted); font-variant-numeric: tabular-nums; }
.cf-nada { margin: 6px 0 0; }
.cf-listas .tablewrap[hidden] { display: none; }
.cf-nota { margin: 0 4px 0; color: var(--muted); font-size: .82rem; }
.cf-barra { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 20px; margin-top: 16px; background: var(--surface);
  border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 -6px 22px rgba(10, 40, 51, .08); }
.cf-barra-txt { font-size: .9rem; }
.cf-barra-bts { display: flex; gap: 8px; flex: none; }
.cf-alerta { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-radius: 12px; background: var(--warn-soft, #FFF6E5); border: 1px solid #F3DDAE;
  color: #8A5300; font-size: .88rem; cursor: pointer; }
.cf-alerta input { width: 18px; height: 18px; flex: none; margin: 0; }
[data-tema="escuro"] .cf-alerta { color: var(--ink); border-color: transparent; }
.cf-explica { margin: 8px 4px 0; color: var(--muted); font-size: .8rem; }
form[data-mv-aceite] .mv-consequencia { margin: 16px 0 0; }
@media (max-width: 760px) {
  .cf-conta .pn-item.cf-op::before { display: none; }
  .cf-barra { flex-direction: column; align-items: stretch; }
  .cf-barra-bts { justify-content: flex-end; }
}

/* Mapa de Clientes (Marco, 21/10/2026): cabeçalho do mapa no desenho dos gráficos, gráficos embaixo e o pop-up do PDF */
.mapa-painel .g-cab { margin: 0; }
.mapa-painel .g-cab h2 { margin: 2px 0 0; }
.mapa-painel .acoes-mapa { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.lista-estados .panel-head { align-items: center; }
.mapa-graficos { margin-top: 0; margin-bottom: 16px; }
.mapa-pend { margin-top: 0; }
.mapa-pdf-ops { display: grid; gap: 10px; }
.mapa-pdf-op { display: grid; gap: 2px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 12px; color: inherit; text-decoration: none; background: var(--surface); }
.mapa-pdf-op:hover { border-color: var(--accent); background: var(--accent-soft); }
.mapa-pdf-op small { color: var(--muted); font-size: .82rem; }
/* Mapa de Clientes: pizzas alinhadas no topo do quadro e o ícone de PDF na ponta da linha dos filtros (Marco, 21/10/2026) */
.mapa-graficos .g-bloco > .anel-wrap { flex: 0 0 auto; justify-content: flex-start; }
.mapa-acoes { margin-left: auto; display: flex; align-items: center; gap: 8px; }
.mapa-graficos .g-sub { min-height: 30px; }
/* Radar de Renovação (Marco, 21/10/2026): títulos das colunas em duas linhas para a tabela caber com os ícones */
.radar-tab th { white-space: normal; line-height: 1.25; vertical-align: bottom; }
.radar-tab td.acao-radar { min-width: 170px; }
.radar-tab td:first-child { min-width: 150px; }
/* Sinistralidade no padrão do Radar (Marco, 21/10/2026): barra com a linha da meta e o percentual ao lado */
.sin-barra { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.sin-barra .hbar-t { flex: 1; height: 10px; }
.sin-graficos { margin-top: 4px; }
.sin-obs { margin: 4px 0 0; }
.sin-graficos .g-c8 .chart.gp:not(.anel) { max-height: none; }

/* Relatórios › montar o PDF (Marco, 21/10/2026): blocos à esquerda, "Seu Relatório" com a ordem à direita */
.rm-grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 16px; align-items: start; }
.rm-blocos { display: grid; gap: 12px; }
.rm-modelos { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.rm-modelos-t { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: 4px; }
.rm-modelo { display: inline-grid; gap: 1px; text-align: left; padding: 8px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); color: var(--ink); font: inherit; font-weight: 600; font-size: .86rem; cursor: pointer; }
.rm-modelo small { font-weight: 500; font-size: .74rem; color: var(--muted); }
.rm-modelo:hover { border-color: var(--accent); }
.rm-modelo.sel { border-color: var(--accent); background: var(--accent-soft); box-shadow: inset 0 0 0 1px var(--accent); }
.rm-grupo { display: flex; align-items: center; gap: 8px; margin: 6px 0 0; font-size: .98rem; }
.rm-grupo svg { width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.rm-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 10px; }
.rm-card { position: relative; display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: start; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface); cursor: pointer; transition: border-color .15s, background .15s; }
.rm-card:hover { border-color: var(--accent); }
.rm-card input { position: absolute; opacity: 0; pointer-events: none; }
.rm-check { width: 20px; height: 20px; border-radius: 6px; border: 1.5px solid var(--line); display: grid; place-items: center; margin-top: 1px; background: var(--surface); }
.rm-check svg { width: 14px; height: 14px; fill: none; stroke: #fff; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; opacity: 0; }
.rm-card.sel { border-color: var(--accent); background: var(--accent-soft); }
.rm-card.sel .rm-check { background: var(--accent); border-color: var(--accent); }
.rm-card.sel .rm-check svg { opacity: 1; }
.rm-card input:focus-visible + .rm-check { outline: 2px solid var(--accent); outline-offset: 2px; }
.rm-txt { display: grid; gap: 2px; min-width: 0; }
.rm-txt b { font-size: .9rem; }
.rm-txt small { font-size: .78rem; color: var(--muted); line-height: 1.35; }
.rm-ordem { position: sticky; top: 16px; display: grid; gap: 10px; }
.rm-capa, .rm-lista li { display: grid; grid-template-columns: 30px minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 10px; }
.rm-capa { background: linear-gradient(120deg, #079A78, #0FC79C); color: #fff; grid-template-columns: 30px minmax(0, 1fr); }
.rm-capa span { font-weight: 700; opacity: .85; }
.rm-capa small { grid-column: 2; font-size: .74rem; opacity: .9; margin-top: -6px; }
.rm-lista { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; max-height: calc(100vh - 360px); overflow: auto; }
.rm-lista li { border: 1px solid var(--line); background: var(--surface); }
.rm-n { font-weight: 700; color: var(--accent); font-variant-numeric: tabular-nums; }
.rm-lista b { font-size: .86rem; font-weight: 600; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rm-li-acoes { display: flex; gap: 2px; }
.rm-li-acoes .btn-icone { width: 26px; height: 26px; border-radius: 7px; }
.rm-li-acoes .btn-icone svg { width: 14px; height: 14px; }
.rm-li-acoes .btn-icone:disabled { opacity: .35; cursor: default; }
.rm-vazio { font-size: .84rem; margin: 2px 0; }
.rm-acoes { display: flex; justify-content: space-between; gap: 8px; padding-top: 10px; border-top: 1px solid var(--line); }
.rm-acoes .btn.primary svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -3px; margin-right: 6px; }
.rm-datas .input { width: 150px; }
@media (max-width: 1100px) { .rm-grid { grid-template-columns: minmax(0, 1fr); } .rm-ordem { position: static; } }

/* Agenda (Marco, 21/10/2026): abas Calendário e Lista; a Lista no estilo do Microsoft To Do */
.op-abas a svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cal-topo { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.cal-topo h2 { margin: 0 4px; min-width: 190px; text-align: center; }
.cal-leg { margin-left: auto; display: inline-flex; align-items: center; gap: 6px; font-size: .78rem; color: var(--muted); }
.cal-leg i { width: 10px; height: 10px; border-radius: 3px; display: inline-block; margin-left: 8px; }
.cal-leg i.ag { background: var(--info); } .cal-leg i.ok { background: var(--ok); } .cal-leg i.canc { background: var(--exc, var(--line)); }
.td-novo { display: flex; align-items: center; gap: 10px; padding: 8px 10px 8px 14px; border-radius: 12px; background: var(--surface-2); border: 1px solid var(--line); margin-bottom: 14px; }
.td-novo:focus-within { border-color: var(--accent); background: var(--surface); }
.td-mais svg { width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 2.4; stroke-linecap: round; display: block; }
.td-novo .input { flex: 1; border: 0; background: transparent; box-shadow: none; padding-left: 0; font-weight: 500; }
.td-novo .input:focus { outline: none; box-shadow: none; }
.td-grupo { margin-bottom: 10px; }
.td-grupo > summary { list-style: none; display: flex; align-items: center; gap: 8px; cursor: pointer; padding: 8px 4px; font-weight: 700; font-size: .95rem; user-select: none; }
.td-grupo > summary::-webkit-details-marker { display: none; }
.td-grupo > summary small { font-weight: 500; color: var(--muted); font-size: .78rem; margin-left: 4px; }
.td-seta svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; display: block; transition: transform .15s; }
.td-grupo[open] > summary .td-seta svg { transform: rotate(90deg); }
.td-n { font-size: .78rem; font-weight: 700; color: var(--muted); background: var(--surface-2); border-radius: 99px; padding: 1px 8px; }
.td-grupo.hoje > summary { color: var(--accent); }
.td-grupo.atrasados > summary { color: var(--crit); }
.td-lista { display: grid; gap: 6px; }
.td-item { display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 10px 12px; border-radius: 10px; background: var(--surface); border: 1px solid var(--line); box-shadow: 0 1px 2px rgba(10, 40, 51, .04); transition: background .12s, border-color .12s; }
.td-item:hover { background: var(--surface-2); border-color: #CFE3E1; }
.td-check { width: 22px; height: 22px; border-radius: 50%; border: 2px solid var(--muted); background: transparent; display: grid; place-items: center; cursor: pointer; padding: 0; color: transparent; }
.td-check svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.td-check:hover { border-color: var(--accent); color: var(--accent); }
.td-check.feito { background: var(--accent); border-color: var(--accent); color: #fff; }
.td-check.canc { border-color: var(--line); color: var(--muted); cursor: default; }
.td-corpo { display: grid; gap: 4px; min-width: 0; color: inherit; text-decoration: none; }
.td-corpo b { font-weight: 600; font-size: .92rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.td-corpo:hover b { color: var(--accent); }
.td-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; }
.td-m { display: inline-flex; align-items: center; gap: 5px; font-size: .78rem; color: var(--muted); }
.td-m svg { width: 13px; height: 13px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.td-m.hoje { color: var(--accent); font-weight: 600; } .td-m.atrasado { color: var(--crit); font-weight: 600; }
.td-acoes { display: flex; align-items: center; gap: 2px; opacity: .35; transition: opacity .12s; }
.td-item:hover .td-acoes, .td-acoes:focus-within { opacity: 1; }
.td-acoes .btn-icone, .td-acoes form.inline { display: inline-grid; }
.td-acoes .btn-icone { width: 28px; height: 28px; border-radius: 8px; }
.td-acoes .btn-icone svg { width: 15px; height: 15px; }
.td-item.feito .td-corpo b { text-decoration: line-through; color: var(--muted); }
.td-item.cancelado { opacity: .6; }
.td-item.cancelado .td-corpo b { text-decoration: line-through; }
@media (max-width: 700px) { .td-acoes { opacity: 1; } .cal-leg { margin-left: 0; } }
.ag-pop .ag-excluir { margin-right: auto; color: var(--crit); }

/* Relatórios · Editor com Pré-Visualização (Marco, 22/10/2026, opção 3): blocos, páginas do PDF e capa em três colunas */
.re-filtros .cl-chip { flex: 1 1 180px; }
.re-filtros .cl-chip.largo { flex: 2 1 260px; }
.re-filtros .cl-chip .select, .re-filtros .cl-chip.largo .select, .re-filtros .cl-chip.medio .select { flex: 1; width: auto; min-width: 0; }
.re-grid { display: grid; grid-template-columns: 260px minmax(0, 1fr) 290px; gap: 16px; align-items: start; margin-top: 16px; }
.re-h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1rem; }
.re-h2 svg { width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.page-head .re-gerar svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.page-head .btn:disabled { opacity: .5; cursor: default; }
/* Coluna 1: blocos disponíveis */
.re-lib { gap: 10px; }
.re-busca-lib { margin: 0; }
.re-busca-lib .cl-busca { flex: 1 1 100%; }
.re-grupo { display: grid; gap: 6px; }
.re-grupo h3 { margin: 6px 0 0; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.re-item { display: grid; grid-template-columns: 30px minmax(0, 1fr) 26px; align-items: center; gap: 10px; width: 100%; padding: 8px 9px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.re-item:hover { border-color: var(--accent); }
.re-item:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.re-ic { width: 30px; height: 30px; border-radius: 8px; background: var(--accent-soft); display: grid; place-items: center; }
.re-ic svg { width: 16px; height: 16px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.re-item-t { display: grid; gap: 1px; min-width: 0; }
.re-item-t b { font-size: .84rem; font-weight: 600; }
.re-item-t small { font-size: .72rem; color: var(--muted); line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.re-add { width: 26px; height: 26px; border-radius: 7px; border: 1px solid var(--line); display: grid; place-items: center; }
.re-add svg { width: 14px; height: 14px; fill: none; stroke: var(--accent); stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.re-add .ok { display: none; }
.re-item.sel { background: var(--accent-soft); border-color: var(--accent); }
.re-item.sel .re-add { background: var(--accent); border-color: var(--accent); }
.re-item.sel .re-add .mais { display: none; }
.re-item.sel .re-add .ok { display: block; stroke: #fff; }
.re-nada { font-size: .84rem; margin: 0; }
/* Coluna 2: pré-visualização das páginas */
.re-previa-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.re-folhas { background: var(--surface-2); border-radius: 12px; padding: 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; min-height: 240px; align-content: start; }
.re-folha { position: relative; background: #fff; color: #0A2833; border-radius: 6px; aspect-ratio: 1 / 1.414; box-shadow: 0 2px 10px rgba(10, 40, 51, .14);
  display: flex; flex-direction: column; overflow: hidden; cursor: grab; transition: transform .12s, box-shadow .12s; }
.re-folha:hover, .re-folha:focus-visible { box-shadow: 0 0 0 2px var(--accent), 0 6px 18px rgba(10, 40, 51, .18); outline: none; }
.re-folha.arrastando { opacity: .45; }
.re-folha.alvo { transform: translateX(6px); box-shadow: -4px 0 0 0 var(--accent), 0 6px 18px rgba(10, 40, 51, .18); }
.re-f-faixa { height: 8px; background: linear-gradient(90deg, #079A78, #08D7A5); flex: none; }
.re-f-cab { display: flex; align-items: baseline; gap: 6px; padding: 10px 10px 6px; }
.re-f-cab b { font-family: var(--f-display); font-size: .78rem; font-weight: 600; line-height: 1.2; }
.re-f-n { font-size: .66rem; font-weight: 700; color: #079A78; font-variant-numeric: tabular-nums; }
.re-f-rod { margin-top: auto; padding: 5px 10px; border-top: 1px solid #DFE8E9; font-size: .6rem; color: #5A6E75; }
.re-f-acoes { position: absolute; top: 6px; right: 6px; display: flex; gap: 2px; opacity: 0; transition: opacity .12s; }
.re-folha:hover .re-f-acoes, .re-folha:focus-within .re-f-acoes { opacity: 1; }
.re-f-bt { width: 24px; height: 24px; border-radius: 6px; background: #fff; border: 1px solid #DFE8E9; }
.re-f-bt svg { width: 13px; height: 13px; fill: none; stroke: #0A2833; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.re-f-bt:disabled { opacity: .35; }
.re-des { flex: 1; margin: 4px 10px 8px; border-radius: 6px; background: #F1F6F6; padding: 10px; display: flex; gap: 5px; min-height: 0; }
.re-des > i { display: block; border-radius: 4px; background: #CFDDDF; }
.re-des-lista, .re-des-tabela { flex-direction: column; justify-content: flex-start; }
.re-des-lista > i, .re-des-tabela > i { height: 6px; }
.re-des-lista > i:first-child, .re-des-tabela > i:first-child { width: 45%; height: 7px; background: #079A78; }
.re-des-lista > i:nth-child(2n) { width: 85%; } .re-des-lista > i:nth-child(2n+3) { width: 70%; }
.re-des-tabela > i:nth-child(2n) { background: #E3ECED; }
.re-des-barras { align-items: flex-end; justify-content: center; }
.re-des-barras > i { width: 9%; border-radius: 3px 3px 0 0; background: linear-gradient(180deg, #08D7A5, #079A78); }
.re-des-barras > i.s { background: linear-gradient(180deg, #5B8FD6, #2F62A8); }
.re-des-kpi { display: grid; grid-template-columns: 1fr 1fr; grid-auto-rows: 34px; }
.re-des-kpi > i { background: #DDF7EF; height: auto; }
.re-des-anel { flex-direction: column; align-items: center; justify-content: center; gap: 8px; }
.re-des-anel .anel { width: 54px; height: 54px; border-radius: 50%; background: conic-gradient(#079A78 0 62%, #2F62A8 62% 84%, #0A2833 84% 100%); position: relative; }
.re-des-anel .anel::after { content: ""; position: absolute; inset: 12px; background: #F1F6F6; border-radius: 50%; }
.re-des-anel .linhas { display: grid; gap: 4px; width: 80%; }
.re-des-anel .linhas i { display: block; height: 5px; border-radius: 3px; background: #CFDDDF; }
.re-des-curva { padding: 6px 0 0; overflow: hidden; }
.re-des-curva svg { width: 100%; height: 100%; }
.re-des-curva .area { fill: rgba(8, 215, 165, .25); } .re-des-curva .linha { fill: none; stroke: #079A78; stroke-width: 2; }
/* Capa na pré-visualização: as mesmas cores do PDF */
.re-capa { cursor: default; color: #fff; }
.re-capa .re-capa-topo, .re-capa .re-capa-tit, .re-capa .re-capa-nome, .re-capa .re-capa-per { position: relative; z-index: 1; }
.re-capa::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 46%; background: var(--re-capa); }
.re-cor-zoe { --re-capa: linear-gradient(170deg, #0A2833, #079A78); }
.re-cor-verde { --re-capa: linear-gradient(170deg, #079A78, #0FC79C); }
.re-cor-azul { --re-capa: linear-gradient(170deg, #173C66, #2F62A8); }
.re-cor-dourado { --re-capa: linear-gradient(170deg, #5A3D0E, #A8670F); }
.re-capa-topo { display: flex; justify-content: space-between; align-items: flex-start; padding: 10px 10px 0; min-height: 30px; }
.re-capa-marca { font-family: var(--f-display); font-weight: 700; font-size: .78rem; letter-spacing: .06em; }
.re-capa-logo { background: #fff; border-radius: 3px; width: 54px; height: 28px; display: grid; place-items: center; padding: 3px; }
.re-capa-logo img { max-width: 100%; max-height: 100%; object-fit: contain; }
.re-capa-tit { padding: 8px 10px 0; font-size: .52rem; letter-spacing: .05em; opacity: .85; }
.re-capa-nome { padding: 2px 10px 0; font-family: var(--f-display); font-size: .86rem; line-height: 1.15; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.re-capa-per { padding: 3px 10px 0; font-size: .54rem; opacity: .85; }
.re-capa-sum { margin-top: 18px; padding: 0 10px; display: grid; gap: 3px; color: #0A2833; font-size: .56rem; }
.re-capa-sum b { font-size: .64rem; margin-bottom: 2px; }
.re-capa-sum span { display: flex; gap: 5px; border-bottom: 1px dotted #CFDDDF; padding-bottom: 2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.re-capa-sum em { font-style: normal; font-weight: 700; color: #079A78; }
.re-capa-sum .vazio { color: #5A6E75; border: 0; }
.re-dica { font-size: .8rem; margin: 0; }
/* Coluna 3: capa e modelos do usuário */
.re-cfg { gap: 14px; position: sticky; top: 16px; }
.re-campo { display: grid; gap: 6px; }
.re-campo > label, .re-rot { font-size: .76rem; font-weight: 600; color: var(--muted); }
.re-campo small { font-size: .74rem; line-height: 1.35; }
.re-cores { display: flex; gap: 8px; }
.re-cor { width: 30px; height: 30px; border-radius: 8px; background: var(--re-capa); cursor: pointer; position: relative; }
.re-cor input { position: absolute; opacity: 0; inset: 0; cursor: pointer; }
.re-cor:has(input:checked) { outline: 2px solid var(--ink); outline-offset: 2px; }
.re-cor:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.re-tog { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: .86rem; font-weight: 500; color: var(--ink); cursor: pointer; }
.re-tog input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.re-tog i { width: 36px; height: 20px; border-radius: 99px; background: #CFDDDF; position: relative; flex: none; transition: background .15s; }
.re-tog i::after { content: ""; position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #fff; top: 2px; left: 2px; transition: left .15s; }
.re-tog input:checked + i { background: var(--accent); }
.re-tog input:checked + i::after { left: 18px; }
.re-tog input:focus-visible + i { outline: 2px solid var(--accent); outline-offset: 2px; }
.re-tog.off { opacity: .55; cursor: default; }
.re-meus { display: grid; gap: 6px; border-top: 1px solid var(--line); padding-top: 12px; }
.re-meus h3 { margin: 0 0 2px; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.re-meu { display: flex; align-items: center; gap: 6px; }
.re-meu-usar { flex: 1; min-width: 0; display: grid; gap: 1px; text-align: left; padding: 7px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--surface); color: var(--ink); font: inherit; cursor: pointer; }
.re-meu-usar:hover { border-color: var(--accent); }
.re-meu-usar b { font-size: .84rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.re-meu-usar small { font-size: .72rem; color: var(--muted); }
.re-meu form { margin: 0; }
.re-nota { font-size: .76rem; color: var(--muted); background: var(--surface-2); border-radius: 9px; padding: 9px 11px; margin: 0; line-height: 1.4; }
.re-salvar-modal { max-width: 480px; }
.re-salvar-resumo { font-size: .82rem; margin: 0; }
/* Logotipo do cliente no Editar Cadastro (Marco, 22/10/2026) */
.cad-logo-linha { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.cad-logo-amostra { width: 96px; height: 48px; border: 1px dashed var(--line); border-radius: 8px; display: grid; place-items: center; background: #fff; padding: 4px; flex: none; }
.cad-logo-amostra img { max-width: 100%; max-height: 100%; object-fit: contain; }
.cad-logo-amostra small { font-size: .72rem; color: var(--muted); }
.cad-logo-linha .input[type=file] { flex: 1; min-width: 200px; }
.cad-logo-remover { display: inline-flex; align-items: center; gap: 6px; font-size: .84rem; font-weight: 500; }
@media (max-width: 1280px) { .re-grid { grid-template-columns: 240px minmax(0, 1fr); } .re-cfg { grid-column: 1 / -1; position: static; } }
@media (max-width: 860px) { .re-grid { grid-template-columns: minmax(0, 1fr); } }
[data-tema="escuro"] .re-folhas { background: #0E242C; }
[data-tema="escuro"] .re-folha { box-shadow: 0 2px 10px rgba(0, 0, 0, .4); }
.re-filtros.cl-filtros { margin: 0; }
.re-previa-cab .g-destaque { margin-left: auto; }
.re-capa > .re-capa-topo, .re-capa > .re-capa-tit, .re-capa > .re-capa-nome, .re-capa > .re-capa-per, .re-capa > .re-f-rod { flex: none; }
.re-capa > .re-capa-sum { flex: 1 1 auto; min-height: 0; overflow: hidden; align-content: start; }
.re-capa > .re-capa-sum { display: flex; flex-direction: column; }
.re-capa-sum > * { flex: none; }
.re-capa-sum .mais { color: #079A78; font-weight: 600; border: 0; }
.re-f-acoes { top: auto; bottom: 3px; }
/* Relatórios · Ajustes do Bloco (Marco, 22/10/2026, parte 2) */
.re-folha.sel { box-shadow: 0 0 0 3px var(--accent), 0 6px 18px rgba(10, 40, 51, .18); }
.re-f-selos { display: flex; flex-wrap: wrap; gap: 3px; padding: 0 10px 6px; }
.re-selo { font-size: .56rem; font-weight: 600; color: #079A78; background: #DDF7EF; border-radius: 99px; padding: 1px 6px; white-space: nowrap; }
.re-selo.com { color: #fff; background: #079A78; }
.re-ajustes { display: grid; gap: 12px; }
.re-aj-corpo { display: grid; gap: 12px; }
.re-aj-corpo[hidden] { display: none; }
.re-aj-partes { display: grid; gap: 8px; }
.re-aj-partes .re-tog { font-size: .84rem; align-items: flex-start; }
.re-aj-partes .re-tog span { line-height: 1.3; }
.re-aj-comentario { min-height: 84px; resize: vertical; font: inherit; font-size: .86rem; line-height: 1.4; }
.re-aj-conta { text-align: right; }
.re-aj-vazio { font-size: .8rem; margin: 0; background: var(--surface-2); border-radius: 9px; padding: 9px 11px; line-height: 1.4; }
.re-sep { border: 0; border-top: 1px solid var(--line); margin: 2px 0; width: 100%; }
.re-meu-usar b { white-space: normal; overflow: visible; line-height: 1.3; }
/* Comunicação · Editor em Três Colunas (Marco, 22/10/2026, opção 3): Modelos, Mensagem e Para Quem */
.cm-abas { margin-top: 16px; }
.cm-grid { display: grid; grid-template-columns: 250px minmax(0, 1fr) 330px; gap: 16px; align-items: start; }
.cm-form { display: contents; }
.cm-grid > .panel, .cm-form > .panel { margin: 0; display: flex; flex-direction: column; gap: 12px; min-width: 0; }
.cm-h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1rem; }
.cm-h2 svg, .page-head .cm-enviar svg, .cm-acoes .btn-icone svg, .page-head .btn-icone svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cm-h2 svg { width: 18px; height: 18px; stroke: var(--accent); }
.page-head .cm-enviar { display: inline-flex; align-items: center; gap: 8px; }
/* Cores dos tipos (lista e modelos) */
.t-boas { --cm-cor: #079A78; } .t-aviso { --cm-cor: #A8670F; } .t-reaj { --cm-cor: #2F62A8; } .t-data { --cm-cor: #B7372B; } .t-outros { --cm-cor: #5A6E75; }
/* Coluna 1: Modelos */
.cm-modelos { position: sticky; top: 16px; }
.cm-modelos h3 { margin: 4px 0 -4px; font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cm-busca-mod { margin: 0; } .cm-busca-mod .cl-busca { flex: 1 1 100%; }
.cm-mod { display: grid; grid-template-columns: 10px minmax(0, 1fr); gap: 10px; align-items: start; width: 100%; padding: 9px 10px; border: 1px solid var(--line); border-radius: 10px;
  background: var(--surface); color: var(--ink); font: inherit; text-align: left; cursor: pointer; }
.cm-mod[hidden], .cm-mod-linha[hidden] { display: none; }
.cm-mod:hover { border-color: var(--accent); }
.cm-mod:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cm-mod[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); }
.cm-mod > i { width: 10px; height: 10px; border-radius: 50%; background: var(--cm-cor); margin-top: 4px; }
.cm-mod span { display: grid; gap: 1px; min-width: 0; }
.cm-mod b { font-size: .86rem; font-weight: 600; line-height: 1.3; }
.cm-mod small { font-size: .72rem; color: var(--muted); line-height: 1.3; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.cm-mod-linha { display: flex; align-items: center; gap: 6px; }
.cm-mod-linha form { margin: 0; }
.cm-mod-vazio { font-size: .8rem; margin: 0; line-height: 1.4; }
.cm-salvar-mod { align-self: stretch; justify-content: center; border-style: dashed; }
/* Coluna 2: Mensagem */
.cm-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.cm-modo button { padding: 6px 12px; }
.cm-campos { margin: 0; }
.cm-bv-nota { margin: 0; font-size: .82rem; background: var(--accent-soft); color: var(--ink); border-radius: 9px; padding: 10px 12px; line-height: 1.4; }
.cm-editar, .cm-previa { display: grid; gap: 10px; }
.cm-editar[hidden], .cm-previa[hidden] { display: none; }
.cm-barra { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 5px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.cm-bt { border: 1px solid transparent; background: transparent; color: var(--ink); font: inherit; font-size: .8rem; font-weight: 600; padding: 5px 9px; border-radius: 7px; cursor: pointer; }
.cm-bt:hover { background: var(--surface); border-color: var(--line); }
.cm-bt[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.cm-bt.cm-var { font-family: var(--f-mono); font-size: .74rem; font-weight: 500; color: var(--accent); }
.cm-sep { width: 1px; height: 20px; background: var(--line); margin: 0 4px; }
.cm-tela { background: #E9EFF0; border-radius: 12px; padding: 18px; }
.cm-mail { max-width: 600px; margin: 0 auto; background: #fff; color: #0A2833; border-radius: 10px; overflow: hidden; box-shadow: 0 2px 12px rgba(10, 40, 51, .1); }
.cm-mail-topo { background: #0A2833; color: #fff; display: flex; align-items: center; justify-content: space-between; padding: 16px 22px; }
.cm-mail-logo { font-family: var(--f-display); font-weight: 700; letter-spacing: .1em; font-size: 1.15rem; display: grid; line-height: 1.1; }
.cm-mail-logo small { font-family: var(--f-body); font-weight: 400; letter-spacing: .02em; font-size: .64rem; opacity: .75; }
.cm-mail-tag { font-size: .62rem; font-weight: 700; letter-spacing: .1em; color: #08D7A5; border: 1px solid rgba(8, 215, 165, .5); border-radius: 99px; padding: 3px 9px; }
.cm-mail-faixa { height: 5px; background: linear-gradient(90deg, #079A78, #08D7A5); }
.cm-mail-img { padding: 14px 22px 0; }
.cm-mail-img[hidden], .cm-mail-botao[hidden] { display: none; }
.cm-mail-img .field, .cm-mail-botao .field { margin: 0; }
.cm-mail-corpo { padding: 18px 22px 8px; display: grid; gap: 6px; }
.cm-mail-corpo > .field { margin: 0; }
.cm-mail-corpo > .field > label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.cm-mail .input, .cm-mail textarea { background: transparent; color: #0A2833; }
.cm-mail-corpo > .field:first-child .input { border: 1px dashed transparent; font-family: var(--f-display); font-size: 1.35rem; font-weight: 600; padding: 4px 6px; height: auto; border-radius: 6px; }
.cm-mail-corpo textarea { border: 1px dashed transparent; font-size: .95rem; line-height: 1.6; padding: 6px; min-height: 180px; resize: vertical; border-radius: 6px; overflow: hidden; }
.cm-mail-corpo > .field:first-child .input:hover, .cm-mail-corpo textarea:hover { border-color: #CFDDDF; }
.cm-mail-corpo > .field:first-child .input:focus, .cm-mail-corpo textarea:focus { border-color: #079A78; outline: none; background: #F6FBFA; }
.cm-mail-corpo .invalid .input, .cm-mail-corpo .invalid textarea { border-color: var(--crit); }
.cm-mail-botao { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 10px; border: 1px dashed #CFDDDF; border-radius: 8px; margin-top: 4px; }
.cm-mail-botao .field > label, .cm-mail-img .field > label { color: #5A6E75; }
.cm-mail-botao .input, .cm-mail-img .input { border-color: #CFDDDF; }
.cm-mail-ass { margin: 10px 6px 4px; font-size: .9rem; line-height: 1.5; color: #0A2833; }
.cm-mail-rod { background: #F1F6F6; color: #5A6E75; font-size: .7rem; padding: 12px 22px; text-align: center; }
.cm-ajuda { margin: 0; font-size: .76rem; }
.cm-previa-cab { display: flex; gap: 10px; align-items: center; justify-content: space-between; flex-wrap: wrap; }
.cm-previa-cab .nl-inbox { flex: 1 1 260px; margin: 0; }
.cm-vercomo { flex: 0 1 300px; }
.cm-vercomo .select { flex: 1; width: auto; min-width: 0; }
.cm-previa iframe { width: 100%; height: 760px; border: 1px solid var(--line); border-radius: 10px; background: #EEF2F3; }
/* Coluna 3: Para Quem */
.cm-quem { position: sticky; top: 16px; }
.cm-quem .g-cab h2 { margin: 0; font-size: 1rem; }
.cm-quem .g-sub { font-size: .76rem; overflow: hidden; text-overflow: ellipsis; }
.cm-bv, .cm-publico { margin: 0; }
.cm-rot { font-size: .76rem; font-weight: 600; color: var(--muted); display: block; margin-bottom: 6px; }
.cm-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.cm-chip { position: relative; cursor: pointer; }
.cm-chip[hidden] { display: none; }
.cm-chip input { position: absolute; opacity: 0; inset: 0; cursor: pointer; margin: 0; }
.cm-chip span { display: inline-flex; align-items: center; padding: 6px 11px; border: 1px solid var(--line); border-radius: 99px; font-size: .8rem; font-weight: 600; color: var(--muted); background: var(--surface); }
.cm-chip:hover span { border-color: var(--accent); color: var(--ink); }
.cm-chip input:checked + span { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.cm-chip input:checked + span::before { content: "✓"; margin-right: 5px; }
.cm-chip input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.cm-lista-barra { margin: 0 0 6px; gap: 6px; }
.cm-lista-barra .cl-busca { flex: 1 1 100%; }
.cm-lista-barra .cl-chip:not(.cl-busca) { flex: 1 1 120px; }
.cm-lista-barra .cl-chip .select { flex: 1; width: auto; min-width: 0; }
.cm-lista-total { display: flex; justify-content: space-between; gap: 8px; font-size: .76rem; color: var(--muted); margin-bottom: 4px; flex-wrap: wrap; }
.cm-quem .nl-clientes.nl-tabela { max-height: 300px; }
.cm-quem .nl-tabela label.nl-cli { grid-template-columns: 18px minmax(0, 1fr) auto; gap: 8px; padding: 6px 10px; }
/* Lista Enviadas e Rascunhos */
.cm-filtros { margin: 0 0 12px; }
.cm-tipo { display: inline-flex; align-items: center; gap: 7px; font-weight: 600; font-size: .86rem; white-space: nowrap; }
.cm-tipo i { width: 9px; height: 9px; border-radius: 50%; background: var(--cm-cor); }
.cm-assunto { font-weight: 600; color: var(--ink); text-decoration: none; }
.cm-assunto:hover { color: var(--accent); }
.cm-tabela td small { display: block; color: var(--muted); font-size: .76rem; }
.cm-acoes { white-space: nowrap; }
.cm-acoes form.inline, .cm-acoes .btn-icone { display: inline-grid; vertical-align: middle; }
/* Pop-ups */
.cm-pop-pequeno { max-width: 480px; }
.cm-modelo-resumo { font-size: .82rem; margin: 0; }
.cm-envio-pop .modal { max-width: 760px; }
.cm-envio-resumo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; margin-bottom: 12px; }
.cm-envio-resumo div { display: grid; gap: 2px; min-width: 0; }
.cm-envio-resumo span { font-size: .72rem; color: var(--muted); font-weight: 600; text-transform: uppercase; letter-spacing: .05em; }
.cm-envio-resumo b { font-size: .88rem; overflow-wrap: anywhere; }
.cm-envio-ops { display: grid; gap: 10px; margin: 12px 0; }
.cm-envio-op { display: grid; gap: 6px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; }
.cm-envio-op.destaque { border-color: var(--accent); background: var(--accent-soft); }
.cm-envio-op .muted { font-size: .82rem; line-height: 1.4; }
.cm-envio-op .actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px; }
.cm-envio-fim { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding-top: 10px; border-top: 1px solid var(--line); font-size: .84rem; }
.cm-envio-lista { margin-top: 12px; }
.cm-envio-lista summary { cursor: pointer; font-weight: 600; color: var(--accent); font-size: .86rem; margin-bottom: 8px; }
@media (max-width: 1360px) { .cm-grid { grid-template-columns: 230px minmax(0, 1fr); } .cm-quem { grid-column: 1 / -1; position: static; } }
@media (max-width: 900px) { .cm-grid { grid-template-columns: minmax(0, 1fr); } .cm-modelos { position: static; } .cm-envio-resumo { grid-template-columns: 1fr; } }
[data-tema="escuro"] .cm-tela { background: #0E242C; }
.cm-abas { margin-top: 0; }
.cm-chip span, .cm-quem .field label.cm-chip span { color: var(--muted); }
.cm-quem .field label.cm-chip:hover span { color: var(--ink); }
.cm-quem .field label.cm-chip input:checked + span { color: var(--accent); }
.cm-lista-total { align-items: center; }
.cm-marcar { display: inline-flex; gap: 4px; }
.cm-marcar .btn.sm { padding: 3px 9px; font-size: .74rem; }
.dform.cm-campos { grid-template-columns: minmax(170px, .8fr) repeat(3, minmax(0, 1fr)); }
.cm-msg, .cm-previa, .cm-previa-cab { min-width: 0; }
.cm-previa-cab .nl-inbox { min-width: 0; overflow: hidden; }
.cm-previa-cab .nl-inbox span, .cm-previa-cab .nl-inbox b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Comunicação · ajustes do Marco (22/10/2026, 2ª rodada): sem Card de Resumo, Em Cópia, Enviar no Para Quem e Confirmar Envio */
.cm-abas { margin: 4px 0 16px; }
.cm-quem { gap: 14px; }
.cm-quem > .dform { gap: 14px; }
.cm-quem .field, .cm-quem .dform .field { margin: 0; }
.cm-rot { font-size: .78rem; font-weight: 600; color: var(--muted); margin-bottom: 6px; }
/* Em Cópia */
.cm-copia-lista { display: grid; gap: 6px; }
.cm-copia-eu { display: flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); font-size: .86rem; min-width: 0; }
.cm-copia-tag { flex: none; font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--accent); background: var(--accent-soft); border-radius: 99px; padding: 2px 8px; }
.cm-copia-end { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-copia-linha { display: grid; grid-template-columns: minmax(0, 1fr) 40px; gap: 6px; align-items: center; }
.cm-copia-linha .input { height: 40px; width: 100%; }
.cm-copia-linha .input.ruim { border-color: var(--crit); }
.cm-copia-linha .icon-btn { width: 40px; height: 40px; }
.cm-copia-linha .icon-btn svg { width: 15px; height: 15px; }
.cm-copia-mais { justify-self: start; margin-top: 6px; border: 0; background: none; padding: 0; font: inherit; font-size: .84rem; font-weight: 600; color: var(--accent); cursor: pointer; }
.cm-copia-mais[hidden] { display: none; }
.cm-copia-mais small { font-weight: 500; color: var(--muted); }
.cm-copia .err { display: block; margin-top: 4px; }
/* Resumo do envio e o botão Enviar */
.cm-envio-box { display: grid; gap: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; background: var(--surface-2); }
.cm-eb-linha { display: grid; grid-template-columns: 96px minmax(0, 1fr); gap: 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); align-items: start; }
.cm-eb-rot { font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding-top: 2px; }
.cm-eb-val { display: grid; gap: 2px; min-width: 0; font-size: .84rem; }
.cm-eb-val b { font-weight: 600; color: var(--ink); }
.cm-eb-val small { font-size: .78rem; color: var(--muted); overflow-wrap: anywhere; line-height: 1.4; }
.cm-eb-total.zero { color: var(--warn); }
.cm-eb-falta { color: var(--warn) !important; }
.cm-envio-box .cm-enviar { margin: 12px; justify-content: center; display: flex; align-items: center; gap: 8px; height: 44px; font-size: .95rem; }
.cm-envio-box .cm-enviar svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* Alinhamentos: barra de ferramentas numa faixa, campos com a mesma altura, lista de clientes em colunas fixas */
.cm-barra { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }
.cm-bt { flex: none; height: 30px; display: inline-flex; align-items: center; }
.cm-campos .input, .cm-campos .select, .cm-quem .select, .cm-quem .input, .cm-lista-barra .cl-chip { height: 40px; }
.cm-lista-barra { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.cm-lista-barra .cl-busca { grid-column: 1 / -1; }
.cm-lista-barra .cl-chip { width: 100%; min-width: 0; margin: 0; }
.cm-lista-total { margin: 8px 0 6px; }
.cm-quem .nl-tabela label.nl-cli { grid-template-columns: 18px minmax(0, 1fr) 92px; }
.cm-quem .nl-cli-mail { text-align: left; white-space: normal; line-height: 1.3; }
.cm-chips { gap: 6px; }
.cm-chip span { height: 32px; }
.cm-modo { padding: 3px; }
.cm-cab { min-height: 36px; }
.cm-grid > .panel, .cm-form > .panel { padding: 18px; }
/* Confirmar Envio */
.cm-envio-pop .modal { max-width: 980px; width: calc(100% - 32px); }
.cm-envio-pop .modal-head h2 svg { width: 20px; height: 20px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vertical-align: -4px; margin-right: 8px; }
.cm-conf { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 16px; align-items: start; }
.cm-conf-dados { display: grid; gap: 0; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.cm-conf-dados > .alert { margin: 10px 12px; }
.cm-conf-linha { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 10px; padding: 11px 14px; border-bottom: 1px solid var(--line); font-size: .86rem; }
.cm-conf-linha:last-of-type { border-bottom: 0; }
.cm-conf-linha > span { font-size: .72rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); padding-top: 2px; }
.cm-conf-linha > div { display: grid; gap: 3px; min-width: 0; }
.cm-conf-linha small { color: var(--muted); font-size: .8rem; overflow-wrap: anywhere; }
.cm-conf-lista summary { cursor: pointer; font-size: .8rem; color: var(--accent); overflow-wrap: anywhere; }
.cm-conf-lista ul { list-style: none; margin: 8px 0 0; padding: 0; max-height: 180px; overflow: auto; display: grid; gap: 6px; }
.cm-conf-lista li { display: grid; font-size: .8rem; }
.cm-conf-previa { display: grid; gap: 8px; min-width: 0; }
.cm-conf-previa .nl-inbox { margin: 0; min-width: 0; overflow: hidden; }
.cm-conf-previa .nl-inbox span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cm-conf-previa iframe { width: 100%; height: 420px; border: 1px solid var(--line); border-radius: 10px; background: #EEF2F3; }
.cm-contagem { margin-top: 16px; padding: 14px; border: 1px solid var(--accent); border-radius: 12px; background: var(--accent-soft); display: grid; gap: 12px; }
.cm-barra-envio { height: 10px; border-radius: 99px; background: color-mix(in srgb, var(--accent) 18%, var(--surface)); overflow: hidden; }
.cm-barra-envio i { display: block; height: 100%; width: 0; border-radius: 99px; background: linear-gradient(90deg, #079A78, #08D7A5); }
.cm-contagem-rod { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.cm-contagem-txt { margin: 0; font-size: .86rem; font-weight: 600; color: var(--ink); }
.cm-contagem-bts { display: flex; gap: 8px; }
.cm-contagem-bts .btn.primary { display: inline-flex; align-items: center; gap: 8px; }
.cm-contagem-bts svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cm-contagem.enviando .cm-barra-envio i { animation: cm-pulso 1s ease-in-out infinite alternate; }
@keyframes cm-pulso { from { opacity: .6; } to { opacity: 1; } }
.cm-sem-m365 { margin: 16px 0 0; font-size: .84rem; color: var(--muted); background: var(--surface-2); border-radius: 10px; padding: 10px 12px; }
.cm-outras { margin-top: 14px; }
.cm-outras summary { cursor: pointer; font-weight: 600; font-size: .86rem; color: var(--accent); }
.cm-outras .cm-envio-ops { margin: 10px 0 0; }
.cm-envio-fim { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; padding: 12px 14px; border-top: 1px solid var(--line); }
@media (max-width: 860px) { .cm-conf { grid-template-columns: minmax(0, 1fr); } .cm-conf-previa iframe { height: 320px; } }
.cm-quem { position: static; }
.cm-quem .nl-tabela label.nl-cli { grid-template-columns: 18px minmax(0, 1fr); }
.cm-quem .nl-cli-nome small em { color: var(--warn); font-style: normal; }
.cm-copia-mais { align-self: flex-start; }
.cm-eb-linha { grid-template-columns: minmax(0, 1fr); gap: 3px; }
.cm-eb-rot { padding-top: 0; }
.cm-conf-linha > div > .badge { justify-self: start; }
.cm-barra { flex-wrap: wrap; overflow: visible; row-gap: 0; padding: 4px 6px; }
.cm-vars { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 4px; width: 100%; border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px; }
.cm-vars-rot { font-size: .7rem; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: var(--muted); margin: 0 6px 0 4px; }
.cm-mail-botao { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cm-mail-botao > .field { grid-column: auto; width: auto; min-width: 0; }
.cm-vars .cm-var { padding: 4px 7px; font-size: .72rem; }
/* Comunicação: Salvar ao lado do Enviar no card Para Quem (Marco, 22/10/2026) */
.cm-eb-acoes { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 8px; margin: 12px; }
.cm-eb-acoes .btn { height: 44px; margin: 0; }
.cm-envio-box .cm-eb-acoes .cm-enviar { margin: 0; }
.cm-eb-acoes .cm-salvar { padding: 0 14px; background: var(--surface); }
.cm-eb-acoes { grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); }
.cm-eb-acoes .btn { justify-content: center; white-space: nowrap; padding: 0 10px; }
.cm-eb-acoes .cm-enviar svg { flex: none; }
/* Comunicação: Assunto e Texto de Prévia automáticos e botões do Para Quem com letras iguais (Marco, 22/10/2026) */
.field.cm-com-auto { position: relative; }
.cm-auto { position: absolute; top: -2px; right: 0; border: 1px solid var(--line); background: var(--surface); color: var(--muted); font: inherit; font-size: .68rem; font-weight: 600; line-height: 1; padding: 3px 8px; border-radius: 99px; cursor: pointer; }
.cm-auto:hover { border-color: var(--accent); color: var(--ink); }
.cm-auto[aria-pressed="true"] { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.cm-auto[aria-pressed="true"]::before { content: "✓ "; }
.cm-auto:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.cm-envio-box .cm-eb-acoes .btn, .cm-envio-box .cm-eb-acoes .cm-enviar { font-size: .9rem; font-weight: 600; font-family: inherit; line-height: 1; }
/* Comunicação: Salvar Rascunho e Enviar só com ícone (Marco, 22/10/2026) */
.cm-eb-acoes { grid-template-columns: 1fr 1fr; }
.cm-eb-acoes .btn { display: flex; align-items: center; justify-content: center; padding: 0; }
.cm-eb-acoes .btn svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
/* Relatórios: Salvar como Modelo e Gerar PDF só com ícone no fim da coluna da direita, como na Comunicação (Marco, 22/10/2026) */
.re-cfg { position: static; }
.re-acoes { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding-top: 12px; border-top: 1px solid var(--line); }
.re-acoes .btn { height: 44px; margin: 0; display: flex; align-items: center; justify-content: center; padding: 0; }
.re-acoes .btn:not(.primary) { background: var(--surface); }
.re-acoes .btn svg { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.re-acoes .btn:disabled { opacity: .45; cursor: default; }
/* Configurações no padrão das outras páginas (Marco, 22/10/2026): abas, chips, ícones na linha e Novo/Editar em pop-up */
.cfg-abas { margin: 4px 0 16px; flex-wrap: wrap; }
.cfg-filtros { margin: 0 0 12px; }
.cfg-filtros .cl-busca { flex: 1 1 260px; }
.cfg-filtros .cl-chip .select { flex: 1; width: auto; min-width: 0; }
.cfg-acoes { white-space: nowrap; width: 1%; }
.cfg-acoes form.inline, .cfg-acoes .btn-icone, .cfg-acoes form { display: inline-grid; vertical-align: middle; margin: 0 0 0 4px; }
.cfg-tabela td { vertical-align: middle; }
.cfg-pop .modal { width: min(760px, 100%); max-height: calc(100dvh - 32px); overflow: auto; }
.cfg-pop.largo .modal { width: min(980px, 100%); }
.cfg-pop .modal-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.cfg-pop-acoes { display: flex; align-items: center; gap: 6px; }
.cfg-pop-acoes form { margin: 0; }
.cfg-pop .modal-body > .panel { margin-top: 16px; box-shadow: none; }
.cfg-ultima { margin: -6px 0 12px; font-size: .8rem; }
/* Configurações › Parâmetros em quatro cartões (Marco, 22/10/2026) */
.par-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: start; }
.par-card { gap: 10px; }
.par-sub { margin: -4px 0 0; font-size: .82rem; }
.par-campos { margin: 0; }
.par-rot { margin: 6px 0 -4px; font-size: .86rem; font-weight: 600; }
.par-rot .muted { font-weight: 400; font-size: .8rem; }
.par-status { display: grid; gap: 4px; padding: 10px 12px; border-radius: 10px; background: var(--surface-2); font-size: .84rem; }
.par-status.ok { background: var(--ok-soft); }
.par-status b { font-weight: 600; }
.par-status span { color: var(--muted); }
.par-status form, .par-status .btn { justify-self: start; margin-top: 4px; }
.par-acoes { display: flex; justify-content: flex-end; margin-top: 16px; }
@media (max-width: 1000px) { .par-grid { grid-template-columns: minmax(0, 1fr); } }
/* Configurações › Minha Senha com código por e-mail (Marco, 22/10/2026) */
.senha-card { max-width: 760px; gap: 16px; }
.senha-passo { display: grid; grid-template-columns: 32px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--surface-2); }
.senha-passo > div { display: grid; gap: 2px; }
.senha-passo small { color: var(--muted); font-size: .82rem; }
.senha-passo form { margin: 0; }
.senha-n { width: 28px; height: 28px; border-radius: 50%; display: inline-grid; place-items: center; background: var(--accent); color: #fff; font-weight: 700; font-size: .84rem; flex: none; }
.senha-passo-t { display: flex; align-items: center; gap: 10px; margin: 0; }
.senha-form.esperando { opacity: .55; }
.senha-form input[name="codigo"] { font-family: var(--f-mono); letter-spacing: .3em; font-size: 1.1rem; }
@media (max-width: 640px) { .senha-passo { grid-template-columns: 32px minmax(0, 1fr); } .senha-passo form { grid-column: 1 / -1; } }
/* Barra de cima (Marco, 23/10/2026): logotipo menor, a linha de baixo dele na mesma altura da linha da barra, barra um
   pouco maior, sino no padrão dos ícones das páginas, foto de perfil com borda na cor do departamento e sem o Sair */
:root { --topo-h: 64px; }
.side { padding-top: 0; }
.brand { height: var(--topo-h); min-height: var(--topo-h); margin: 0 -12px 6px; padding: 0 20px; border-bottom: 1px solid var(--line); flex: none; }
.brand img.brand-logo { width: 148px; }
.menu-recolhido .brand { padding-inline: 0; justify-content: center; }
.top { min-height: var(--topo-h); padding-block: 0; }
.top-right { gap: 12px; }
.agenda-btn.btn-icone { width: 38px; height: 38px; border-radius: 10px; color: var(--ink); }
.agenda-btn.btn-icone svg { width: 18px; height: 18px; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.agenda-btn:hover { border-color: var(--accent); color: var(--accent); }
.ntf-badge { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 99px; background: var(--crit); color: #fff; font-size: .66rem; font-weight: 700; display: grid; place-items: center; border: 2px solid var(--bg); line-height: 1; }
/* Usuário: foto (ou iniciais) com anel na cor do departamento */
.user-btn { all: unset; box-sizing: border-box; display: flex; align-items: center; gap: 10px; padding: 4px 10px 4px 4px; border-radius: 12px; cursor: pointer; border: 1px solid transparent; }
.user-btn:hover, .user-btn:focus-visible { background: var(--surface); border-color: var(--line); }
.user-btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.user-btn:disabled { cursor: default; }
.user-chev { width: 16px; height: 16px; fill: none; stroke: var(--muted); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.avatar { --dep: var(--accent); width: 40px; height: 40px; overflow: hidden; box-shadow: 0 0 0 2px var(--bg), 0 0 0 4px var(--dep); background: var(--accent-soft); color: var(--dep); }
.avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
.avatar.grande { width: 84px; height: 84px; font-size: 1.6rem; box-shadow: 0 0 0 3px var(--surface), 0 0 0 6px var(--dep); }
.dep-zoe { --dep: #079A78; } .dep-comercial { --dep: #2F62A8; } .dep-implantacao { --dep: #1497B8; } .dep-pos-vendas { --dep: #7C4DCC; }
.dep-sinistros { --dep: #B7372B; } .dep-financeiro { --dep: #C98612; } .dep-diretoria { --dep: #0A2833; } .dep-administrativo { --dep: #5A6E75; }
[data-tema="escuro"] .dep-diretoria { --dep: #9DB2BA; }
.user-txt span { font-size: .74rem; }
/* Painel de Notificações: abre logo abaixo do sino, sem escurecer a tela */
.ntf-pop { background: transparent; place-items: start end; padding: calc(var(--topo-h) + 6px) 20px 16px; }
.ntf-pop .modal { width: min(420px, 100%); max-height: calc(100dvh - var(--topo-h) - 24px); border: 1px solid var(--line); box-shadow: 0 16px 40px rgba(10, 40, 51, .18); border-radius: 14px; }
.ntf-cab { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.ntf-cab h2 { display: flex; align-items: center; gap: 8px; margin: 0; font-size: 1.05rem; }
.ntf-cab h2 svg { width: 18px; height: 18px; fill: none; stroke: var(--accent); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ntf-cab-acoes { display: flex; gap: 6px; }
.ntf-cab-acoes .btn-icone { width: 32px; height: 32px; }
.ntf-cab-acoes svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ntf-pop .modal-body { gap: 12px; padding-top: 12px; }
.ntf-abas { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; padding: 4px; background: var(--surface-2); border-radius: 11px; }
.ntf-aba { border: 0; background: transparent; border-radius: 8px; padding: 7px 4px; font: inherit; font-size: .8rem; font-weight: 600; color: var(--muted); cursor: pointer; display: flex; align-items: center; justify-content: center; gap: 5px; white-space: nowrap; }
.ntf-aba span { font-size: .68rem; min-width: 18px; padding: 1px 5px; border-radius: 99px; background: var(--line); color: var(--ink); }
.ntf-aba[aria-selected="true"] { background: var(--surface); color: var(--ink); box-shadow: 0 1px 3px rgba(10, 40, 51, .12); }
.ntf-aba.crit span { background: var(--crit); color: #fff; }
.ntf-lista { display: grid; gap: 6px; }
.ntf-item { display: grid; grid-template-columns: 36px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid var(--line); border-radius: 11px; color: inherit; text-decoration: none; background: var(--surface); }
.ntf-item[hidden] { display: none; }
.ntf-item:hover, .ntf-item:focus-visible { border-color: var(--accent); background: var(--surface-2); }
.ntf-ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--accent-soft); color: var(--accent); }
.ntf-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ntf-item.g-atrasado { border-left: 3px solid var(--crit); }
.ntf-item.g-atrasado .ntf-ic { background: var(--crit-soft); color: var(--crit); }
.ntf-item.g-hoje .ntf-ic { background: var(--info-soft); color: var(--info); }
.ntf-corpo { display: grid; gap: 2px; min-width: 0; }
.ntf-corpo b { font-size: .88rem; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ntf-corpo small { font-size: .76rem; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ntf-tag { justify-self: start; font-style: normal; font-size: .66rem; font-weight: 700; color: var(--crit); background: var(--crit-soft); border-radius: 99px; padding: 1px 7px; margin-top: 2px; }
.ntf-quando { display: grid; justify-items: end; gap: 1px; font-variant-numeric: tabular-nums; }
.ntf-quando b { font-size: .8rem; font-weight: 600; }
.ntf-quando small { font-size: .72rem; color: var(--muted); }
.ntf-vazio { display: grid; justify-items: center; gap: 4px; padding: 22px 0; margin: 0; text-align: center; }
.ntf-vazio[hidden] { display: none; }
.ntf-vazio svg { width: 28px; height: 28px; fill: none; stroke: var(--accent); stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
.ntf-vazio b { font-size: .9rem; }
.ntf-vazio span { font-size: .8rem; color: var(--muted); }
.ntf-rod { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; border-top: 1px solid var(--line); padding-top: 12px; }
.ntf-rod .btn { justify-content: center; }
/* Meu Perfil */
.perfil-pop .modal { width: min(500px, 100%); }
.perfil-form { display: grid; gap: 16px; }
.perfil-topo { display: flex; align-items: center; gap: 18px; padding: 6px 4px; }
.perfil-quem { display: grid; gap: 2px; min-width: 0; }
.perfil-quem b { font-size: 1.05rem; }
.perfil-quem span { color: var(--muted); font-size: .86rem; overflow-wrap: anywhere; }
.perfil-quem small { color: var(--muted); font-size: .78rem; }
.perfil-campo { display: grid; gap: 6px; }
.perfil-foto-bts { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.perfil-arquivo { position: relative; cursor: pointer; overflow: hidden; }
.perfil-arquivo input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.perfil-remover { display: inline-flex; align-items: center; gap: 6px; font-size: .84rem; }
.perfil-deps { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
.perfil-dep { position: relative; display: flex; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 10px; cursor: pointer; font-size: .85rem; font-weight: 500; }
.perfil-dep input { position: absolute; opacity: 0; inset: 0; cursor: pointer; margin: 0; }
.perfil-dep i { width: 16px; height: 16px; border-radius: 50%; background: var(--dep); flex: none; }
.perfil-dep:has(input:checked) { border-color: var(--dep); background: color-mix(in srgb, var(--dep) 10%, transparent); font-weight: 600; }
.perfil-dep:has(input:focus-visible) { outline: 2px solid var(--accent); outline-offset: 2px; }
.perfil-form .form-acoes { display: flex; justify-content: space-between; gap: 8px; border-top: 1px solid var(--line); padding-top: 14px; }
@media (max-width: 760px) { .ntf-pop { padding-inline: 10px; } }

/* Montar Relatório (Marco, 23/10/2026): a capa da pré-visualização segue a do PDF — fundo inteiro do Relatório de Gestão
   (#0A2833), tipo em menta, título, "Para" e o cliente; sem sumário e sem escolha de cor */
.re-folha.re-capa { background: #0A2833; color: #fff; gap: 0; }
.re-folha.re-capa::before { display: none; }
.re-capa .re-capa-marca { color: #08D7A5; }
.re-capa-tipo { padding: 26px 10px 0; font-size: .44rem; font-weight: 700; letter-spacing: .14em; color: #08D7A5; }
.re-capa-tipo::after { content: ""; display: block; width: 14px; height: 2px; background: #08D7A5; margin-top: 4px; }
.re-capa .re-capa-nome { padding-top: 6px; font-size: .8rem; }
.re-capa-para { padding: 14px 10px 0; font-size: .4rem; font-weight: 700; letter-spacing: .14em; color: #08D7A5; }
.re-capa-cli { padding: 2px 10px 0; font-size: .6rem; font-weight: 700; line-height: 1.2; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.re-capa .re-capa-per { padding-top: 2px; font-size: .5rem; opacity: .75; }
.re-capa > .re-capa-tipo, .re-capa > .re-capa-para, .re-capa > .re-capa-cli { flex: none; }
.re-capa > .re-f-rod { margin-top: auto; color: rgba(255, 255, 255, .6); border-top-color: rgba(255, 255, 255, .15); }

/* Cores dos produtos nos gráficos (Marco, 23/10/2026): Saúde verde, Odontológico azul e Seguro de Vida azul-marinho, as
   mesmas da legenda do Top 10. gpcN = gráfico de um produto (Grafico::produto); gp-sw3…5 = tons claros da 2ª série. */
.gp-leg .gp-sw2 { background: linear-gradient(#2C5866, #0A2833); }
.gp-leg .gp-sw3 { background: linear-gradient(#A6EBD8, #5CCFAE); } .gp-leg .gp-sw4 { background: linear-gradient(#B7D3EA, #7FAACF); } .gp-leg .gp-sw5 { background: linear-gradient(#B3C6CC, #7F99A1); }
.anel-sw.anel-cor10 { background: #079A78; } .anel-sw.anel-cor11 { background: #2B6F9E; } .anel-sw.anel-cor12 { background: #0A2833; }
.anel-sw.anel-swg0 { background: linear-gradient(#0FC79C, #079A78); } .anel-sw.anel-swg1 { background: linear-gradient(#4A8BC0, #2B6F9E); } .anel-sw.anel-swg2 { background: linear-gradient(#2C5866, #0A2833); }
.anel-t0-0 { background: #079A78; } .anel-t0-1 { background: #0FC79C; } .anel-t0-2 { background: #05614F; } .anel-t0-3 { background: #6FDCC0; } .anel-t0-4 { background: #3E9C8F; } .anel-t0-5 { background: #A6EBD8; } .anel-t0-6 { background: #0B7D63; } .anel-t0-7 { background: #2FB892; } .anel-t0-8 { background: #8CCFBF; } .anel-t0-9 { background: #C9D7DB; }
.anel-t1-0 { background: #2B6F9E; } .anel-t1-1 { background: #4A8BC0; } .anel-t1-2 { background: #1B4C70; } .anel-t1-3 { background: #7FAACF; } .anel-t1-4 { background: #3D7FB0; } .anel-t1-5 { background: #B7D3EA; } .anel-t1-6 { background: #24618C; } .anel-t1-7 { background: #5E9ACB; } .anel-t1-8 { background: #9DBFDD; } .anel-t1-9 { background: #C9D7DB; }
.anel-t2-0 { background: #2C5866; } .anel-t2-1 { background: #4E7480; } .anel-t2-2 { background: #1F4A57; } .anel-t2-3 { background: #7F99A1; } .anel-t2-4 { background: #3A6573; } .anel-t2-5 { background: #A9BDC3; } .anel-t2-6 { background: #5F818C; } .anel-t2-7 { background: #91AAB2; } .anel-t2-8 { background: #6C8A94; } .anel-t2-9 { background: #C9D7DB; }
.chart.gp.gpc1 .linha.traco { stroke: #2B6F9E; } .chart.gp.gpc1 .gp-pt .ponto { fill: #2B6F9E; }
.chart.gpc1 .linha { stroke: #2B6F9E; } .chart.gpc1 .ponto.ok { fill: #2B6F9E; }
.chart.gp.gpc2 .linha.traco { stroke: #0A2833; } .chart.gp.gpc2 .gp-pt .ponto { fill: #0A2833; }
.chart.gpc2 .linha { stroke: #0A2833; } .chart.gpc2 .ponto.ok { fill: #0A2833; }
.chart.gpc0 .serie-1, .legend.gpc0 i.serie-1 { fill: #079A78; background: #079A78; } .chart.gpc0 .serie-2, .legend.gpc0 i.serie-2 { fill: #A6EBD8; background: #A6EBD8; }
.chart.gpc1 .serie-1, .legend.gpc1 i.serie-1 { fill: #2B6F9E; background: #2B6F9E; } .chart.gpc1 .serie-2, .legend.gpc1 i.serie-2 { fill: #B7D3EA; background: #B7D3EA; }
.chart.gpc2 .serie-1, .legend.gpc2 i.serie-1 { fill: #0A2833; background: #0A2833; } .chart.gpc2 .serie-2, .legend.gpc2 i.serie-2 { fill: #B3C6CC; background: #B3C6CC; }
[data-tema="escuro"] .gc2-t { stop-color: #A9C0C6; } [data-tema="escuro"] .gc2-b { stop-color: #6F8C95; } [data-tema="escuro"] .ga2 { stop-color: #A9C0C6; }
[data-tema="escuro"] .gp-leg .gp-sw2, [data-tema="escuro"] .anel-sw.anel-swg2 { background: linear-gradient(#A9C0C6, #6F8C95); }
[data-tema="escuro"] .anel-sw.anel-cor12 { background: #8FAAB2; }
[data-tema="escuro"] .chart.gp.gpc2 .linha.traco, [data-tema="escuro"] .chart.gpc2 .linha { stroke: #A9C0C6; }
[data-tema="escuro"] .chart.gp.gpc2 .gp-pt .ponto, [data-tema="escuro"] .chart.gpc2 .ponto.ok { fill: #A9C0C6; }
[data-tema="escuro"] .chart.gpc2 .serie-1, [data-tema="escuro"] .legend.gpc2 i.serie-1 { fill: #8FAAB2; background: #8FAAB2; }
.hbar-t .ok.hp1 { fill: #2B6F9E; } .hbar-t .ok.hp2 { fill: #0A2833; } [data-tema="escuro"] .hbar-t .ok.hp2 { fill: #8FAAB2; }

/* Produtos (Marco, 23/10/2026): Participação, Clientes e Vidas alinhados — anel do mesmo tamanho no topo, legendas
   terminando na mesma linha e a curva das vidas ocupando a altura do quadro */
.pf-graficos .g-bloco > .anel-wrap { justify-content: space-between; gap: 12px; }
.pf-graficos .g-bloco > .anel-wrap > .chart.anel { width: 210px; }
.pf-graficos .g-bloco > .anel-wrap > .anel-leg { margin-top: auto; }
.pf-graficos #g-vidas .chart.gp { max-height: none; margin-top: auto; margin-bottom: auto; }
.anel-leg .anel-extra i { visibility: hidden; } .anel-leg .anel-extra span { color: var(--muted); }

/* Buscar da barra de cima (Marco, 23/10/2026): pop-up no alto da tela, campo grande e resultados com o caminho no menu */
.modal-bg.busca-pop { place-items: start center; padding-top: 9vh; }
.dialogo-pop .modal.busca-modal { width: min(700px, calc(100vw - 32px)); padding: 0; overflow: hidden; display: flex; flex-direction: column; max-height: 78vh; border-radius: 18px; }
.busca-campo { display: flex; align-items: center; gap: 12px; padding: 14px 14px 14px 18px; border-bottom: 1px solid var(--line); }
.busca-campo > svg { width: 22px; height: 22px; flex: none; fill: none; stroke: var(--brand); stroke-width: 2; stroke-linecap: round; }
.busca-campo input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font: inherit; font-size: 1.05rem; padding: 6px 0; }
.busca-campo input::-webkit-search-cancel-button { display: none; }
.busca-res { overflow-y: auto; padding: 6px 10px 10px; min-height: 120px; }
.busca-grupo { margin: 12px 8px 6px; font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.busca-item { display: grid; grid-template-columns: 40px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 10px 12px; border-radius: 12px; color: var(--ink); text-decoration: none; }
.busca-item.sel { background: #EEF7F4; }
.busca-ic { width: 40px; height: 40px; border-radius: 11px; background: #E3F6F0; display: grid; place-items: center; }
.busca-ic svg { width: 20px; height: 20px; fill: none; stroke: #079A78; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.busca-item.cli .busca-ic { background: #E6EFF7; } .busca-item.cli .busca-ic svg { stroke: #2B6F9E; }
.busca-txt { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.busca-txt b { font-size: .95rem; font-weight: 600; }
.busca-cam { font-size: .76rem; font-weight: 600; color: #079A78; }
.busca-desc { font-size: .8rem; line-height: 1.4; color: var(--muted); }
.busca-item mark { background: #CFF3E6; color: inherit; border-radius: 3px; padding: 0 1px; }
.busca-ir { font-size: .74rem; font-weight: 700; color: var(--muted); border: 1px solid var(--line); border-radius: 99px; padding: 4px 12px; }
.busca-item.sel .busca-ir { background: #079A78; border-color: #079A78; color: #fff; }
.busca-vazio { display: grid; gap: 6px; justify-items: center; text-align: center; padding: 30px 16px; color: var(--muted); }
.busca-vazio b { color: var(--ink); }
.busca-rod { display: flex; gap: 18px; padding: 10px 18px; border-top: 1px solid var(--line); font-size: .74rem; color: var(--muted); }
.busca-rod kbd { display: inline-block; min-width: 20px; padding: 1px 6px; margin-right: 4px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 5px; font: inherit; font-size: .7rem; text-align: center; color: var(--ink); background: var(--surface); }
@media (max-width: 640px) { .busca-rod { display: none; } .busca-ir { display: none; } .busca-item { grid-template-columns: 40px minmax(0, 1fr); } }
[data-tema="escuro"] .busca-item.sel { background: rgba(8, 215, 165, .1); }
[data-tema="escuro"] .busca-ic { background: rgba(8, 215, 165, .12); } [data-tema="escuro"] .busca-ic svg { stroke: #2FD5A9; }
[data-tema="escuro"] .busca-item.cli .busca-ic { background: rgba(74, 139, 192, .16); } [data-tema="escuro"] .busca-item.cli .busca-ic svg { stroke: #8FB8DB; }
[data-tema="escuro"] .busca-cam { color: #2FD5A9; } [data-tema="escuro"] .busca-item mark { background: rgba(8, 215, 165, .25); }
.busca-btn.btn-icone { width: 38px; height: 38px; border-radius: 10px; color: var(--ink); }
.busca-btn.btn-icone svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.busca-btn:hover { border-color: var(--accent); color: var(--accent); }

/* Reajuste por modalidade (Opção C do Marco, 23/10/2026): cards Pool de Risco / Negociado / Projeto Especial,
   o índice do Pool já cadastrado e a leitura da Nova Mensalidade; tela Índices do Pool */
.rj-modos { display: grid; gap: 8px; }
.rj-tit { margin: 4px 0 0; font-size: .74rem; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); font-weight: 600; }
.rj-faixas { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.rj-fx { position: relative; }
.rj-fx small { color: var(--muted); font-size: .78rem; line-height: 1.3; }
.rj-fx:disabled { opacity: .45; cursor: not-allowed; }
.rj-auto { position: absolute; top: 10px; right: 10px; font-style: normal; font-size: .7rem; font-weight: 600; color: var(--accent); background: color-mix(in srgb, var(--accent) 12%, transparent); padding: 2px 8px; border-radius: 99px; }
.rj-auto[hidden] { display: none; }
.rj-indice { display: flex; align-items: center; gap: 14px; padding: 12px 14px; border: 1px dashed var(--accent); border-radius: 12px; }
.rj-indice[hidden], .rj-leitura[hidden] { display: none; }
.rj-indice > b.v { font-size: 1.5rem; font-family: 'Bricolage Grotesque', sans-serif; color: var(--accent); white-space: nowrap; }
.rj-indice > div { flex: 1; display: grid; gap: 2px; min-width: 0; }
.rj-indice small { color: var(--muted); font-size: .8rem; }
.rj-indice > a { font-size: .82rem; font-weight: 600; color: var(--accent); white-space: nowrap; }
.rj-indice.falta { border-color: var(--warn); }
.rj-indice.falta > b.v, .rj-indice.falta > a { color: var(--warn); }
.rj-leitura { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.rj-leitura > div { display: grid; gap: 2px; padding: 10px 14px; border-left: 1px solid var(--line); align-content: start; }
.rj-leitura > div:first-child { border-left: 0; }
.rj-leitura span { font-size: .76rem; color: var(--muted); }
.rj-leitura b { font-size: 1.15rem; font-family: 'Bricolage Grotesque', sans-serif; }
.rj-leitura small { font-size: .74rem; color: var(--muted); }
@media (max-width: 640px) {
  .rj-faixas, .rj-leitura { grid-template-columns: 1fr; }
  .rj-leitura > div { border-left: 0; border-top: 1px solid var(--line); }
  .rj-leitura > div:first-child { border-top: 0; }
  .rj-indice { flex-wrap: wrap; }
}
/* Alinhamentos do Reajuste por modalidade (Marco, 23/10/2026) */
.ip-pop .modal { width: min(760px, 100%); }
td.nowrap, td.ip-falta { white-space: nowrap; }
td.ip-falta .btn.sm { margin: 0; }
.rj-form .field input:disabled { background: var(--surface-2); color: var(--muted); cursor: not-allowed; }
/* Filtros de Reajustes com o chip Modalidade: todos numa linha, sem apertar o Buscar */
.rj-filtros .cl-chip .select, .rj-filtros .cl-chip.medio .select, .rj-filtros .cl-chip.largo .select { width: 100px; }
.rj-filtros .cl-busca { flex: 1 1 150px; }

/* Cadastro de cliente (David, 23/10/2026): botão "Usar as Mesmas Pessoas no Plano Odontológico" no fim do Plano de Saúde,
   o aviso no Odonto, Nome do Plano em lista e o Fim da Vigência travado do Seguro de Vida */
.prod-copiar { display: flex; margin-top: 14px; cursor: pointer; }
.prod-copiar[hidden] { display: none; }
.prod-copiar input { position: absolute; opacity: 0; pointer-events: none; }
.prod-copiar > span { flex: 1; display: grid; grid-template-columns: 28px 1fr; column-gap: 10px; align-items: center; padding: 11px 14px; border: 1px dashed var(--accent); border-radius: 12px; background: var(--surface); transition: background .15s, border-color .15s; }
.prod-copiar svg { grid-row: span 2; width: 22px; height: 22px; fill: none; stroke: var(--accent); stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.prod-copiar b { font-size: .9rem; color: var(--accent); }
.prod-copiar small { color: var(--muted); font-size: .78rem; }
.prod-copiar:hover > span, .prod-copiar input:focus-visible + span { background: color-mix(in srgb, var(--accent) 6%, var(--surface)); }
.prod-copiar input:checked + span { border-style: solid; background: color-mix(in srgb, var(--accent) 10%, var(--surface)); }
.prod-copiar input:checked + span b::before { content: "✓ "; }
.prod-mesmos-info { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 4px 0 8px; padding: 10px 14px; border-radius: 10px; background: color-mix(in srgb, var(--accent) 8%, var(--surface)); font-size: .86rem; font-weight: 600; }
.prod-mesmos-info[hidden] { display: none; }
.form-novo-cliente .prod-mesmos-info .lnk-acao { float: none; }
.form-novo-cliente .field select[data-plano-lista][hidden], .form-novo-cliente .field .plano-outro[hidden] { display: none; }
.form-novo-cliente .vig-travado .input { background: var(--surface-2); color: var(--muted); cursor: not-allowed; }

/* Odonto Conjugado ao Plano de Saúde (Marco, 26/10/2026) */
.prod-odonto-op { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin-top: 14px; }
.prod-odonto-op .prod-copiar { margin-top: 0; }
.prod-odonto-op .prod-copiar > span { align-content: start; }
@media (max-width: 640px) { .prod-odonto-op { grid-template-columns: 1fr; } }
.ctl-conj-selo { display: block; margin-top: 3px; font-size: .72rem; font-weight: 600; color: var(--accent); }
.ctl-conj { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin: 10px 0 0; padding: 10px 14px; border: 1px dashed var(--warn); border-radius: 10px; background: color-mix(in srgb, var(--warn) 6%, var(--surface)); }
.ctl-conj > span { display: grid; gap: 2px; }
.ctl-conj small { color: var(--muted); font-size: .78rem; }
.ctl-conj form.inline { margin: 0; flex: none; }
/* Para Conferir (Marco, 26/10/2026, Opção A): botão no topo da página com a lista de avisos; os mesmos avisos nas Notificações */
.pc { position: relative; }
.pc-btn { display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 10px 0 11px; border-radius: 10px; border: 1px solid color-mix(in srgb, var(--warn) 45%, var(--line)); background: var(--warn-soft); color: var(--warn); font: inherit; font-weight: 600; font-size: .86rem; cursor: pointer; white-space: nowrap; }
.pc-btn:hover, .pc.aberto .pc-btn { border-color: var(--warn); }
.pc-btn:focus-visible { outline: 2px solid var(--warn); outline-offset: 2px; }
.pc-btn svg, .pc-ic svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.pc-n { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 999px; background: var(--warn); color: #fff; display: inline-grid; place-items: center; font-size: .72rem; font-variant-numeric: tabular-nums; }
.pc-pop { position: absolute; right: 0; top: calc(100% + 8px); z-index: 40; width: min(420px, calc(100vw - 32px)); background: var(--surface); border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 18px 40px rgba(10, 40, 51, .16); overflow: hidden; text-align: left; }
.pc-cab { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; padding: 14px 16px 10px; }
.pc-cab b { font-size: .95rem; } .pc-cab small { color: var(--muted); font-size: .78rem; }
.pc-lista { list-style: none; margin: 0; padding: 0; }
.pc-it { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 16px; border-top: 1px solid var(--line); }
.pc-ic { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; background: var(--warn-soft); color: var(--warn); }
.pc-ic.info { background: var(--info-soft); color: var(--info); } .pc-ic.crit { background: var(--crit-soft); color: var(--crit); }
.pc-txt { min-width: 0; } .pc-txt b { display: block; font-size: .86rem; font-weight: 600; line-height: 1.3; }
.pc-txt small { display: block; color: var(--muted); font-size: .76rem; line-height: 1.35; margin-top: 2px; }
.ntf-sec { display: flex; align-items: center; gap: 8px; margin: 2px 0 8px; font-size: .68rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.ntf-sec span { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; background: var(--warn); color: #fff; display: inline-grid; place-items: center; letter-spacing: 0; }
.ntf-pc { margin-bottom: 14px; border: 1px solid var(--line); border-radius: 11px; overflow: hidden; }
.ntf-pc .ntf-sec { margin: 0; padding: 10px 12px; background: var(--surface-2); }
.ntf-pc .pc-it { padding: 10px 12px; }
.pc-acoes { display: flex; align-items: center; gap: 6px; }
.oc-texto { margin: 0 0 14px; font-size: .86rem; line-height: 1.5; }

/* Buscar em barra (Marco, 26/10/2026): campo no topo no modelo do print; o pop-up abre abaixo, à direita, como o das Notificações */
.busca-barra { display: flex; align-items: center; gap: 10px; width: clamp(220px, 26vw, 400px); height: 42px; padding: 0 10px 0 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); color: var(--muted); font: inherit; font-size: .9rem; cursor: text; text-align: left; }
.busca-barra svg { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.busca-barra span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.busca-barra kbd { flex: none; padding: 2px 7px; border: 1px solid var(--line); border-radius: 6px; font: inherit; font-size: .7rem; color: var(--muted); }
.busca-barra:hover { border-color: var(--accent); }
.busca-barra:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.modal-bg.busca-pop { background: transparent; place-items: start end; padding: calc(var(--topo-h) + 6px) 20px 16px; }
.dialogo-pop .modal.busca-modal { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - var(--topo-h) - 24px); border: 1px solid var(--line); box-shadow: 0 16px 40px rgba(10, 40, 51, .18); border-radius: 14px; }
@media (max-width: 760px) { .busca-barra { width: 38px; height: 38px; padding: 0; justify-content: center; } .busca-barra span, .busca-barra kbd { display: none; } .modal-bg.busca-pop { padding-inline: 10px; } }
/* Buscar: barra do pop-up mais baixa e texto menor (Marco, 26/10/2026) */
.busca-campo { gap: 10px; padding: 8px 10px 8px 14px; }
.busca-campo > svg { width: 18px; height: 18px; }
.busca-campo input { font-size: .9rem; padding: 4px 0; }
.busca-campo .btn-icone { width: 30px; height: 30px; }
.busca-campo .btn-icone svg { width: 15px; height: 15px; }
/* Sino e foto num bloco, em quadrados arredondados do mesmo tamanho, no modelo do print (Marco, 26/10/2026) */
.top-grupo { display: flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface-2); }
.top-grupo .agenda-btn.btn-icone { position: relative; width: 38px; height: 38px; border-radius: 12px; border: 0; background: var(--surface); }
.top-grupo .user-btn { padding: 0; gap: 0; border: 0; border-radius: 12px; }
.top-grupo .user-btn:hover, .top-grupo .user-btn:focus-visible { background: transparent; }
.top-grupo .user-btn:hover .avatar { box-shadow: inset 0 0 0 2px var(--dep); }
.top-grupo .avatar { width: 38px; height: 38px; border-radius: 12px; box-shadow: inset 0 0 0 1px var(--dep); }
.top-grupo .user-txt, .top-grupo .user-chev { display: none; }
.busca-barra { height: 48px; border-radius: 16px; }
@media (max-width: 760px) { .busca-barra { height: 38px; border-radius: 12px; } }
/* Topo alinhado aos blocos da página: mesma margem e mesma largura máxima da .view (Marco, 26/10/2026) */
.top { padding-inline: max(clamp(16px, 1.9vw, 32px), calc((100% - 1560px) / 2 + clamp(16px, 1.9vw, 32px))); }
@media (max-width: 760px) { .top { padding-inline: 16px; } }
/* Cor do departamento na foto do topo: borda por fora da foto, para a foto não cobrir a cor (Marco, 26/10/2026) */
.top-grupo .avatar, .top-grupo .user-btn:hover .avatar { box-sizing: border-box; border: 2px solid var(--dep); box-shadow: none; }
.top-grupo .user-btn:hover .avatar { box-shadow: 0 0 0 2px color-mix(in srgb, var(--dep) 30%, transparent); }
.top-grupo .avatar img { border-radius: 9px; }
/* Meu Perfil só leitura para quem não é administrador (Marco, 26/10/2026) */
.perfil-aviso { margin: 0; font-size: .82rem; color: var(--muted); }
/* Plano dos Titulares no Plano de Saúde (David, 26/10/2026): Geral X Individual, titular com "+ Dependente" e um contrato por companhia */
.plano-modo { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 4px; }
.tit-tabela { display: grid; gap: 10px; }
.tit-grupo[hidden], .tit-dep[hidden], .tit-plano-rot[hidden], .tit-plano-campos[hidden], .tit-cat[hidden], .tit-add[hidden], .ct-companhia[hidden], [data-ct-geral][hidden] { display: none; }
.tit-cab, .tit-linha, .tit-dep { display: grid; grid-template-columns: 18px minmax(0, 1.5fr) minmax(0, 1fr) minmax(0, 1fr) minmax(0, 1.3fr) minmax(0, 1fr) 30px; gap: 6px; align-items: start; }
.tit-cab { font-size: .72rem; font-weight: 600; }
.tit-cab .so-pj { display: block; }
.tit-grupo { display: grid; gap: 6px; padding: 8px; border: 1px solid var(--line); border-radius: 10px; }
.tit-grupo .field { min-width: 0; }
.tit-grupo .input, .tit-grupo .select { font-size: .84rem; padding: 6px 8px; }
.tit-grupo .err { font-size: .72rem; }
.tit-plano { display: flex; align-items: center; gap: 8px; padding-left: 24px; }
.tit-plano-rot { font-size: .74rem; font-weight: 600; color: var(--muted); }
.tit-plano-campos { flex: 1; display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 6px; }
.tit-add { margin-left: auto; }
.tit-dep { padding: 6px 0 0; border-top: 1px dashed var(--line); }
.tit-dep .dep-n { color: var(--accent); }
.tit-remover.btn-icone { width: 30px; height: 30px; }
.tit-remover svg { width: 14px; height: 14px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.ct-companhia { margin-top: 10px; padding: 10px 12px; border: 1px dashed var(--line); border-radius: 10px; }
.ct-titulo { margin: 0 0 8px; font-size: .9rem; }
.ct-titulo small { color: var(--muted); font-weight: 400; }
@media (max-width: 760px) {
  .tit-cab { display: none; }
  .tit-linha, .tit-dep { grid-template-columns: 1fr 1fr; }
  .tit-linha .dep-n, .tit-dep .dep-n { grid-column: 1 / -1; padding: 0; }
  .tit-linha .dep-nome, .tit-linha .dep-email, .tit-dep .dep-nome, .tit-dep .dep-email { grid-column: 1 / -1; }
  .tit-plano { flex-wrap: wrap; padding-left: 0; }
  .tit-plano-campos { flex-basis: 100%; grid-template-columns: 1fr; }
}

/* Novo Aviso de Sinistro em duas colunas, como a Movimentação (Marco, 27/10/2026, Opção A) */
.sv-op-a { grid-template-columns: minmax(0, 1fr) 430px; align-items: start; }
.sv-op-col { display: grid; gap: 20px; align-content: start; min-width: 0; }
@media (max-width: 1100px) { .sv-op-a { grid-template-columns: 1fr; } }

/* Selos dos gráficos de Produtos na cor do produto, como os gráficos (Marco, 27/10/2026) */
.g-prod-1 .g-destaque { color: #079A78; background: rgba(7, 154, 120, .12); }
.g-prod-2 .g-destaque { color: #2B6F9E; background: rgba(43, 111, 158, .12); }
.g-prod-3 .g-destaque { color: #0A2833; background: rgba(10, 40, 51, .10); }
[data-tema="escuro"] .g-prod-1 .g-destaque { color: #2FD5A9; background: rgba(8, 215, 165, .14); }
[data-tema="escuro"] .g-prod-2 .g-destaque { color: #8FB8DB; background: rgba(74, 139, 192, .2); }
[data-tema="escuro"] .g-prod-3 .g-destaque { color: #C9D7DB; background: rgba(201, 215, 219, .14); }
/* Nomes nas barras horizontais (Sinistralidade dos Clientes e outras) em preto, como no Top 10; sublinha ao passar o mouse (Marco, 27/10/2026) */
.hbar-l .lnk { color: var(--ink); }
/* Mesmo peso e tamanho dos nomes do Top 10 (Marco, 27/10/2026) */
.hbar-l, .hbar-l .lnk { font-size: .84rem; font-weight: 500; }
.hbar-l .lnk:hover, .hbar-l .lnk:focus-visible { color: var(--ink); text-decoration: underline; }

/* Aba Beneficiários da ficha: titular e dependentes logo abaixo, com Plano de Saúde e Tipo (Marco, 27/10/2026, Opção A) */
.fb-nome { display: flex; flex-direction: column; min-width: 0; }
.fb-plano { display: inline-block; border-radius: 999px; padding: 3px 10px; font-size: .78rem; font-weight: 600; color: #079A78; background: rgba(7, 154, 120, .12); white-space: nowrap; }
.fb-tab tr.fb-tit td { border-top: 1px solid var(--line); }
.fb-tab tr.fb-tit .lnk { font-weight: 600; }
.fb-tab tr.fb-dep td:first-child { padding-left: 34px; position: relative; }
.fb-tab tr.fb-dep td:first-child::before { content: "↳"; position: absolute; left: 14px; top: 10px; color: var(--muted); }
[data-tema="escuro"] .fb-plano { color: #2FD5A9; background: rgba(8, 215, 165, .14); }
/* Contratos da ficha (Marco, 27/10/2026): o logotipo da operadora sozinho, sem caixa nem fundo, no mesmo tamanho para todas;
   "+ Informações" e o "Não" da Coparticipação sem o fundo branco */
.ctl-op .op-selo:has(img) { width: 56px; height: 32px; border: 0; border-radius: 0; background: transparent; }
.ctl-op .op-selo:has(img) img { padding: 0; object-fit: contain; object-position: left center; }
.ctl-det .ctl-info { background: transparent; }
.ctl-det .ctl-info:hover { background: color-mix(in srgb, var(--surface) 55%, transparent); }
.ctl-det .tog.nao { background: transparent; }
/* Prévia da importação de clientes (Marco, 27/10/2026): linha de detalhe de Visualizar e Editar */
.pv-tabela tr.pv-detalhe > td { background: var(--surface-2, #f6f8f8); padding: 14px 16px; }
.pv-dados { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px 18px; margin: 0; }
.pv-dados dt { font-size: .72rem; color: var(--muted, #6b7a80); margin: 0; }
.pv-dados dd { margin: 2px 0 0; font-size: .86rem; overflow-wrap: anywhere; }
.pv-editar .field { margin: 0; }
.pv-editar .field label { font-size: .72rem; }
.pv-tabela tr.pv-detalhe .form-acoes { margin-top: 12px; }
.pv-cad { color: var(--muted, #6b7a80); }
@media (max-width: 900px) { .pv-dados { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Status da lista de Clientes abaixo de Ativo/Inativo (David, 27/10/2026): texto âmbar, leva ao pop-up que resolve */
a.cl-pend { display: block; width: max-content; margin-top: 4px; font-size: .74rem; font-weight: 600; color: var(--warn); text-decoration: none; }
a.cl-pend::before { content: ""; display: inline-block; width: 6px; height: 6px; border-radius: 50%; background: currentColor; margin-right: 5px; vertical-align: middle; }
a.cl-pend:hover { text-decoration: underline; }

/* Campo-armadilha do login contra robôs (segurança, David, 27/10/2026): fora da tela, sem sumir do formulário */
.campo-armadilha { position: absolute; left: -10000px; top: auto; width: 1px; height: 1px; overflow: hidden; }

/* Bloco "Para Você" do Aviso no editor da Comunicação (Marco, 28/10/2026): mesmo desenho tracejado do botão */
.cm-mail-bloco[hidden] { display: none; }
.cm-mail-bloco { display: grid; gap: 8px; padding: 10px; border: 1px dashed #CFDDDF; border-radius: 8px; margin-top: 8px; background: #F0F8F5; }
.cm-mail-bloco .field { margin: 0; }

/* Editor visual do e-mail na Comunicação, opção 1 do Marco (28/10/2026): texto editado no próprio e-mail (editor-email.js) */
.ee-tela { position: relative; }
.ee-arte img { display: block; width: 100%; height: auto; }
.ee-arte[hidden], [data-ee-sem-arte][hidden], .ee-fixo[hidden], .ee-barra[hidden], .ee-acoes[hidden], .ee-vars-menu[hidden], .ee-add [hidden] { display: none; }
.ee-corpo { min-height: 120px; padding: 6px; border-radius: 6px; border: 1px dashed transparent; font-family: Arial, Helvetica, sans-serif; font-size: .95rem; line-height: 1.6; color: #405957; outline: none; }
.ee-corpo:hover { border-color: #CFDDDF; }
.ee-corpo:focus-within { border-color: #079A78; background: #F6FBFA; }
.ee-corpo > * { margin: 0 0 12px; padding: 2px 4px; border-radius: 6px; }
.ee-corpo > .ee-ativo { box-shadow: 0 0 0 2px #10c9a8; }
.ee-corpo ul { padding-left: 26px; }
.ee-corpo li + li { margin-top: 4px; }
.ee-corpo b, .ee-corpo strong { color: #123f3c; }
.ee-corpo a { color: #079A78; text-decoration: underline; }
.ee-corpo hr { border: 0; border-top: 1px solid #d8ebe4; padding: 0; margin: 8px 0 16px; }
.ee-dest { background: #f0f8f5; border: 1px solid #d8ebe4; border-radius: 13px; padding: 14px 18px !important; }
.ee-dest p { margin: 0; }
.ee-dest .ee-dest-tit { color: #103f3c; font-size: 1.1rem; font-weight: 700; margin-bottom: 4px; }
.ee-var { display: inline-block; background: #DDF7EF; color: #08594a; border-radius: 5px; padding: 0 5px; font-family: var(--f-mono); font-size: .82em; font-weight: 600; line-height: 1.5; }
.cm-mail-corpo:has(.ee-fonte .invalid) .ee-corpo { border-color: var(--crit); }
.ee-fonte > .field > label, .ee-fonte textarea { position: absolute; width: 1px; height: 1px; min-height: 0; padding: 0; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.ee-fixo { margin: 10px 0 4px; background: #103f3c; border-radius: 13px; padding: 20px; text-align: center; color: #c4e4dc; font-size: .82rem; }
.ee-fixo b { display: block; color: #fff; font-size: 1.05rem; margin-bottom: 3px; }
.ee-add { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0 2px; }
.ee-add > span { font-size: .76rem; color: #5A6E75; }
.ee-add button { white-space: nowrap; border: 1px dashed #9fdcc9; background: #f6fcfa; color: #08594a; border-radius: 8px; padding: 5px 10px; font: inherit; font-size: .78rem; cursor: pointer; }
.ee-add button:hover, .ee-add button[aria-pressed="true"] { border-style: solid; background: #DDF7EF; }
.ee-barra { position: absolute; z-index: 30; display: flex; align-items: center; gap: 2px; background: #0A2833; border-radius: 9px; padding: 4px; box-shadow: 0 6px 18px rgba(10, 40, 51, .25); }
.ee-barra button, .ee-acoes button { border: 0; background: transparent; color: #fff; border-radius: 6px; padding: 5px 8px; font: inherit; font-size: .8rem; cursor: pointer; display: inline-flex; align-items: center; gap: 4px; }
.ee-barra button:hover { background: #079A78; }
.ee-barra svg, .ee-acoes svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.ee-sep { width: 1px; height: 18px; background: #2c4d57; margin: 0 3px; }
.ee-a-verde { color: #10c9a8; font-weight: 700; }
.ee-vars { position: relative; }
.ee-vars-menu { position: absolute; top: 34px; left: 0; display: grid; background: #fff; border: 1px solid var(--line); border-radius: 9px; padding: 4px; min-width: 230px; box-shadow: 0 6px 18px rgba(10, 40, 51, .18); }
.ee-vars-menu button { color: var(--ink); justify-content: space-between; width: 100%; font-family: var(--f-mono); }
.ee-vars-menu button:hover { background: var(--accent-soft); }
.ee-vars-menu small { color: var(--muted); font-family: var(--f-body); }
.ee-acoes { position: absolute; z-index: 25; display: flex; flex-direction: column; gap: 3px; }
.ee-acoes button { width: 28px; height: 28px; padding: 0; justify-content: center; background: #fff; color: #5A6E75; border: 1px solid var(--line); }
.ee-acoes button:hover { color: #079A78; border-color: #079A78; }
[data-tema="escuro"] .ee-corpo:focus-within { background: #fff; }

/* Envios automáticos da Comunicação (Marco, 28/10/2026): os três cartões e o histórico */
.au-sub { margin: 4px 0 14px; font-size: .84rem; }
.au-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; }
.au-card { border: 1px solid var(--line); border-radius: 12px; padding: 14px 16px; display: grid; gap: 10px; align-content: start; background: var(--surface); }
.au-card.desligado { background: var(--surface-2); }
.au-card-cab { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.au-card-cab b { font-family: var(--f-display); font-size: 1rem; }
.au-quando { margin: 0; font-size: .82rem; color: var(--muted); }
.au-dl { margin: 0; display: grid; gap: 6px; }
.au-dl div { display: grid; grid-template-columns: 110px minmax(0, 1fr); gap: 8px; font-size: .82rem; }
.au-dl dt { color: var(--muted); }
.au-dl dd { margin: 0; font-weight: 500; }
.au-card-rod { display: flex; gap: 8px; justify-content: flex-end; flex-wrap: wrap; }
.au-tabela td small { display: block; color: var(--muted); font-size: .76rem; }
.au-motivo { max-width: 280px; white-space: normal; }

/* Comunicação (Marco, 28/10/2026): busca do cliente, quadro dos envios automáticos e a logo no topo do Em Branco */
.cm-combo-sel { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); border: 0; opacity: 0; pointer-events: none; }
.field.invalid .cm-combo-in { border-color: var(--crit); }
.cm-envauto-esc { display: grid; gap: 12px; }
.cm-envauto-esc[hidden], .cm-envauto[hidden], [data-cm-auto-esconde][hidden] { display: none; }
.cm-envauto { border: 1px solid #b9ead9; background: var(--accent-soft); border-radius: 12px; padding: 14px 16px; display: grid; gap: 8px; }
.cm-envauto p { margin: 0; }
.cm-envauto-tag { font-size: .68rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: #08594a; }
.cm-envauto-quando { font-size: .82rem; color: var(--muted); }
.cm-envauto-hoje { font-size: .9rem; }
.cm-envauto-lista { margin: 0; padding-left: 18px; font-size: .82rem; display: grid; gap: 2px; max-height: 220px; overflow: auto; }
.cm-envauto-acoes { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 4px; }
.cm-envauto-acoes .btn svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.cm-mail-logo-img { display: block; width: 150px; max-width: 100%; height: auto; }
[data-tema="escuro"] .cm-envauto { background: #0E2A2A; border-color: #1d4d45; }
[data-tema="escuro"] .cm-envauto-tag { color: #5DCAA5; }

/* Aba Automáticos (Marco, 28/10/2026): a tarefa agendada está rodando? Verde funcionando, vermelho parada */
.au-tarefa { display: flex; align-items: center; gap: 12px; border: 1px solid #b9ead9; background: var(--accent-soft); border-radius: 12px; padding: 10px 14px; margin: 0 0 14px; }
.au-tarefa b { display: block; font-size: .9rem; }
.au-tarefa small { color: var(--muted); font-size: .8rem; }
.au-tarefa-luz { width: 12px; height: 12px; border-radius: 50%; background: #10c9a8; box-shadow: 0 0 0 4px rgba(16, 201, 168, .2); flex: none; }
.au-tarefa.parada { border-color: #f1b8b8; background: #fdecec; }
.au-tarefa.parada .au-tarefa-luz { background: var(--crit); box-shadow: 0 0 0 4px rgba(200, 40, 40, .15); }
[data-tema="escuro"] .au-tarefa { background: #0E2A2A; border-color: #1d4d45; }
[data-tema="escuro"] .au-tarefa.parada { background: #3a1616; border-color: #6b2a2a; }

/* Campo Cliente da Comunicação (Marco, 28/10/2026): lista de sugestões logo abaixo, enquanto digita */
.cm-combo { position: relative; display: block; }
.cm-combo-lista { position: absolute; z-index: 40; top: calc(100% + 4px); left: 0; right: 0; display: grid; max-height: 280px; overflow: auto; background: var(--surface); border: 1px solid var(--line); border-radius: 10px; padding: 4px; box-shadow: 0 8px 22px rgba(10, 40, 51, .14); }
.cm-combo-lista[hidden] { display: none; }
.cm-combo-lista [role="option"] { border: 0; background: none; text-align: left; font: inherit; font-size: .86rem; color: var(--ink); padding: 8px 10px; border-radius: 7px; cursor: pointer; }
.cm-combo-lista [role="option"]:hover, .cm-combo-lista [role="option"][aria-selected="true"] { background: var(--accent-soft); color: #08594a; }
.cm-combo-vazio { padding: 8px 10px; font-size: .84rem; color: var(--muted); }

/* Configurações (Marco, 28/10/2026): Parâmetros com os cartões de cada linha na mesma altura; Usuários com "Copiar os Acessos de" */
.par-grid { align-items: stretch; }
.par-card { align-content: start; }
.par-grid > .par-card:last-child:nth-child(odd) { grid-column: 1 / -1; }
.acesso-copiar { display: grid; gap: 4px; max-width: 420px; margin: 0 0 14px; }
.acesso-copiar label { font-weight: 600; font-size: .86rem; }

/* Pedidos do Marco (29/10/2026): tela do produtor, tipos de alteração no pop-up e setor/cargo/funções no Meu Perfil */
.pd-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; align-items: stretch; }
@media (max-width: 900px) { .pd-grid { grid-template-columns: minmax(0, 1fr); } }
.imp-alteracoes { grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); }
.imp-alteracoes [hidden] { display: none; }
.perfil-funcao { margin: 4px 0 12px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 16px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-2); }
.perfil-funcao div { display: grid; gap: 2px; }
.perfil-funcao dt { font-size: .74rem; color: var(--muted); }
.perfil-funcao dd { margin: 0; font-size: .88rem; font-weight: 500; }
.perfil-funcao .perfil-funcao-txt { grid-column: 1 / -1; }
.perfil-funcao .perfil-funcao-txt dd { font-weight: 400; line-height: 1.5; }

/* Alterações do cliente, opção A do Marco (29/10/2026): cartões do tipo no pop-up e a lista Em Andamento */
.alt-modal { width: min(760px, 94vw); }
.alt-modal .alt-tipos { grid-template-columns: repeat(auto-fit, minmax(104px, 1fr)); gap: 8px; margin: 6px 0 14px; }
.alt-card { position: relative; }
.alt-card[hidden] { display: none; }
.alt-card input { position: absolute; opacity: 0; pointer-events: none; }
.alt-card:has(input:checked) { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 15%, transparent); background: var(--accent-soft); }
.alt-card:has(input:focus-visible) { border-color: var(--accent); }
.alt-campos { margin-bottom: 12px; }
.alt-item { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 10px 2px; border-top: 1px solid var(--line); color: inherit; text-decoration: none; }
.alt-item:hover { background: var(--surface-2); }
.alt-item b { display: block; font-size: .88rem; }
.alt-item small { color: var(--muted); font-size: .78rem; }

/* Tela da Operadora/Seguradora (Marco, 29/10/2026): logotipo no painel Cadastro */
.op-logo-tela { max-height: 48px; max-width: 180px; object-fit: contain; }

/* Agenda só de consulta (Marco, 30/10/2026): a bolinha mostra a situação, sem clique */
.td-check.leitura, .td-check.leitura:hover { cursor: default; border-color: var(--line); color: #fff; }
.td-check.leitura.feito, .td-check.leitura.feito:hover { background: var(--accent); border-color: var(--accent); }
span.cal-num { cursor: default; }

/* Campo de senha com o olho para ver a digitação (Marco, 30/10/2026) */
.senha-caixa { position: relative; display: block; }
.senha-caixa .input { width: 100%; padding-right: 42px; }
.senha-olho { position: absolute; top: 50%; right: 6px; transform: translateY(-50%); width: 32px; height: 32px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--muted); cursor: pointer; }
.senha-olho:hover { background: var(--surface-2); color: var(--ink); }
.senha-olho[aria-pressed="true"] { color: var(--accent); }
.senha-olho svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* Tela de login, conforme a imagem do Marco (30/10/2026) */
.lg { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 44fr) minmax(0, 56fr); background: var(--surface); }
.lg-esq { display: grid; place-items: center; padding: 32px 20px 88px; }
.lg-cartao { width: min(290px, 100%); padding: 34px 26px 28px; background: var(--surface); border-radius: 26px; box-shadow: 0 18px 44px -14px rgba(10, 40, 51, .24), 0 2px 8px rgba(10, 40, 51, .05); display: flex; flex-direction: column; align-items: center; }
.lg-logo { width: 118px; height: auto; }
.lg-cartao h1 { margin: 24px 0 26px; font-size: 1.28rem; font-weight: 500; letter-spacing: -.01em; text-align: center; }
.lg-cartao h1 b { font-weight: 700; }
.lg-cartao .alerts { width: 100%; margin-bottom: 16px; }
.lg-form { width: 100%; display: flex; flex-direction: column; }
.lg-form .field { margin: 0 0 18px; }
.lg-form .field > label { font-size: 1.02rem; font-weight: 500; color: var(--ink); margin: 0; }
.lg-form .field > label > span { display: none; }
.lg-form .field .input { width: 100%; padding: 2px 2px 6px; border: 0; border-bottom: 1.5px solid var(--muted); border-radius: 0; background: transparent; box-shadow: none; font-size: .86rem; }
.lg-form .field .input:focus { outline: none; box-shadow: none; border-bottom-color: var(--accent); }
.lg-form .field.invalid .input { border-bottom-color: var(--crit); }
.lg-opcoes { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 10px; font-size: .72rem; }
.lg-manter { display: inline-flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 400; margin: 0; }
.lg-manter input { width: 14px; height: 14px; margin: 0; accent-color: var(--accent); }
.lg-opcoes a { color: var(--ink); text-decoration: none; }
.lg-opcoes a:hover { color: var(--accent); text-decoration: underline; }
.lg-recuperar { display: none; margin: 10px 0 0; padding: 8px 10px; border-radius: 8px; background: var(--accent-soft); color: var(--ink); font-size: .74rem; line-height: 1.35; }
.lg-recuperar:target { display: block; }
.lg-entrar { align-self: center; margin-top: 24px; min-width: 96px; padding: 7px 22px; border: 0; border-radius: 7px; color: #fff; font: 600 .95rem var(--f-body); cursor: pointer; background: linear-gradient(90deg, #0E4A55, #128C73); transition: filter .15s, transform .15s; }
.lg-entrar:hover { filter: brightness(1.12); transform: translateY(-1px); }
.lg-dir { display: flex; flex-direction: column; justify-content: center; gap: 14px; padding: 48px clamp(32px, 6vw, 80px) 88px; color: #fff; background: #0E4A55 url(../img/login-fundo.jpg) center / cover no-repeat; }
.lg-dir h2 { margin: 0 0 6px; max-width: 12em; color: #fff; font-size: clamp(2.2rem, 3.7vw, 3.1rem); line-height: 1.1; font-weight: 700; letter-spacing: -.01em; }
.lg-dir p { margin: 0; max-width: 29em; font-size: 1rem; line-height: 1.32; font-weight: 500; }
.lg-rodape { position: fixed; right: 84px; bottom: 28px; margin: 0; max-width: calc(56% - 110px); color: rgba(255, 255, 255, .78); font-size: .72rem; line-height: 1.35; text-align: right; }
.lg-whats { position: fixed; right: 22px; bottom: 18px; z-index: 3; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: #25D366; color: #fff; box-shadow: 0 8px 22px rgba(0, 0, 0, .28); transition: transform .15s; }
.lg-whats:hover { transform: scale(1.07); }
.lg-whats svg { width: 27px; height: 27px; fill: currentColor; }
@media (max-width: 860px) {
  .lg { grid-template-columns: minmax(0, 1fr); }
  .lg-dir { display: none; }
  .lg-esq { padding-bottom: 104px; }
  .lg-rodape { left: 18px; right: 84px; max-width: none; color: var(--muted); text-align: left; }
}

/* Login: cartão maior e rodapé no alinhamento do texto da direita (Marco, 30/10/2026) */
.lg-cartao { width: min(380px, 100%); padding: 42px 34px 34px; }
.lg-logo { width: 148px; }
.lg-cartao h1 { margin: 26px 0 30px; font-size: 1.5rem; }
.lg-form .field { margin-bottom: 22px; }
.lg-form .field > label { font-size: 1.08rem; }
.lg-form .field .input { padding: 4px 2px 8px; font-size: .92rem; }
.lg-opcoes { font-size: .8rem; }
.lg-manter input { width: 15px; height: 15px; }
.lg-recuperar { font-size: .8rem; }
.lg-entrar { min-width: 130px; margin-top: 28px; padding: 10px 28px; font-size: 1rem; }
.lg-rodape { left: calc(44% + clamp(32px, 6vw, 80px)); right: 84px; max-width: none; text-align: left; }
@media (max-width: 860px) {
  .lg-rodape { left: 18px; }
}

/* Login: boas-vindas e linha de confiança no cartão (Marco, 30/10/2026) */
.lg-cartao h1 { margin: 24px 0 6px; font-size: 1.42rem; line-height: 1.2; }
.lg-sub { margin: 0 0 26px; color: var(--muted); font-size: .92rem; text-align: center; }
.lg-confianca { display: flex; align-items: center; justify-content: center; gap: 6px; width: 100%; margin: 22px 0 0; padding-top: 14px; border-top: 1px solid var(--line); color: var(--muted); font-size: .76rem; }
.lg-confianca svg { width: 15px; height: 15px; fill: none; stroke: var(--accent); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.lg-esq { padding: 24px 20px; }
@media (max-width: 860px) { .lg-esq { padding-bottom: 104px; } }

/* Login: o olho da senha só aparece com algo digitado (Marco, 30/10/2026) */
.lg-form .senha-caixa .input { padding-right: 36px; }
.senha-caixa input:placeholder-shown + .senha-olho { display: none; }

/* Foto de perfil sem o contorno colorido, no topo e no Meu Perfil (Marco, 30/10/2026) */
.avatar, .avatar.grande, .top-grupo .avatar, .top-grupo .user-btn:hover .avatar { border: 0; box-shadow: none; }
.top-grupo .avatar img { border-radius: 12px; }
.top-grupo .user-btn:hover .avatar { opacity: .85; }

/* Login: troca da senha vencida (Marco, 30/10/2026) */
.lg-confianca a { color: var(--accent); text-decoration: none; }
.lg-confianca a:hover { text-decoration: underline; }
.lg-sub { overflow-wrap: anywhere; }