/* ══════════════════════════════════════════════════════════════
   PADRÃO DE TELA · classes pd-* + nivelamento global · 12/10/2026
   ══════════════════════════════════════════════════════════════
   Carregado por último (depois de uplift-refino e dos CSS de
   módulo). Duas partes:
   1. Componentes novos (pd-*) usados por core/padrao.js.
   2. Nivelamento: regras que valem para TODOS os módulos sem
      editar cada CSS (borda lateral, barra de filtros numa linha,
      placa em chip, números centralizados, cabeçalho de tabela,
      mapa neutro, cartão de KPI liso).
   ══════════════════════════════════════════════════════════════ */

/* ─── 1. Componentes ───────────────────────────────────────── */

/* ícone em traço */
.ico { display: inline-block; vertical-align: middle; flex-shrink: 0; }

/* placa em chip */
.pd-placa {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  background: #fff;
  border: 1.5px solid #2B2F36;
  border-radius: 5px;
  overflow: hidden;
  line-height: 1;
  box-shadow: 0 1px 1px rgba(0,0,0,.08);
  vertical-align: middle;
  white-space: nowrap;
}
.pd-placa::before {
  content: '';
  display: block;
  width: 100%;
  height: 4px;
  background: var(--primary);
}
html[data-brand="custom"] .pd-placa::before { background: var(--brand-primary); }
.pd-placa__num {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  color: #111;
  padding: 5px 8px 4px;
}
.pd-placa__suf { font-size: 10px; color: var(--sub); padding: 0 6px 4px; }
.pd-placa--mini .pd-placa__num { font-size: 11px; padding: 4px 6px 3px; }
.pd-placa--mini::before { height: 3px; }
.pd-placa--vazia { border-color: var(--borda); box-shadow: none; }
.pd-placa--vazia::before { background: var(--borda); }
/* sem anel em volta no hover: moldura extra parecia outra placa atrás (13/10/2026) */
tr:hover .pd-placa { border-color: var(--primary); }

/* leitura imediata: delta e número com cor */
.pd-delta, .pd-num { display: inline-flex; align-items: center; gap: 3px; font-variant-numeric: tabular-nums; font-weight: 600; }
.pd-delta small { font-weight: 400; color: var(--sub); margin-left: 3px; }
.pd-delta.is-pos, .pd-num.is-pos { color: var(--pos); }
.pd-delta.is-neg, .pd-num.is-neg { color: var(--neg); }
.pd-delta.is-neutro, .pd-num.is-neutro { color: var(--neu); }
.pd-delta .ico { stroke-width: 2.2; }

/* estado: ponto + texto */
.pd-estado { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 500; white-space: nowrap; }
.pd-estado i { width: 8px; height: 8px; border-radius: 50%; background: var(--muted); flex-shrink: 0; }
.pd-estado.is-ok i { background: var(--ok-dot); }
.pd-estado.is-atencao i { background: var(--warn-dot); }
.pd-estado.is-critico i { background: var(--crit-dot); }
.pd-estado.is-neutro { color: var(--sub); }

/* KPI liso */
.pd-kpis {
  display: grid;
  grid-template-columns: repeat(var(--pd-cols, 4), minmax(0, 1fr));
  gap: 12px;
}
.pd-kpi {
  background: var(--card);
  border: 1px solid var(--borda);
  border-radius: var(--radius-lg);
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  min-width: 0;
  color: inherit;
  text-decoration: none;
}
a.pd-kpi:hover { border-color: var(--primary); box-shadow: var(--shadow-md); }
.pd-kpi__top { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.pd-kpi__rotulo { font-size: 12px; font-weight: 500; color: var(--sub); line-height: 1.3; }
.pd-kpi__ico { color: var(--muted); }
.pd-kpi__linha { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.pd-kpi__valor {
  font-size: 26px;
  font-weight: 600;
  line-height: 1;
  letter-spacing: -.01em;
  font-variant-numeric: tabular-nums;
  color: var(--txt);
  display: inline-flex; align-items: baseline; gap: 5px;
  min-width: 0;
}
.pd-kpi__valor small { font-size: 13px; font-weight: 500; color: var(--sub); letter-spacing: 0; }
.pd-kpi.is-ok .pd-kpi__valor { color: var(--pos); }
.pd-kpi.is-atencao .pd-kpi__valor { color: var(--warn); }
.pd-kpi.is-critico .pd-kpi__valor { color: var(--neg); }
.pd-kpi__base { display: flex; align-items: center; gap: 8px; min-height: 16px; font-size: 12px; }
.pd-kpi__apoio { color: var(--sub); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pd-spark { color: var(--primary); flex-shrink: 0; opacity: .85; }
html[data-brand="custom"] .pd-spark { color: var(--brand-primary); }
@media (max-width: 1100px) { .pd-kpis { grid-template-columns: repeat(min(var(--pd-cols, 4), 2), minmax(0, 1fr)); } }
@media (max-width: 560px) { .pd-kpis { grid-template-columns: minmax(0, 1fr); } }

/* cabeçalho de seção */
.pd-sec { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; margin: 0 0 12px; }
.pd-sec h2 { font-size: 16px; font-weight: 600; }
.pd-sec p { font-size: 12.5px; color: var(--sub); margin-top: 2px; }
.pd-sec__acoes { display: flex; gap: 8px; align-items: center; }

/* barra de filtros: uma linha só */
.pd-filtros {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.pd-filtros > * { flex-shrink: 0; }
.pd-filtros .pd-filtros__fim { margin-left: auto; font-size: 12px; color: var(--sub); white-space: nowrap; }
.pd-filtros select, .pd-filtros input[type="search"], .pd-filtros input[type="text"], .pd-filtros input[type="month"], .pd-filtros input[type="date"] {
  height: 34px;
  border: 1px solid #D4D7DD;
  border-radius: var(--radius);
  background: #fff;
  padding: 0 10px;
  font-size: 13px;
  font-weight: 500;
  color: var(--txt);
}
.pd-chave { display: inline-flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 500; color: #374151; cursor: pointer; white-space: nowrap; user-select: none; }
.pd-chave input { position: absolute; opacity: 0; width: 0; height: 0; }
.pd-chave i { width: 30px; height: 18px; border-radius: 9px; background: #CBD0D6; position: relative; transition: background .15s; flex-shrink: 0; }
.pd-chave i::after { content: ''; position: absolute; left: 2px; top: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; transition: left .15s; }
.pd-chave input:checked + i { background: var(--primary); }
html[data-brand="custom"] .pd-chave input:checked + i { background: var(--brand-primary); }
.pd-chave input:checked + i::after { left: 14px; }

/* vazio de uma linha */
.pd-vazio {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px;
  border: 1px dashed var(--borda);
  border-radius: var(--radius);
  background: var(--bg-soft);
  color: var(--sub);
  font-size: 13px;
}
.pd-vazio .ico { color: var(--muted); }
.pd-vazio__acao { margin-left: auto; color: var(--primary); font-weight: 600; font-size: 13px; background: transparent; border: 0; text-decoration: none; padding: 0; }
.pd-vazio__acao:hover { text-decoration: underline; }

/* esqueleto */
.pd-skel { display: flex; flex-direction: column; gap: 12px; }
.pd-skel__t, .pd-skel__kpi, .pd-skel__l, .pd-skel__bloco {
  background: linear-gradient(90deg, #ECEEF1 25%, #F5F6F8 37%, #ECEEF1 63%);
  background-size: 400% 100%;
  animation: pdShimmer 1.4s ease infinite;
  border-radius: var(--radius);
}
.pd-skel__t { height: 22px; width: 220px; }
.pd-skel__kpi { height: 92px; }
.pd-skel__tab { display: flex; flex-direction: column; gap: 8px; }
.pd-skel__l { height: 36px; }
@keyframes pdShimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }

/* tabela padrão */
.pd-tabela-wrap { background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius-lg); overflow: hidden; }
.pd-tabela-wrap__rolagem { overflow: auto; max-height: var(--pd-tab-h, none); }
.pd-tabela { border-collapse: separate; border-spacing: 0; width: 100%; font-size: 13px; }
.pd-tabela th {
  position: sticky; top: 0; z-index: 2;
  background: var(--bg-soft);
  border-bottom: 1px solid var(--borda);
  padding: 9px 12px;
  font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase;
  color: var(--sub);
  text-align: center;
  white-space: nowrap;
}
.pd-tabela td { padding: 9px 12px; border-bottom: 1px solid var(--borda-soft); text-align: center; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pd-tabela th:first-child, .pd-tabela td:first-child { text-align: left; position: sticky; left: 0; background: var(--card); z-index: 1; }
.pd-tabela th:first-child { background: var(--bg-soft); z-index: 3; }
.pd-tabela td.txt, .pd-tabela th.txt { text-align: left; white-space: normal; }
.pd-tabela tbody tr:hover td { background: #F8F9FA; }
.pd-tabela tfoot td { font-weight: 600; background: var(--bg-soft); border-top: 1px solid var(--borda); }
.pd-tabela .pos { color: var(--pos); font-weight: 600; }
.pd-tabela .neg { color: var(--neg); font-weight: 600; }
.pd-tabela__rodape { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--borda-soft); font-size: 12px; color: var(--sub); }

/* mapa neutro */
.pd-mapa { position: relative; background: #EDEFF1; border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--borda); }
.pd-mapa__legenda { display: flex; gap: 12px; flex-wrap: wrap; font-size: 12px; font-weight: 500; }
.pd-mapa__legenda i { width: 10px; height: 10px; border-radius: 50%; display: inline-block; border: 2px solid #fff; box-shadow: 0 0 0 1px currentColor; margin-right: 5px; vertical-align: -1px; }
.pd-mapa__cartao {
  position: absolute; right: 12px; top: 12px; z-index: 500;
  background: #fff; border: 1px solid var(--borda); border-radius: var(--radius);
  padding: 10px 12px; box-shadow: var(--shadow-md); min-width: 190px; font-size: 12px;
  display: flex; flex-direction: column; gap: 6px;
}

/* paleta de comandos (Ctrl+K) */
/* 1.x novidades · aviso único por versão (core/novidades.js) */
.pd-novidades { position: fixed; inset: 0; background: rgba(16,24,40,.46); z-index: var(--z-modal); display: flex; align-items: center; justify-content: center; padding: 20px; }
.pd-novidades__box { width: 100%; max-width: 640px; max-height: calc(100vh - 40px); overflow: auto; background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius-xl, 12px); box-shadow: 0 20px 60px rgba(17,24,39,.18); display: flex; flex-direction: column; }
.pd-novidades__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 22px 24px 16px; border-bottom: 1px solid var(--borda-soft); }
.pd-novidades__kicker { font-size: 11px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--primary); margin-bottom: 6px; }
.pd-novidades__head h2 { margin: 0 0 6px; font-family: var(--font-display); font-size: 20px; font-weight: 600; color: var(--txt); }
.pd-novidades__head p { margin: 0; font-size: 13.5px; color: var(--sub); line-height: 1.45; }
.pd-novidades__x { width: 32px; height: 32px; flex: none; display: grid; place-items: center; border: 1px solid transparent; border-radius: var(--radius-sm); background: transparent; color: var(--muted); cursor: pointer; }
.pd-novidades__x:hover { color: var(--txt); background: var(--bg); border-color: var(--borda); }
.pd-novidades__lista { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; }
.pd-novidades__item { display: flex; gap: 12px; padding: 14px 24px; border-bottom: 1px solid var(--borda-soft); }
.pd-novidades__item:nth-child(odd) { border-right: 1px solid var(--borda-soft); }
.pd-novidades__ico { width: 34px; height: 34px; flex: none; display: grid; place-items: center; border-radius: var(--radius); background: var(--bg); border: 1px solid var(--borda-soft); color: var(--primary); }
.pd-novidades__item b { display: block; font-size: 14px; font-weight: 600; color: var(--txt); margin-bottom: 3px; }
.pd-novidades__item p { margin: 0; font-size: 12.5px; color: var(--sub); line-height: 1.45; }
.pd-novidades__foot { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 14px 24px 18px; font-size: 12.5px; color: var(--sub); }
.pd-novidades__foot .btn { flex: none; }
@media (max-width: 640px) {
  .pd-novidades__lista { grid-template-columns: 1fr; }
  .pd-novidades__item:nth-child(odd) { border-right: 0; }
  .pd-novidades__foot { flex-direction: column; align-items: stretch; }
}

.pd-pal-overlay { position: fixed; inset: 0; background: rgba(16,24,40,.42); z-index: var(--z-modal); display: flex; align-items: flex-start; justify-content: center; padding-top: 12vh; }
.pd-pal { width: min(640px, calc(100vw - 32px)); background: var(--card); border-radius: var(--radius-xl); box-shadow: var(--shadow-lg); overflow: hidden; border: 1px solid var(--borda); }
.pd-pal__campo { display: flex; align-items: center; gap: 10px; padding: 0 14px; border-bottom: 1px solid var(--borda); color: var(--sub); }
.pd-pal__campo input { flex: 1; height: 50px; border: 0; outline: none; font-size: 16px; color: var(--txt); background: transparent; }
.pd-pal__campo kbd { font-family: var(--font-mono); font-size: 10.5px; padding: 2px 6px; border: 1px solid var(--borda); border-radius: 4px; color: var(--sub); }
.pd-pal__lista { max-height: 50vh; overflow: auto; padding: 6px; }
.pd-pal__grupo { font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 10px 10px 4px; }
.pd-pal__item { display: flex; align-items: center; gap: 12px; padding: 9px 10px; border-radius: var(--radius); text-decoration: none; color: var(--txt); font-size: 14px; cursor: pointer; }
.pd-pal__item .ico { color: var(--sub); }
.pd-pal__item small { color: var(--sub); font-size: 12px; margin-left: auto; white-space: nowrap; }
.pd-pal__item.is-ativo, .pd-pal__item:hover { background: var(--bg); }
.pd-pal__item.is-ativo { background: var(--primary-soft); color: var(--primary); }
html[data-brand="custom"] .pd-pal__item.is-ativo { background: color-mix(in srgb, var(--brand-primary) 10%, transparent); color: var(--brand-primary); }
.pd-pal__vazio { padding: 24px; text-align: center; color: var(--sub); font-size: 13px; }

/* ─── 2. Nivelamento global ────────────────────────────────── */

/* 2.1 nenhuma borda lateral colorida em cartão ou KPI */
.portal-card, .kpi-card, .af-card, .cpkj-hcard, .sse-hcard, .est-kpi, [class*="est-posto-card--"], .fontes__card,
.recon__kpi-err, .recon__card, .apres-stat, .apres-pre-stat-big, .apres-ritmo__card, .dfr-kpi--nota, [class*="dsv-card--"],
[class$="-saldo-card"], [class*="-saldo-card "], [class*="-saldo-card--"], [class*="-perf-card--"], [class$="-aud-card"], [class*="-aud-card "], .gmed-kpi, .gmghp-kpi, .gmip-kpi, .gmjrp-kpi, .gmprp-kpi,
.dr-kpi, .saldo-card, .cx-kpi, .cx-kpi--dif, .cx-saude__card, .dist-status-info, .prd-card, .plk-card, .cmp-kpi, .trn-kpi,
.rd-kpi, .di-kpi, .gf-kpi, .lc-kpi, .af-kpi, .gm-kpi, .cpkj-kpi, .cx-insight-card, [class*="vg-giro__item--"], .kpi.accent,
.kpi.gold, .kpi.crit, .kpi.warn, .kpi.info, .kpi.ok {
  border-left-width: 1px !important;
  border-left-color: var(--borda) !important;
  border-left-style: solid !important;
}
/* o seletor acima casa só o cartão, nunca o filho (`__vs`, `__meta`): filho de cartão não tem borda */
[class*="-saldo-card__"], [class*="-perf-card__"], [class*="-aud-card__"] { border-left: 0 !important; }
.portal-card::before, .kpi-card::before, .portal-card::after { display: none !important; }
/* brilho dourado de canto nos cabeçalhos (fb-ds.css §14) e botões-link sem sublinhado */
.dash-hero::before, .cli-hero::before, .recon__hero::before, .recon__recibo::before { display: none !important; }
a.btn, a.btn:hover { text-decoration: none; }
.portal-card, .kpi-card { border-radius: var(--radius-lg) !important; box-shadow: none !important; transform: none !important; }
.portal-card:hover, .kpi-card:hover { transform: none !important; box-shadow: none !important; }


/* 2.1b: a varredura dos seletores de módulo com borda esquerda ≥3px passou para JS
   (core/desemoji.js → nivelarBordas): troca pela cor da borda do próprio cartão, ou zera
   quando o cartão não tem borda, sem recriar moldura onde o módulo tinha tirado. */

/* 2.2 cartões de leitura consultiva saem da tela (regra da casa) */
.fr-leitura, .vg-leitura, .recon__leitura-box, .recon__leitura, .dfc-insights, .dfc-insight, .pnc-insights, .cx-insights, .cx-insight, .cx-insight-card, .neg-insight,
.sv-leitura, .sv-insight, .sv-guia, .dre-guia, .rd-guia, .dsv-leitura, .cv-nota--leitura, .af-regua-leitura, .fr-leitura--dw, .vg-leitura--dw, .fbd-insight, .dr-leitura { display: none !important; }

/* 2.3 barra de filtros: uma linha, nunca duas */
.cxa-filtros, .cv-filtros, .cpkj-filtros, .cmp-filtros, .trn-filtros, .dfc-filtros, .rd-fbar, .rd-filtros, .di-fbar, .di-fbar2,
.di-toolbar, .fr-filtros, .gf-filtros, .gmed-ctrls, .gmghp-ctrl, .gmip-ctrl, .gmjrp-ctrl, .gmrlp-ctrls, .mad-filtros, .mad-barra,
.pgat-filtros, .trg-filtros, .pgat-barra, .trg-barra, .tgat-filtros, .tgat-barra, .sv-filtros, .sse-filtros, .vg-fbar, .vg-filtros, .aprod-filtros,
.af-barra, .af-grid-filtros, .adij-d-filtros, .adij-req-filtros, .cx-filtros, .cx-evol__filtros, .abast-toolbar, .neg-toolbar,
.est-hist-toolbar, .cham-filtros, .plano__toolbar, .apres-filters, .recon__aud-bar-filtros, .prd-eo-filtros, .om__barra, .barra-ferr {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow-x: auto;
  overflow-y: visible;
  scrollbar-width: thin;
}
.cxa-filtros > *, .cv-filtros > *, .cpkj-filtros > *, .cmp-filtros > *, .trn-filtros > *, .dfc-filtros > *, .rd-fbar > *, .rd-filtros > *,
.di-fbar > *, .di-fbar2 > *, .di-toolbar > *, .fr-filtros > *, .gf-filtros > *, .gmed-ctrls > *, .gmghp-ctrl > *, .gmip-ctrl > *,
.gmjrp-ctrl > *, .gmrlp-ctrls > *, .mad-filtros > *, .mad-barra > *, .pgat-filtros > *, .trg-filtros > *, .pgat-barra > *, .trg-barra > *, .tgat-filtros > *,
.tgat-barra > *, .sv-filtros > *, .sse-filtros > *, .vg-fbar > *, .vg-filtros > *, .aprod-filtros > *, .af-barra > *,
.af-grid-filtros > *, .adij-d-filtros > *, .adij-req-filtros > *, .cx-filtros > *, .cx-evol__filtros > *, .abast-toolbar > *,
.neg-toolbar > *, .est-hist-toolbar > *, .cham-filtros > *, .plano__toolbar > *, .apres-filters > *, .recon__aud-bar-filtros > *,
.prd-eo-filtros > *, .om__barra > *, .barra-ferr > * { flex: 0 0 auto; }
/* quando a linha não cabe, quem cede é a lista (select, campo com rótulo, dropdown do desempenho),
   nunca o botão: a lista encolhe até 118px (a mais larga cede primeiro) e o texto dela ganha reticências. Sem isso o Diário do
   Desempenho (4 listas de 190px) e Negociações do Diesel (7 campos) escondiam o fim da barra na rolagem. */
:is(.cxa-filtros, .cv-filtros, .cpkj-filtros, .cmp-filtros, .trn-filtros, .dfc-filtros, .rd-fbar, .rd-filtros, .di-fbar, .di-fbar2,
.di-toolbar, .fr-filtros, .gf-filtros, .gmed-ctrls, .gmghp-ctrl, .gmip-ctrl, .gmjrp-ctrl, .gmrlp-ctrls, .mad-filtros, .mad-barra,
.pgat-filtros, .trg-filtros, .pgat-barra, .trg-barra, .tgat-filtros, .tgat-barra, .sv-filtros, .sse-filtros, .vg-fbar, .vg-filtros, .aprod-filtros,
.af-barra, .af-grid-filtros, .adij-d-filtros, .adij-req-filtros, .cx-filtros, .cx-evol__filtros, .abast-toolbar, .neg-toolbar,
.est-hist-toolbar, .cham-filtros, .plano__toolbar, .apres-filters, .recon__aud-bar-filtros, .prd-eo-filtros, .om__barra, .barra-ferr) > :is(select, .dsmp-ms, .dsmp-sel, .dsmp-fper, .cx-field, .vg-field, label:has(> select), [class*="-field"], [class*="__campo"]) {
  flex: 0 1 auto !important; min-width: 118px; max-width: 100%;
}
:is(.cxa-filtros, .cv-filtros, .cpkj-filtros, .cmp-filtros, .trn-filtros, .dfc-filtros, .rd-fbar, .rd-filtros, .di-fbar, .di-fbar2,
.di-toolbar, .fr-filtros, .gf-filtros, .gmed-ctrls, .gmghp-ctrl, .gmip-ctrl, .gmjrp-ctrl, .gmrlp-ctrls, .mad-filtros, .mad-barra,
.pgat-filtros, .trg-filtros, .pgat-barra, .trg-barra, .tgat-filtros, .tgat-barra, .sv-filtros, .sse-filtros, .vg-fbar, .vg-filtros, .aprod-filtros,
.af-barra, .af-grid-filtros, .adij-d-filtros, .adij-req-filtros, .cx-filtros, .cx-evol__filtros, .abast-toolbar, .neg-toolbar,
.est-hist-toolbar, .cham-filtros, .plano__toolbar, .apres-filters, .recon__aud-bar-filtros, .prd-eo-filtros, .om__barra, .barra-ferr) > :is(.dsmp-ms, .dsmp-sel, .cx-field, .vg-field, label:has(> select)) > :is(select, button, input, .dsmp-ms__btn) {
  width: 100% !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
:is(.cxa-filtros, .cv-filtros, .cpkj-filtros, .cmp-filtros, .trn-filtros, .dfc-filtros, .rd-fbar, .rd-filtros, .di-fbar, .di-fbar2,
.di-toolbar, .fr-filtros, .gf-filtros, .gmed-ctrls, .gmghp-ctrl, .gmip-ctrl, .gmjrp-ctrl, .gmrlp-ctrls, .mad-filtros, .mad-barra,
.pgat-filtros, .trg-filtros, .pgat-barra, .trg-barra, .tgat-filtros, .tgat-barra, .sv-filtros, .sse-filtros, .vg-fbar, .vg-filtros, .aprod-filtros,
.af-barra, .af-grid-filtros, .adij-d-filtros, .adij-req-filtros, .cx-filtros, .cx-evol__filtros, .abast-toolbar, .neg-toolbar,
.est-hist-toolbar, .cham-filtros, .plano__toolbar, .apres-filters, .recon__aud-bar-filtros, .prd-eo-filtros, .om__barra, .barra-ferr) > select { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* barra com 10 ou mais itens não é filtro, é formulário (Cotação de Frete: perfil, rota, origem,
   destino, km, ida e volta, pedágio, ICMS, salvar): essa quebra linha, senão vira rolagem com campo escondido */
.cxa-filtros:has(> :nth-child(10)), .cv-filtros:has(> :nth-child(10)), .dfc-filtros:has(> :nth-child(10)), .fr-filtros:has(> :nth-child(10)),
.vg-filtros:has(> :nth-child(10)), .vg-fbar:has(> :nth-child(10)), .sv-filtros:has(> :nth-child(10)), .sse-filtros:has(> :nth-child(10)),
.tgat-filtros:has(> :nth-child(10)), .pgat-filtros:has(> :nth-child(10)), .trg-filtros:has(> :nth-child(10)), .mad-filtros:has(> :nth-child(10)), .cx-filtros:has(> :nth-child(10)),
.gmed-ctrls:has(> :nth-child(10)), .cham-filtros:has(> :nth-child(10)), .aprod-filtros:has(> :nth-child(10)), .af-barra:has(> :nth-child(10)),
.gf-filtros:has(> :nth-child(10)), .rd-filtros:has(> :nth-child(10)), .di-toolbar:has(> :nth-child(10)), .abast-toolbar:has(> :nth-child(10)),
.neg-toolbar:has(> :nth-child(10)), .plano__toolbar:has(> :nth-child(10)), .om__barra:has(> :nth-child(10)), .barra-ferr:has(> :nth-child(10)) {
  flex-wrap: wrap !important; overflow: visible !important; row-gap: 8px;
}
/* o campo de busca é o que cede espaço; listas encolhem até o texto, nunca somem */
.cmp-filtros > input[type="search"], .cmp-filtros > input[type="text"], .cmp-filtros > .dsmp-ms-search,
.cxa-filtros > input, .cv-filtros > input, .dfc-filtros > input, .fr-filtros > input, .vg-filtros > input, .sv-filtros > input, .sse-filtros > input,
.tgat-filtros > input, .pgat-filtros > input, .trg-filtros > input, .mad-filtros > input, .cx-filtros > input, .gmed-ctrls > input, .cham-filtros > input,
.cx-filtros > .cx-field--grow, .cx-filtros > .neg-filtros__busca { flex: 1 1 140px !important; min-width: 110px !important; max-width: 100% !important; }
.cx-filtros .cx-field input, .cx-filtros .cx-field select { width: 100%; min-width: 0; }
.cmp-filtros > select, .cmp-filtros > .dsmp-ms, .cmp-filtros > .dsmp-sel { flex: 0 0 auto !important; max-width: 220px; }

/* 2.4 placa em chip: chips já existentes nos módulos ficam idênticos ao padrão */
.pla, .cv-placa, .mad-placa, .pgat-placa, .trg-placa, .tgat-placa, .plk-placa, .pab .placa, .cad-placa {
  display: inline-block;
  position: relative;
  background: #fff !important;
  border: 1.5px solid #2B2F36 !important;
  border-radius: 5px !important;
  padding: 8px 8px 4px !important;
  line-height: 1 !important;
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  letter-spacing: .06em !important;
  color: #111 !important;
  white-space: nowrap;
  box-shadow: 0 1px 1px rgba(0,0,0,.08) !important;
  overflow: hidden;
}
.pla::before, .cv-placa::before, .mad-placa::before, .pgat-placa::before, .trg-placa::before, .tgat-placa::before, .plk-placa::before, .pab .placa::before, .cad-placa::before {
  content: ''; position: absolute; left: 0; right: 0; top: 0; height: 4px;
  background: var(--primary); border-radius: 0;
}
html[data-brand="custom"] .pla::before, html[data-brand="custom"] .cv-placa::before, html[data-brand="custom"] .mad-placa::before,
html[data-brand="custom"] .pgat-placa::before, html[data-brand="custom"] .trg-placa::before, html[data-brand="custom"] .tgat-placa::before, html[data-brand="custom"] .plk-placa::before,
html[data-brand="custom"] .pab .placa::before, html[data-brand="custom"] .cad-placa::before { background: var(--brand-primary); }

/* 2.5 tabelas: números centralizados, cabeçalho inteligente uniforme */
th.num, td.num, .num, [data-num] { text-align: center !important; font-variant-numeric: tabular-nums; }
.gmed-aud-th { display: inline-flex; align-items: center; gap: 4px; font-size: 10.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--sub); white-space: nowrap; }
/* tabela "fixa" da Auditoria (19 colunas em 1.224px cortava Data, Motorista, Litros e Situação com reticências):
   passa a dimensionar pelo conteúdo e rolar na horizontal dentro do cartão. Nada cortado. */
.gmedia .gmed-aud-scroll { overflow-x: auto !important; scrollbar-width: thin; }
.gmedia .gmed-aud-tab--fixa { table-layout: auto !important; width: max-content !important; min-width: 100% !important; }
.gmedia .gmed-aud-tab--fixa th, .gmedia .gmed-aud-tab--fixa td { overflow: visible !important; text-overflow: clip !important; max-width: none !important; }
.gmed-aud-th__lbl { cursor: pointer; }
.gmed-aud-th__lbl:hover { color: var(--txt); }
.gmed-aud-th__f { width: 20px; height: 20px; border-radius: 5px; border: 0; background: transparent; color: var(--muted); display: inline-flex; align-items: center; justify-content: center; }
.gmed-aud-th__f:hover { background: var(--bg); color: var(--txt); }
.gmed-aud-th__f.is-on { color: var(--primary); background: var(--primary-soft); }
.gmed-aud-pop { background: #fff; border: 1px solid var(--borda); border-radius: var(--radius-lg); box-shadow: var(--shadow-lg); padding: 10px; min-width: 244px; z-index: var(--z-dropdown); font-size: 13px; }
.gmed-aud-pop__tit { font-size: 11px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; color: var(--sub); margin-bottom: 8px; }
.gmed-aud-pop__busca input, .gmed-aud-pop input[type="text"], .gmed-aud-pop input[type="number"] { width: 100%; height: 32px; border: 1px solid #D4D7DD; border-radius: var(--radius); padding: 0 10px; font-size: 13px; margin-bottom: 6px; }
.gmed-aud-pop__lista { max-height: 220px; overflow: auto; display: flex; flex-direction: column; gap: 2px; }
.gmed-aud-pop__item { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 6px; cursor: pointer; }
.gmed-aud-pop__item:hover { background: var(--bg); }
.gmed-aud-pop__acoes { display: flex; justify-content: flex-end; gap: 6px; margin-top: 8px; }
.gmed-aud-pop__acoes button { height: 30px; padding: 0 12px; border-radius: var(--radius); border: 1px solid var(--borda); background: #fff; font-size: 12.5px; font-weight: 500; }
.gmed-aud-pop__acoes button.is-primary { background: var(--primary); border-color: var(--primary); color: #fff; }
.fb-pag { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 14px; font-size: 12px; color: var(--sub); }
.fb-pag__nav { display: flex; gap: 4px; }
.fb-pag__btn { min-width: 28px; height: 28px; padding: 0 8px; border-radius: 6px; border: 1px solid var(--borda); background: #fff; font-size: 12px; color: var(--txt); }
.fb-pag__btn.is-on { background: var(--primary); border-color: var(--primary); color: #fff; }
.fb-pag__gap { padding: 0 4px; }

/* 2.6 mapa: fundo neutro, marcadores em destaque */
.leaflet-tile-pane { filter: saturate(.3) brightness(1.03) contrast(.96); }
.leaflet-control-zoom a { border-radius: 6px !important; font-family: var(--font-ui) !important; }
.leaflet-popup-content-wrapper { border-radius: var(--radius-lg) !important; box-shadow: var(--shadow-lg) !important; font-family: var(--font-ui) !important; }
.marker-cluster { background: color-mix(in srgb, var(--primary) 22%, transparent) !important; }
.marker-cluster div { background: var(--primary) !important; color: #fff !important; font: 600 12px var(--font-ui) !important; }
html[data-brand="custom"] .marker-cluster { background: color-mix(in srgb, var(--brand-primary) 22%, transparent) !important; }
html[data-brand="custom"] .marker-cluster div { background: var(--brand-primary) !important; }

/* 2.7 tipografia dos módulos: títulos em Barlow 600, sem condensada e sem caixa alta forçada em h1 */
.content h1, .content h2, .content h3 { font-family: var(--font-display); font-weight: 600; letter-spacing: 0; }
/* título de tela e de cartão sempre na cor do texto: 25 módulos pintavam o h4 do cartão na cor da marca
   (verde na Print, azul na SE, laranja na GAT). Estado fica no número e no chip, não no título. */
.content :is(h1, h2, h3, h4):not(.pd-kpi *):not(.ui-vazio *):not([class*="apres"] *):not([class*="slide"] *):not([class*="capa"] *):not(.pd-novidades *) { color: var(--txt) !important; }
/* título de cartão em div (cx-h3 do diesel/dfc/caixa/compras/prod-motorista/painel-controle): mesma regra,
   e sem caixa alta: é título, não legenda */
.content .cx-h3, .content [class*="__title"]:not(th):not(.pd-kpi *), .content [class*="-title"]:not(th):not(.pd-kpi *), .content [class*="__titulo"]:not(.pd-kpi *) { color: var(--txt) !important; }
.content .cx-h3 { text-transform: none !important; letter-spacing: 0 !important; font-size: 15px !important; font-weight: 600 !important; }
.content .cx-h3 .cx-h3-sub { text-transform: none; letter-spacing: 0; font-weight: 400; color: var(--sub) !important; font-size: 12.5px; }
/* título de tela fora do .dash-hero (Mapa de Ocorrências da Segurança): mesmo tamanho e cor dos demais */
.content .sv-mapa-head h2, .content .sv-root > h2:first-child { color: var(--txt) !important; font-size: 20px !important; }

/* 2.8 texto não corta: títulos de cartão quebram linha */
.content .portal-card .pc-label, .content .pd-kpi__rotulo { white-space: normal; }

/* 2.9 drawer e modal: raio e sombra do padrão */
.fb-drawer, .drawer, .modal { border-radius: var(--radius-xl); }

/* 2.9a células niveladas pelo shell (core/desemoji.js): número centralizado, placa em chip */
.content td.is-num { text-align: center !important; font-variant-numeric: tabular-nums; white-space: nowrap; }
.content td.pd-placa-cel { text-align: center !important; white-space: nowrap; }
/* chip herdado de módulo: zera o visual do módulo (fundo cinza, padding) e usa o padrão */
.pd-placa--herdada {
  display: inline-flex !important; flex-direction: column !important; width: auto !important; height: auto !important; min-width: 0 !important; min-height: 0 !important;
  padding: 0 !important; margin: 0 3px 2px 0 !important; border-radius: 5px !important; border: 1.5px solid #2B2F36 !important; box-shadow: 0 1px 1px rgba(0,0,0,.08) !important;
  background: #fff !important; color: var(--txt) !important; font: inherit !important; line-height: 1 !important; letter-spacing: 0 !important; text-decoration: none !important; text-transform: none !important; overflow: hidden !important;
}
.pd-placa--herdada::after { display: none !important; }
.pd-placa--herdada::before { position: static !important; width: 100% !important; height: 3px !important; border-radius: 0 !important; content: '' !important; display: block !important; background: var(--primary) !important; }
html[data-brand="custom"] .pd-placa--herdada::before { background: var(--brand-primary) !important; }
.content th.is-num { text-align: center !important; }
/* primeira coluna de texto (nome, parâmetro, conta) lê da esquerda; número e placa continuam centrados */
.content table > tbody > tr > td:first-child:not(.is-num):not(.num):not(.pd-placa-cel):not([data-num]),
.content table > thead > tr > th:first-child:not(.is-num):not(.num):not([data-num]) { text-align: left !important; }
.content table > tbody > tr > td:first-child:not(.is-num):not(.num):not(.pd-placa-cel):not([data-num]) > :is(b, strong, small, div, p) { text-align: left !important; }
/* quando a primeira coluna é posição (#), a segunda é a coluna de texto: mesma leitura da esquerda, sem reticência */
.content table > tbody > tr > td:first-child:is(.is-num, .num) + td:not(.is-num):not(.num):not(.pd-placa-cel):not([data-num]),
.content table > thead > tr > th:first-child:is(.is-num, .num) + th:not(.is-num):not(.num):not([data-num]) { text-align: left !important; min-width: 200px; }
.content table > tbody > tr > td:first-child:is(.is-num, .num) + td:not(.is-num):not(.num):not(.pd-placa-cel):not([data-num]) > :is(b, strong, small, div, p) { text-align: left !important; }
.content table > tbody > tr > td:first-child:not(.is-num):not(.num):not(.pd-placa-cel) :is(small, .sub, [class*="__sub"]),
.content table > tbody > tr > td:first-child:is(.is-num, .num) + td:not(.is-num):not(.num):not(.pd-placa-cel) :is(small, .sub, [class*="__sub"]) { white-space: normal !important; overflow: visible !important; text-overflow: clip !important; max-width: none !important; }

/* 2.9b ícone no lugar de emoji dentro de texto (core/desemoji.js) */
svg.ico--texto { display: inline-block; vertical-align: -3px; margin: 0 3px 0 0; flex-shrink: 0; }
.ui-vazio__ico svg.ico--texto, .hub-vazio__ico svg.ico--texto { width: 22px; height: 22px; }

/* 2.10 cabeçalho de tela (.dash-hero, usado em ~45 telas): deixa de ser um bloco
   escuro com gradiente e vira o título da página, plano e claro. Os módulos
   pintam com seletor composto (.aprod .dash-hero), por isso o !important. */
.content .dash-hero {
  background: transparent !important;
  color: var(--txt) !important;
  box-shadow: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 2px 0 12px !important;
  margin: 0 0 14px !important;
  border-bottom: 1px solid var(--borda) !important;
  overflow: visible !important;
}
.content .dash-hero .eyebrow { color: var(--muted) !important; font-size: 11px !important; font-weight: 600; letter-spacing: .08em !important; text-transform: uppercase; opacity: 1 !important; }
.content .dash-hero h2 { color: var(--txt) !important; font-size: 20px !important; font-weight: 600 !important; margin: 2px 0 0 !important; text-shadow: none !important; }
.content .dash-hero .sub, .content .dash-hero p { color: var(--sub) !important; font-size: 13px !important; opacity: 1 !important; margin-top: 4px; }
.content .dash-hero b { color: var(--txt) !important; }
.content .dash-hero a, .content .dash-hero button {
  color: var(--txt) !important; background: var(--card) !important; border: 1px solid var(--borda) !important; border-radius: var(--radius) !important; box-shadow: none !important;
}
.content .dash-hero a:hover, .content .dash-hero button:hover { border-color: var(--primary) !important; color: var(--primary) !important; background: var(--card) !important; }
/* texto e ícone dentro do botão do cabeçalho herdam a cor do botão (o seletor de período do Desempenho
   reutilizado na Produtividade do Motorista pintava rótulo e ícone de branco para o hero escuro antigo) */
.content .dash-hero :is(a, button) :is(span, b, i, small, em, svg):not(.pd-placa) { color: inherit !important; }
.content .dash-hero .is-on, .content .dash-hero .is-active { background: var(--primary) !important; color: #fff !important; border-color: var(--primary) !important; }

/* 2.11 estado vazio, erro e carregando (core/ui.js): uma linha com ícone, esqueleto em vez de spinner */
.ui-vazio { display: flex !important; align-items: flex-start; gap: 12px; text-align: left !important; padding: 16px 18px !important; max-width: none !important; margin: 0 !important; background: var(--bg-soft); border: 1px dashed var(--borda); border-radius: var(--radius-lg); }
.ui-vazio__ico { display: inline-flex !important; width: 34px; height: 34px; flex: none; align-items: center; justify-content: center; border-radius: var(--radius); background: var(--card); border: 1px solid var(--borda-soft); color: var(--muted); font-size: 0 !important; margin: 0 !important; }
.ui-vazio__ico svg { width: 18px; height: 18px; }
.ui-vazio__txt { min-width: 0; }
.ui-vazio h3 { font-size: 14px !important; font-weight: 600; margin: 4px 0 2px !important; color: var(--txt) !important; }
.ui-vazio p { font-size: 13px !important; color: var(--sub) !important; margin: 0; max-width: 72ch; }
.ui-vazio--erro { border-color: #FECACA; background: var(--crit-bg); }
.ui-vazio--erro .ui-vazio__ico { color: var(--crit); }
.ui-vazio--erro h3 { color: var(--crit) !important; }
.ui-loader.pd-skel { padding: 4px 0; }
.ui-loader__spin { display: none; }

/* 2.12 logo do cliente na sidebar nunca passa de 40px de altura (clientes com logo grande) */
.sidebar .sb-logo img:not([data-peso]) { max-height: 32px !important; max-width: 150px !important; width: auto !important; height: auto !important; object-fit: contain; }
/* 13/10: o shell apara a sobra em volta do logo e dimensiona pela área do desenho
   (main.js, _logoSidebar); medido, o tamanho dele vale (logo quadrado ou com sobra
   não fica mais miúdo dentro do teto de 32 px) */
.sidebar .sb-logo img[data-peso] { width: var(--logo-w) !important; height: var(--logo-h) !important; max-height: none !important; max-width: 168px !important; object-fit: contain; }

/* 2.13 sidebar clara vale para todo cliente: overrides antigos de sidebar escura por cliente
   (cliente-print.css) e de tamanho de logo por módulo (dfc.css) não se aplicam mais */
html[data-cliente] .sidebar, html[data-torre-gat] .sidebar, html[data-perf-gat] .sidebar, html .sidebar { background: var(--card) !important; color: var(--txt) !important; }
html[data-torre-gat] .sidebar__item.is-active, html[data-perf-gat] .sidebar__item.is-active { background: color-mix(in srgb, var(--primary) 8%, #fff) !important; box-shadow: none !important; }
html[data-torre-gat] .sb-slogan, html[data-perf-gat] .sb-slogan { color: var(--sub) !important; }
.sb-logo { padding: 16px 16px 10px !important; text-align: left !important; }
.sb-logo img { margin: 0 !important; }

/* 2.14 DRAWER · mesmo refinamento da tela (pedido de 12/10, noite: "drawer vira parede de texto").
   Cabeçalho claro com eyebrow, título e meta em chips; corpo com ritmo: título de bloco,
   ficha chave/valor em grade, tabela no padrão, parágrafo curto. Vale para .fb-drawer e .drawer. */
.fb-drawer__panel, .drawer__panel { background: var(--bg) !important; box-shadow: var(--shadow-lg) !important; }
.fb-drawer__header, .drawer__header, .drawer-head {
  background: var(--card) !important; color: var(--txt) !important;
  padding: 18px 28px 14px !important; border-bottom: 1px solid var(--borda) !important; overflow: visible !important;
}
.fb-drawer__header::before, .drawer__header::before, .drawer-head::after { display: none !important; }
.fb-drawer__header .eyebrow, .drawer__header .eyebrow { color: var(--muted) !important; font-size: 11px !important; letter-spacing: .08em !important; font-weight: 600; }
.fb-drawer__header h2, .drawer__header h2, .drawer-head h2 { color: var(--txt) !important; font-size: 20px !important; font-weight: 600 !important; line-height: 1.2; }
.fb-drawer__header .meta, .drawer__header .meta { color: var(--sub) !important; gap: 8px 10px !important; margin-top: 8px !important; }
.fb-drawer__header .meta b, .drawer__header .meta b { color: var(--txt) !important; font-weight: 600 !important; }
/* contraste: os módulos pintaram o cabeçalho do drawer para fundo escuro (texto branco, chips
   translúcidos). Com o cabeçalho claro, todo texto volta ao escuro e chip ganha fundo neutro. */
.fb-drawer__header :not(svg):not(path):not(img), .drawer__header :not(svg):not(path):not(img) { color: var(--txt) !important; text-shadow: none !important; }
.fb-drawer__header .eyebrow, .fb-drawer__header .meta, .fb-drawer__header small, .fb-drawer__header [class*="mut"], .fb-drawer__header [class*="__q"], .fb-drawer__header [class*="-sub"], .fb-drawer__header [class*="__sub"],
.drawer__header .eyebrow, .drawer__header .meta, .drawer__header small { color: var(--sub) !important; }
.fb-drawer__header b, .fb-drawer__header strong, .drawer__header b, .drawer__header strong { color: var(--txt) !important; }
.fb-drawer__header [class*="chip"], .fb-drawer__header [class*="pill"], .fb-drawer__header [class*="badge"], .fb-drawer__header [class*="-tag"], .fb-drawer__header [class*="st-"] {
  background: var(--bg) !important; border: 1px solid var(--borda) !important; color: var(--txt) !important; box-shadow: none !important;
}
.fb-drawer__header [class*="trilho"], .fb-drawer__header [class*="track"] { background: var(--borda-soft) !important; }
.fb-drawer__header [class*="ficha"], .fb-drawer__header [class*="linha"] { background: transparent !important; border: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }
.fb-drawer__header .is-escuro, .fb-drawer__header [class*="logo"] { background: transparent !important; box-shadow: none !important; }
.fb-drawer__close, .drawer__close, .drawer-close {
  background: transparent !important; color: var(--muted) !important; border: 1px solid transparent !important;
  border-radius: var(--radius-sm) !important; width: 32px !important; height: 32px !important; top: 14px !important; right: 16px !important;
}
.fb-drawer__close:hover, .drawer__close:hover, .drawer-close:hover { background: var(--bg) !important; color: var(--txt) !important; border-color: var(--borda) !important; transform: none !important; }
.fb-drawer__breadcrumb, .drawer__breadcrumb { color: var(--sub) !important; }
.fb-drawer__kpis { gap: 12px !important; padding: 12px 28px !important; }
.fb-drawer__kpis .kp { padding: 10px 12px; border: 1px solid var(--borda); border-radius: var(--radius); background: var(--bg-soft); }
.fb-drawer__kpis .kp .v { color: var(--txt) !important; font-size: 20px !important; font-weight: 600 !important; }
.fb-drawer__kpis .kp .v.ok { color: var(--pos) !important; }
.fb-drawer__kpis .kp .v.warn { color: var(--warn) !important; }
.fb-drawer__kpis .kp .v.crit { color: var(--neg) !important; }
.fb-drawer__tab.is-active { border-bottom-color: var(--primary) !important; }
.fb-drawer__tab.is-active .cnt { background: var(--primary) !important; }
.fb-drawer__body, .drawer__body { padding: 18px 28px 28px !important; font-size: 13px; line-height: 1.5; color: var(--txt); }
/* ritmo do corpo: títulos de bloco, parágrafos curtos, listas com respiro */
.fb-drawer__body h3, .fb-drawer__body h4, .drawer__body h3, .drawer__body h4 {
  font-size: 14px; font-weight: 600; color: var(--txt); margin: 18px 0 8px; padding-bottom: 6px; border-bottom: 1px solid var(--borda-soft);
}
.fb-drawer__body > h3:first-child, .fb-drawer__body > h4:first-child, .fb-drawer__body > div:first-child > h3:first-child { margin-top: 0; }
.fb-drawer__body p, .drawer__body p { margin: 0 0 10px; color: var(--sub); max-width: 72ch; }
.fb-drawer__body p b, .fb-drawer__body p strong { color: var(--txt); }
.fb-drawer__body ul, .fb-drawer__body ol { margin: 0 0 12px; padding-left: 18px; color: var(--sub); }
.fb-drawer__body li { margin: 3px 0; }
/* ficha chave/valor: <dl> ou blocos com .pd-ficha */
.fb-drawer__body dl, .pd-ficha { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: 10px 20px; margin: 0 0 14px; padding: 12px 14px; background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius); }
.fb-drawer__body dl > div, .pd-ficha > div { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.fb-drawer__body dt, .pd-ficha dt, .pd-ficha__k { font-size: 10.5px; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0; }
.fb-drawer__body dd, .pd-ficha dd, .pd-ficha__v { font-size: 13.5px; font-weight: 500; color: var(--txt); margin: 0; font-variant-numeric: tabular-nums; }
/* tabela dentro do drawer: padrão da casa, sem precisar da classe */
.fb-drawer__body table, .drawer__body table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius); overflow: hidden; margin: 0 0 14px; }
.fb-drawer__body thead th, .drawer__body thead th { position: sticky; top: 0; z-index: 1; background: var(--bg-soft); color: var(--muted); font-size: 10.5px; font-weight: 600; letter-spacing: .06em; text-transform: uppercase; padding: 8px 10px; border-bottom: 1px solid var(--borda); text-align: center; white-space: nowrap; }
.fb-drawer__body thead th:first-child, .drawer__body thead th:first-child { text-align: left; }
.fb-drawer__body tbody td, .drawer__body tbody td { padding: 7px 10px; border-bottom: 1px solid var(--borda-soft); vertical-align: middle; }
.fb-drawer__body tbody tr:last-child td, .drawer__body tbody tr:last-child td { border-bottom: 0; }
.fb-drawer__body tbody tr:hover td, .drawer__body tbody tr:hover td { background: #F8F9FA; }
.fb-drawer__body tfoot td { font-weight: 600; background: var(--bg-soft); border-top: 1px solid var(--borda); }
/* blocos e cartões dentro do drawer: brancos, sem sombra, raio padrão */
.fb-drawer__body .card, .fb-drawer__body .painel, .fb-drawer__body section, .fb-drawer__body [class*="__bloco"], .fb-drawer__body [class*="-bloco"], .fb-drawer__body [class*="__sec"], .fb-drawer__body [class*="-box"] {
  box-shadow: none !important; border-radius: var(--radius) !important;
}
.fb-drawer__foot { background: var(--card) !important; }
@media (max-width: 720px) {
  .fb-drawer__header, .drawer__header { padding: 14px 16px 12px !important; }
  .fb-drawer__body, .drawer__body { padding: 14px 16px 20px !important; }
  .fb-drawer__kpis { padding: 10px 16px !important; }
}

/* 2.15 ação injetada na sidebar por módulo (Desempenho: "App do Motorista"): botão neutro, não o verde de fundo escuro */
.sidebar__acao-wrap { padding: 4px 8px 6px !important; }
.sidebar__acao { background: var(--card) !important; color: var(--txt) !important; border: 1px solid var(--borda) !important; border-radius: var(--radius) !important; font-size: 13px !important; font-weight: 500 !important; padding: 8px 10px !important; }
.sidebar__acao:hover { background: var(--bg) !important; border-color: var(--primary) !important; color: var(--primary) !important; }
.sidebar__acao-ico { display: inline-flex; color: var(--sub); }
@media (min-width: 769px) {
  #app.sidebar-rail .sidebar:not(:hover):not(:focus-within) .sidebar__acao-lbl { display: none; }
  #app.sidebar-rail .sidebar:not(:hover):not(:focus-within) .sidebar__acao { justify-content: center; padding: 8px 0 !important; }
  #app.sidebar-rail .sidebar:not(:hover):not(:focus-within) .sidebar__acao-wrap { padding: 4px 10px 6px !important; }
}

/* 2.16 nota explicativa dentro da barra de filtros: some (a explicação vai no "i"; a barra é uma linha) */
.abast-toolbar__hint, .sv-ctrls .sv-hint, [class*="filtros"] > [class*="__hint"], [class*="toolbar"] > [class*="__hint"], [class*="filtros"] > [class*="__nota"], [class*="toolbar"] > [class*="__nota"] { display: none !important; }

/* 2.17 [hidden] sempre esconde. Vários módulos declaram display:flex/grid na classe e o
   atributo perde (o caso aparece no Rewards: .recon__hero nasce hidden e virava uma faixa
   verde de 34px acima do formulário). Uma regra só, no fim da cascata, fecha o assunto. */
[hidden] { display: none !important; }

/* 2.18 KPI "Frota própria" da Torre e da Performance GAT era um bloco pintado na cor da marca
   (na GAT, azul-marinho escuro no meio de cartões brancos). Fica branco, moldura da marca, número na marca. */
.tgat-st--frota, .pgat-st--frota , .trg-st--frota{ background: var(--card) !important; color: var(--txt) !important; border: 1px solid var(--primary) !important; }
.tgat-st--frota .tgat-st__rot, .pgat-st--frota .pgat-st__rot, .trg-st--frota .trg-st__rot, .tgat-st--frota .tgat-st__sub, .pgat-st--frota .pgat-st__sub , .trg-st--frota .trg-st__sub{ color: var(--sub) !important; opacity: 1 !important; }
.tgat-st--frota .tgat-st__num, .pgat-st--frota .pgat-st__num , .trg-st--frota .trg-st__num{ color: var(--primary) !important; }
.tgat-st--frota .tgat-st__fx, .pgat-st--frota .pgat-st__fx , .trg-st--frota .trg-st__fx{ color: var(--primary) !important; }

/* 2.19 tabela larga (rola dentro do cartão): primeira coluna fixa (core/desemoji.js marca .pd-tab-rolante) */
.pd-tab-rolante .pd-col-fixa { position: sticky; left: 0; z-index: 2; box-shadow: 1px 0 0 var(--borda); }
.pd-tab-rolante thead .pd-col-fixa { z-index: 3; }

/* 2.20 linha de tabela com estado: tinta uniforme e leve (7% ou menos), em todos os módulos. A leitura
   fica no chip e no número; a linha só sugere. Sem isso a Gestão de Frota pintava a tabela inteira de amarelo. */
.content tbody tr:is(.is-warn, .is-suspeito, .is-vencido, .is-atrasado, .is-alerta, .is-atencao, .is-pendente) > td { background-color: rgba(233, 185, 73, .07) !important; }
.content tbody tr:is(.is-crit, .is-erro, .is-error, .is-atual, .is-critico, .is-neg) > td { background-color: rgba(219, 90, 75, .05) !important; }
.content tbody tr:is(.is-ok, .is-vigente, .is-grupo, .is-pos) > td { background-color: rgba(2, 157, 102, .05) !important; }
.content tbody tr:is(.is-warn, .is-suspeito, .is-vencido, .is-atrasado, .is-alerta, .is-atencao, .is-pendente, .is-crit, .is-erro, .is-error, .is-atual, .is-critico, .is-neg, .is-ok, .is-vigente, .is-grupo, .is-pos):hover > td { filter: brightness(.985); }

/* 2.21 zona de soltar arquivo feita com <label> inline (Abastecimento Plack): vira bloco, senão o texto
   escapa da moldura tracejada */
.content label[class*="drop"], .content label[class*="zona"] { display: block; }

/* 2.22 faixa de cabeçalho na cor da marca dentro do conteúdo (core/desemoji.js marca .pd-faixa-plana) */
.content .pd-faixa-plana { background: var(--bg-soft) !important; color: var(--sub) !important; border-bottom: 1px solid var(--borda); }
.content .pd-faixa-plana * { color: inherit !important; }

/* 2.23 chips de tipo de violação (Segurança SE): são multisseleção, quase sempre todos ligados. Ligado = fundo
   suave e texto na marca; a cor do tipo fica no quadradinho. Sem isso a barra era um bloco verde de 10 botões. */
.content .sse-tchip.is-on { background: var(--primary-soft, rgba(2,157,102,.1)) !important; color: var(--primary) !important; border-color: var(--primary) !important; }
.content .sse-tchip.is-on i { box-shadow: none !important; }

/* 2.24 mesma margem esquerda em toda tela: o conteúdo começa a 24px da borda em qualquer módulo. Antes cada
   raiz trazia a sua (fontes centrava em 1.200px, gmpr somava 28px de padding e 26px de margem, dsmp 2px),
   e dentro do mesmo módulo o título pulava de 86 para 138px. */
.content > :not(script):not(style):not(iframe):not(.hub-wrap):not(.hub-cli):not(.hub):not(.admin):not([class*="hub-"]) { max-width: none !important; margin-left: 0 !important; margin-right: 0 !important; padding-left: 0 !important; padding-right: 0 !important; }

/* ══════════════════════════════════════════════════════════════════
   3. GRÁFICO · padrão único (13/10/2026) · componentes de core/grafico.js
   ══════════════════════════════════════════════════════════════════ */
.pd-graf { background: var(--card); border: 1px solid var(--borda); border-radius: var(--radius-lg, 10px); padding: 14px 16px 12px; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.pd-graf__cab { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.pd-graf__tit h3 { margin: 0; font-size: 15px; font-weight: 600; color: var(--txt); }
.pd-graf__tit p { margin: 2px 0 0; font-size: 12.5px; color: var(--sub); }
.pd-graf__ctrl { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: flex-end; }
.pd-graf__corpo { min-width: 0; }
.pd-graf__vazio { display: flex; align-items: center; justify-content: center; color: var(--muted); font-size: 13px; border: 1px dashed var(--borda); border-radius: var(--radius); }
.pd-svg { display: block; width: 100%; height: auto; }
.pd-svg text { font-family: var(--font, Barlow, system-ui); }
.pd-svg.is-clicavel .pd-svg__hit, .pd-svg.is-clicavel rect[data-i], .pd-svg.is-clicavel circle[data-i] { cursor: pointer; }
.pd-svg.is-clicavel .pd-svg__hit:hover { fill: rgba(0, 0, 0, .035); }

/* controle segmentado (granularidade, visão): fundo suave, opção ativa branca com sombra */
.pd-seg { display: inline-flex; align-items: center; gap: 2px; padding: 2px; background: var(--bg-soft); border: 1px solid var(--borda); border-radius: 8px; }
.pd-seg > button { appearance: none; border: 0; background: transparent; color: var(--sub); font: 500 12.5px/1 var(--font, Barlow, system-ui); padding: 6px 11px; border-radius: 6px; cursor: pointer; white-space: nowrap; }
.pd-seg > button:hover { color: var(--txt); }
.pd-seg > button.is-on, .pd-seg > button[aria-selected="true"] { background: var(--card); color: var(--txt); font-weight: 600; box-shadow: 0 1px 2px rgba(16, 24, 40, .12), 0 0 0 1px var(--borda); }

/* legenda de chips: embaixo do gráfico, no desenho do DRE (padrão único, 13/10/2026) */
.pd-legenda { display: flex; flex-wrap: wrap; gap: 6px 16px; padding: 10px 4px 2px; font-size: 12.5px; color: var(--sub); }
.pd-legenda__it { display: inline-flex; align-items: center; gap: 6px; }
.pd-legenda__it i { width: 10px; height: 10px; border-radius: 3px; flex: none; }
.pd-legenda__it i.is-tracejada { height: 0; border-top: 2px dashed; border-radius: 0; width: 16px; }
.pd-legenda__it b { color: var(--txt); font-weight: 600; }
.pd-legenda__it small { color: var(--muted); font-size: 12px; }
.pd-legenda--col { flex-direction: column; gap: 8px; padding: 0; }
/* legenda do donut: rótulo, valor e % em colunas alinhadas */
.pd-legenda--donut { display: grid; grid-template-columns: 12px minmax(0, auto) auto auto; gap: 9px 10px; align-items: center; font-size: 13.5px; }
.pd-legenda--donut .pd-legenda__it { display: contents; }
.pd-legenda--donut .pd-legenda__rot { color: var(--txt); }
.pd-legenda--donut b { text-align: right; font-variant-numeric: tabular-nums; }
.pd-legenda--donut small { text-align: right; font-variant-numeric: tabular-nums; min-width: 42px; }

/* ranking em linha HTML */
.pd-rank { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.pd-rank__it { display: grid; grid-template-columns: 26px minmax(140px, 1.2fr) 2fr auto; align-items: center; gap: 12px; padding: 8px 0; border-bottom: 1px solid var(--borda-soft, #f1f2f4); }
.pd-rank__it:last-child { border-bottom: 0; }
.pd-rank.is-clicavel .pd-rank__it { cursor: pointer; }
.pd-rank.is-clicavel .pd-rank__it:hover { background: var(--bg-soft); }
.pd-rank__pos { width: 22px; height: 22px; border-radius: 999px; background: var(--bg-soft); color: var(--sub); font-size: 11px; font-weight: 600; display: inline-flex; align-items: center; justify-content: center; }
.pd-rank__lbl { min-width: 0; display: flex; flex-direction: column; }
.pd-rank__lbl b { font-weight: 600; color: var(--txt); font-size: 13px; overflow-wrap: anywhere; }
.pd-rank__lbl small { color: var(--sub); font-size: 11.5px; }
.pd-rank__barra { height: 8px; background: var(--bg-soft); border-radius: 999px; overflow: hidden; }
.pd-rank__barra i { display: block; height: 100%; border-radius: 999px; }
.pd-rank__val { font-variant-numeric: tabular-nums; font-weight: 600; color: var(--txt); font-size: 13px; text-align: right; white-space: nowrap; display: flex; flex-direction: column; align-items: flex-end; }
.pd-rank__val small { color: var(--sub); font-weight: 400; font-size: 11px; }

/* donut: rosca e legenda lado a lado, centradas no cartão (legenda embaixo só quando não cabe) */
.pd-donut { display: flex; align-items: center; justify-content: center; gap: 28px; flex-wrap: wrap; min-height: 100%; padding: 6px 0; }
.pd-donut .pd-svg--donut { flex: none; }

/* setas de tabela larga (core/tabela-scroll.js · ativarNavGlobal): no topo, à direita */
.pd-tabnav { display: flex; justify-content: flex-end; align-items: center; gap: 4px; padding: 6px 10px; }
.pd-tabnav--emlinha { display: inline-flex; padding: 0; margin-left: 10px; }
.pd-tabnav[hidden] { display: none !important; }
.pd-tabnav button { width: 28px; height: 26px; display: inline-grid; place-items: center; border: 1px solid var(--borda); border-radius: var(--radius-sm, 6px); background: var(--card); color: var(--txt); font: 600 15px/1 var(--font, Barlow, system-ui); cursor: pointer; padding: 0; }
.pd-tabnav button:hover:not(:disabled) { border-color: var(--primary); color: var(--primary); }
.pd-tabnav button:disabled { opacity: .3; cursor: default; }

/* tooltip compartilhado */
.pd-tip { position: fixed; z-index: var(--z-tooltip, 1000); background: #1C1F26; color: #fff; font: 12.5px/1.45 var(--font, Barlow, system-ui); padding: 7px 10px; border-radius: 7px; box-shadow: 0 6px 20px rgba(0, 0, 0, .2); pointer-events: none; max-width: 280px; }
.pd-tip b { color: #fff; }
.pd-tip[hidden] { display: none; }

/* 3.1 nivelamento dos gráficos antigos (sem editar o módulo): tipografia e traço iguais aos do padrão.
   Tamanhos de texto e cores de série são tratados em core/desemoji.js (nivelarGraficos), que mede a
   escala do viewBox; aqui fica só o que o CSS resolve sozinho. */
.content svg:not(.ico):not(.pd-svg) text { font-family: var(--font, Barlow, system-ui) !important; }
.content svg:not(.ico) rect.pd-gr-barra { rx: 3; }

/* 3.2 controles segmentados dos módulos (Dia/Semana/Mês, visões): mesmo desenho do .pd-seg */
.content :is(.seg, .pgat-seg, .trg-seg, .cv-seg, .cmp-seg, .cmp-distrib-seg, .gf-seg, .rx-seg, .rx-split__seg, .rmt-seg, .rmt-apv__seg, .prd-seg, .prd-eo-seg, .prd-drw-seg, .di-seg, .tgat-seg, .meth-seg, .cxa-gran, .dsv-gran, .dsv-mtabs, .sse-mtabs, .neg-gran, .aprod-seg, .aprod-emp__seg, .vg-emp__seg, .fr-emp__seg, .abast-toolbar__seg, .dsmp-seg, .gm-seg, .gmed-pills, .gmghp-pills, .gmip-pills, .gmjrp-pills, .gmprp-pills, .gmed-hier-filtro__seg, .mad-seg, .adij-seg, .cpkj-seg, .dfc-pd-seg, .mapa-mode-seg, .recon__aud-seg, .ouv-seg, .dv-visao, .af-visao, .evfb-g2--visao, .propo-fx__seg, .trail__seg) {
  display: inline-flex !important; align-items: center; gap: 2px; padding: 2px !important; background: var(--bg-soft) !important; border: 1px solid var(--borda) !important; border-radius: 8px !important; box-shadow: none !important;
}
.content :is(.seg, .pgat-seg, .trg-seg, .cv-seg, .cmp-seg, .cmp-distrib-seg, .gf-seg, .rx-seg, .rx-split__seg, .rmt-seg, .rmt-apv__seg, .prd-seg, .prd-eo-seg, .prd-drw-seg, .di-seg, .tgat-seg, .meth-seg, .cxa-gran, .dsv-gran, .dsv-mtabs, .sse-mtabs, .neg-gran, .aprod-seg, .aprod-emp__seg, .vg-emp__seg, .fr-emp__seg, .abast-toolbar__seg, .dsmp-seg, .gm-seg, .gmed-pills, .gmghp-pills, .gmip-pills, .gmjrp-pills, .gmprp-pills, .gmed-hier-filtro__seg, .mad-seg, .adij-seg, .cpkj-seg, .dfc-pd-seg, .mapa-mode-seg, .recon__aud-seg, .ouv-seg, .dv-visao, .af-visao, .evfb-g2--visao, .propo-fx__seg, .trail__seg) > :is(button, a, span, label) {
  border: 0 !important; background: transparent !important; color: var(--sub) !important; font: 500 12.5px/1 var(--font, Barlow, system-ui) !important; padding: 6px 11px !important; border-radius: 6px !important; box-shadow: none !important; margin: 0 !important; text-transform: none !important; letter-spacing: 0 !important; min-height: 0 !important; height: auto !important;
}
.content :is(.seg, .pgat-seg, .trg-seg, .cv-seg, .cmp-seg, .cmp-distrib-seg, .gf-seg, .rx-seg, .rx-split__seg, .rmt-seg, .rmt-apv__seg, .prd-seg, .prd-eo-seg, .prd-drw-seg, .di-seg, .tgat-seg, .meth-seg, .cxa-gran, .dsv-gran, .dsv-mtabs, .sse-mtabs, .neg-gran, .aprod-seg, .aprod-emp__seg, .vg-emp__seg, .fr-emp__seg, .abast-toolbar__seg, .dsmp-seg, .gm-seg, .gmed-pills, .gmghp-pills, .gmip-pills, .gmjrp-pills, .gmprp-pills, .gmed-hier-filtro__seg, .mad-seg, .adij-seg, .cpkj-seg, .dfc-pd-seg, .mapa-mode-seg, .recon__aud-seg, .ouv-seg, .dv-visao, .af-visao, .evfb-g2--visao, .propo-fx__seg, .trail__seg) > :is(.is-on, .is-active, .is-ativo, .ativo, .active, .on, [aria-selected="true"], [aria-pressed="true"]) {
  background: var(--card) !important; color: var(--txt) !important; font-weight: 600 !important; box-shadow: 0 1px 2px rgba(16, 24, 40, .12), 0 0 0 1px var(--borda) !important;
}

/* 3.3 abas de métrica da Segurança (.sv-mtab, botões soltos dentro de .sv-metricas, sem contêiner): mesma
   cara da opção do .pd-seg, sem bloco verde sólido. Os chips de tipo (.sse-tchip) já têm regra própria. */
.content .sv-mtab:not(.sse-tchip) { border: 1px solid var(--borda) !important; background: var(--card) !important; color: var(--sub) !important; font: 500 12.5px/1 var(--font, Barlow, system-ui) !important; padding: 6px 11px !important; border-radius: 6px !important; text-transform: none !important; letter-spacing: 0 !important; }
.content .sv-mtab:not(.sse-tchip).is-on { background: var(--bg-soft) !important; color: var(--txt) !important; font-weight: 600 !important; border-color: var(--txt) !important; }

/* 13/10/2026 (rs-gat rs4) · cabeçalho de tabela sem "fundinho cinza": o rótulo ordenável é um <button>
   e, sem regra própria do módulo, herdava o fundo padrão de botão do navegador. Filtro ativo e hover do
   funil marcam só pela cor, sem bloco de fundo. Regras de módulo (.cad, .rmt, .aprod...) continuam valendo. */
.gmed-aud-th__lbl { background: transparent; border: 0; padding: 0; font: inherit; color: inherit; text-transform: inherit; letter-spacing: inherit; }
.gmed-aud-th__f:hover, .gmed-aud-th__f.is-on { background: transparent; }


/* ══════════════════════════════════════════════════════════════
   4. PADRÃO ÚNICO ENTRE MÓDULOS (13/10/2026) · docs/PADRAO-VISUAL.md
   ══════════════════════════════════════════════════════════════
   Os módulos nasceram em momentos diferentes e cada um tinha seu
   título, seu KPI, sua tabela e seu verde. Aqui fica UM valor por
   elemento, imposto por cima de todos (os CSS de módulo carregam
   depois, por isso !important). Vale também dentro dos módulos em
   iframe, onde o shell injeta este arquivo. Ao criar módulo novo,
   usar as classes pd-* e estes valores, sem inventar outro. */
:root {
  --pu-pos: #15803D; --pu-warn: #B45309; --pu-neg: #B91C1C;
  --pu-font: 'Barlow', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

/* 4.1 cabeçalho da tela: linha de cima, título, subtítulo, filete */
:is(.content, body) :is(.dash-hero .eyebrow, .dre-eyebrow, .cv-eyebrow, .mad-eyebrow, .tgat-eyebrow, .pgat-eyebrow, .trg-eyebrow, .sv-eyebrow, .rmt-eyebrow, .gf-eyebrow, .fbd-eyebrow, .ext-eyebrow, .tt-eyebrow, .mot-eyebrow, .dd-eyebrow, .fr-eyebrow) {
  font-family: var(--pu-font) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .08em !important;
  text-transform: uppercase !important; color: var(--muted) !important; margin-bottom: 2px !important;
}
:is(.content, body) :is(.dash-hero h1, .dash-hero h2, .dre-h1, .cv-h1, .mad-h1, .tgat-h1, .pgat-h1, .trg-h1, .sv-h1, .rmt-h1, .gf-h1, .fr-h1) {
  font-family: var(--pu-font) !important; font-size: 22px !important; font-weight: 600 !important; letter-spacing: -.01em !important;
  line-height: 1.2 !important; color: var(--txt) !important; margin: 2px 0 4px !important;
}
:is(.content, body) :is(.dash-hero .sub, .dre-h1sub, .cv-sub, .mad-sub, .tgat-sub, .pgat-sub, .trg-sub, .sv-h1sub, .fr-h1sub) {
  font-family: var(--pu-font) !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--sub) !important;
}
:is(.content, body) :is(.cv-head, .mad-head, .tgat-head, .pgat-head, .trg-head, .fr-head, .tun-cab) {
  border-bottom: 1px solid var(--borda) !important; padding-bottom: 12px !important;
}
:is(.content, body) :is(.cv-head, .mad-head, .tgat-head, .pgat-head, .trg-head, .fr-head) { margin-bottom: 16px !important; }

/* 4.2 KPI: rótulo, valor, apoio, cartão e cor de estado */
:is(.content, body) :is(.pd-kpi, .rd-kpi, .portal-card, .pc) { border-radius: 10px !important; box-shadow: none !important; border: 1px solid var(--borda) !important; }
:is(.content, body) :is(.pd-kpi__rotulo, .rd-kpi__l, .pc-label, .cx-kpi__lbl, .est-kpi__label, .cmp-kpi-lbl, .cpkj-kpi__rot, .dr-kpi__lbl) {
  font-family: var(--pu-font) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .06em !important;
  text-transform: uppercase !important; color: var(--sub) !important; white-space: normal !important; overflow: visible !important; text-overflow: clip !important;
}
:is(.content, body) :is(.pd-kpi__valor, .rd-kpi__v, .pc-valor, .cx-kpi__val, .est-kpi__valor, .gf-kpi__v, .cpkj-kpi__val, .di-kpi__v, .dfr-kpi__val, .sv-kpi-v) {
  font-family: var(--pu-font) !important; font-size: 26px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.15 !important;
}
:is(.content, body) :is(.pd-kpi__apoio, .pd-kpi__base, .rd-kpi__s, .pc-desc, .cx-kpi__hint, .cpkj-kpi__sub, .cmp-kpi-sub) {
  font-family: var(--pu-font) !important; font-size: 12px !important; line-height: 1.4 !important; color: var(--sub) !important;
}
/* uma cor de estado para todos (antes eram cinco verdes e quatro vermelhos) */
:is(.content, body) :is(.rd-kpi--ok .rd-kpi__v, .portal-card.ok .pc-valor, .pc.ok .pc-valor, .pd-kpi.is-ok .pd-kpi__valor, .pc-valor.gmed-kpi--pos, .pc-valor.gmprp-kpi--pos, .pc-valor.gmjrp-kpi--pos, .pc-valor.gmip-kpi--pos, .pc-valor.gmghp-kpi--pos) { color: var(--pu-pos) !important; }
:is(.content, body) :is(.rd-kpi--warn .rd-kpi__v, .portal-card.warn .pc-valor, .pc.warn .pc-valor, .pc.gold .pc-valor, .pd-kpi.is-atencao .pd-kpi__valor) { color: var(--pu-warn) !important; }
:is(.content, body) :is(.rd-kpi--bad .rd-kpi__v, .portal-card.crit .pc-valor, .pc.crit .pc-valor, .pd-kpi.is-critico .pd-kpi__valor, .pc-valor.gmed-kpi--neg, .pc-valor.gmprp-kpi--neg, .pc-valor.gmjrp-kpi--neg, .pc-valor.gmip-kpi--neg, .pc-valor.gmghp-kpi--neg) { color: var(--pu-neg) !important; }

/* 4.3 painel: título e subtítulo (subtítulo embaixo do título) */
:is(.content, body) :is(.pd-graf__tit h3, .painel__title h4, .rd-painel__head h3, .rd-sec__head h3, .fonte-section__head h3, .cx-h3) {
  font-family: var(--pu-font) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; color: var(--txt) !important; text-transform: none !important;
}
:is(.content, body) :is(.pd-graf__tit p, .painel__title .sub, .fonte-section__head .sub, .rd-painel__head .rd-mut, .rd-sec__head .rd-mut) {
  font-family: var(--pu-font) !important; font-size: 12.5px !important; color: var(--sub) !important;
}
:is(.content, body) .rd-painel__head { display: flex !important; flex-direction: column !important; align-items: flex-start !important; gap: 2px !important; }

/* 4.4 tabela: cabeçalho e célula; número centrado com o cabeçalho junto */
:is(.content, body) :is(.pd-tabela, .rd-tabela, .gmpri-tab, .gmix-tabela, .dfc-vtab, .gmed-aud-tab, table.t) th {
  font-family: var(--pu-font) !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .05em !important;
  text-transform: uppercase !important; color: var(--sub) !important;
}
:is(.content, body) :is(.pd-tabela, .rd-tabela, .gmpri-tab, .gmix-tabela, .dfc-vtab, .gmed-aud-tab, table.t) td { font-size: 13px !important; }
:is(.content, body) :is(th.num, th.n, th.r, th.is-num) { text-align: center !important; }
:is(.content, body) :is(th.num, th.n, th.r, th.is-num) .gmed-aud-th { justify-content: center !important; }
:is(.content, body) :is(td.n, td.r) { text-align: center !important; font-variant-numeric: tabular-nums; }

/* 4.5 etiqueta e botão */
:is(.content, body) :is(.rd-chip, .cv-tag, .tun-tag, .tag) { font-size: 11px !important; font-weight: 600 !important; }
:is(.content, body) .btn { font-family: var(--pu-font) !important; font-size: 13px !important; font-weight: 500 !important; border-radius: 8px !important; }
:is(.content, body) .btn.btn--sm { font-size: 12px !important; min-height: 30px !important; }
:is(.content, body) :is(.cv-bt, .mad-bt, .tgat-bt, .pgat-bt, .trg-bt) { font-size: 13px !important; font-weight: 500 !important; border-radius: 8px !important; min-height: 34px; }

/* 4.6 cabeçalhos que ainda tinham tamanho próprio (estoque, reconhecimento,
   fontes/segurança, CPK, gestão financeira): mesmo título, linha de cima e sub */
:is(.content, body) :is(.dfc-crumb, .est-crumb, .recon__crumb, .fontes__crumb, .cpkj-hero__eyebrow, .gf-eyebrow) {
  font-family: var(--pu-font) !important; font-size: 11px !important; font-weight: 600 !important; letter-spacing: .08em !important;
  text-transform: uppercase !important; color: var(--muted) !important; margin-bottom: 2px !important;
}
:is(.content, body) :is(.recon__crumb-projeto, .fontes__crumb-projeto) { color: inherit !important; font-weight: inherit !important; }
:is(.content, body) :is(.dfc-head h1, .dsmp-head h1, .sv-mapa-head h2, .estoque .est-head h1, .recon__head h1, .fontes__head h1, .cpkj-hero h2) {
  font-family: var(--pu-font) !important; font-size: 22px !important; font-weight: 600 !important; letter-spacing: -.01em !important;
  line-height: 1.2 !important; color: var(--txt) !important; margin: 2px 0 4px !important;
}
:is(.content, body) :is(.dfc-sub, .dsmp-head > div > p, .estoque .est-sub, .recon__sub, .fontes__sub, .cpkj-hero__sub, .gf-sub, .sv-mapa-head .sv-sub) {
  font-family: var(--pu-font) !important; font-size: 13px !important; font-weight: 400 !important; line-height: 1.5 !important; color: var(--sub) !important;
}

/* 4.7 títulos de painel que estavam em 14, 14,5, 16 e 18 */
:is(.content, body) :is(.di-painel__head h3, .di-sec__head h3, .gf-painel__head h3, .cpkj-sec__head h3, .painel__tit,
  .estoque .est-posto-card h3, .estoque .est-rec-form__head h3, .estoque .est-cfg-posto h3, .estoque .est-hist-card__head h3, .estoque .est-hist-tabela h3, .estoque .est-resumo-vendas__head h3,
  .fontes__upload h3, .recon__upload h3, .param__sec h3, .param__subgrid h3, .recon__consolidar-body h3) {
  font-family: var(--pu-font) !important; font-size: 15px !important; font-weight: 600 !important; letter-spacing: 0 !important; color: var(--txt) !important; text-transform: none !important;
}

/* 4.8 KPI: número de status e contadores no mesmo corpo do KPI; neutro em
   texto, "info" na cor do cliente, estado nas três cores de 4.2 */
:is(.content, body) :is(.recon__kpi-valor, .tgat-st__num, .rmt-st__num) {
  font-family: var(--pu-font) !important; font-size: 26px !important; font-weight: 700 !important; letter-spacing: -.01em !important; line-height: 1.15 !important;
}
:is(.content, body) .rmt-pz__t b { font-weight: 700 !important; }
:is(.content, body) .portal-card:not(.ok, .warn, .crit, .alert, .info, .gold, .is-ok, .is-warn, .is-bad, .is-crit) .pc-valor:not([class*="-kpi--"]) { color: var(--txt) !important; }
:is(.content, body) .portal-card.info .pc-valor:not([class*="-kpi--"]) { color: var(--primary) !important; }
:is(.content, body) :is(.portal-card.is-ok .pc-valor) { color: var(--pu-pos) !important; }
:is(.content, body) :is(.portal-card.is-warn .pc-valor) { color: var(--pu-warn) !important; }
:is(.content, body) :is(.portal-card.alert .pc-valor, .portal-card.is-bad .pc-valor, .portal-card.is-crit .pc-valor, .adij-kpi-atraso .pc-valor) { color: var(--pu-neg) !important; }

/* 4.9 tabelas dos módulos que tinham cabeçalho e corpo próprios.
   Dois corpos só: 13 na tabela da tela, 12 na tabela compacta que
   acompanha gráfico e no mapa de calor (muitas colunas). */
:is(.content, body) :is(.gm-tab, .gmghi-tab, .gmi-tab, .gmjri-tab, .gmrli-tab, .adij-tab, .di-tabela, .sv-tab, .pgat-serie table, .trg-serie table, .vg-serie, .dsv-fr-tab,
  .plk-car__mot, .fontes__cobertura-tabela, .vg-tab, .cpkj-tab, .aprod-tab, .cad-tab, .dre-bench, .pgat-farol table, .trg-farol table, .rd-chart-tab, .dfc-chart-tab, .di-chart-tab, .dre-heat, .rd-heat) th {
  font-family: var(--pu-font) !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .05em !important;
  text-transform: uppercase !important; color: var(--sub) !important;
}
:is(.content, body) :is(.gm-tab, .gmghi-tab, .gmi-tab, .gmjri-tab, .gmrli-tab, .adij-tab, .di-tabela, .sv-tab, .pgat-serie table, .trg-serie table, .vg-serie, .dsv-fr-tab,
  .plk-car__mot, .fontes__cobertura-tabela, .vg-tab, .cpkj-tab, .aprod-tab, .cad-tab, .dre-bench, .pgat-farol table, .trg-farol table) td { font-size: 13px !important; }
:is(.content, body) .dfc-chart-tab .dfc-ct-res td { font-weight: 700 !important; }
:is(.content, body) :is(.rd-chart-tab, .dfc-chart-tab, .di-chart-tab, .dre-heat, .rd-heat) td { font-size: 12px !important; }

/* 4.10 filtros: campo, seletor múltiplo e rótulo iguais em todos os módulos.
   Campo 34 px, canto 8, texto 13; rótulo 10,5/600 em caixa alta. */
:is(.content, body) :is(.cxa-filtro select, .cxa-filtro input, .fr-filtros select, .fr-filtros input:not([type=checkbox]):not([type=radio]):not([type=range]), .aprod-filtros select, .aprod-filtros input:not([type=checkbox]):not([type=radio]):not([type=range]), .cmp-filtros select, .cmp-filtros input:not([type=checkbox]):not([type=radio]):not([type=range]),
  .cmp-busca, .ouv-sel, .gf-filtros__dir select, .gf-busca input, .sv-filtros__selects select, .sv-filtros__selects input:not([type=checkbox]):not([type=radio]):not([type=range]), .sv-bar__search input, .barra-ferr input.busca,
  .ctrl-inp, .gmip-lanc-in, .trn-ctrl-filtros select, .trn-ctrl-filtros input:not([type=checkbox]):not([type=radio]):not([type=range]), .sv-mapa-filtros-row select, .sv-mapa-filtros-row input, .adij-pt-busca, .gmed-ctrl-sel, .gmghp-ctrl-sel, .gmip-ctrl-sel, .gmjrp-ctrl-sel, .gmprp-ctrl-sel, .gmrlp-ctrl-sel, .pgat-ctrl__sel, .trg-ctrl__sel, .tgat-ctrl__sel,
  .cv-ctrl__sel, .mad-ctrl__sel, .adij-sel, .dsmp-sel, .tun-sel, .dv-sel, select.fsel, .fsel select, .cpkj-filtros select, .cpkj-filtros input:not([type=checkbox]):not([type=radio]),
  .fr-fctrl select, .fr-fctrl input:not([type=checkbox]):not([type=radio]), .vg-fctrl select, .vg-fctrl input:not([type=checkbox]):not([type=radio]),
  .diesel-filtros select, .diesel-filtros input:not([type=checkbox]):not([type=radio]), .rd-filtros select, .cx-filtros select, .fld select, .fld input:not([type=checkbox]):not([type=radio]), .traj__campo, .fnt-tab-busca input) {
  height: 34px !important; min-height: 34px !important; border-radius: 8px !important; font-family: var(--pu-font) !important; font-size: 13px !important; font-weight: 400 !important;
  box-sizing: border-box !important; text-transform: none !important; letter-spacing: 0 !important;
}
:is(.content, body) :is(.gmed-filtro-multi-btn, .gmghp-filtro-multi-btn, .gmip-filtro-multi-btn, .gmjrp-filtro-multi-btn, .gmprp-filtro-multi-btn, .gmrlp-filtro-multi-btn,
  .pgat-ms__btn, .trg-ms__btn, .tgat-ms__btn, .cv-ms__btn, .mad-ms__btn, .dsmp-ms__btn, .tun-ms__btn) {
  height: 34px !important; min-height: 34px !important; border-radius: 8px !important; font-family: var(--pu-font) !important; font-size: 13px !important;
}
:is(.content, body) :is(.gmed-filtro-multi-btn, .gmghp-filtro-multi-btn, .gmip-filtro-multi-btn, .gmjrp-filtro-multi-btn, .gmprp-filtro-multi-btn, .gmrlp-filtro-multi-btn,
  .pgat-ms__btn, .trg-ms__btn, .tgat-ms__btn, .cv-ms__btn, .mad-ms__btn, .dsmp-ms__btn, .tun-ms__btn):not(.is-on) { font-weight: 400 !important; }
:is(.content, body) :is(.gmed-ctrl-lbl, .gmghp-ctrl-lbl, .gmip-ctrl-lbl, .gmjrp-ctrl-lbl, .gmprp-ctrl-lbl, .gmrlp-ctrl-lbl, .pgat-ctrl__lbl, .trg-ctrl__lbl, .tgat-ctrl__lbl,
  .cv-ctrl__lbl, .mad-ctrl__lbl, .sv-ctrl__lbl, .dsv-ctrl__lbl, .dfc-per__lbl, .cxa-per__lbl, .fr-fctrl__lbl, .vg-fctrl__lbl, .diesel-filtros__label,
  .meth-filter__lbl, .sv-mapa-filtros label, .fsel > span, .fbar-lbl, .cpkj-filtros label, .cxa-filtro > span, .fr-filtros label:not(:has(input[type=checkbox])), .aprod-filtros label:not(.aprod-check)) {
  font-family: var(--pu-font) !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .05em !important;
  text-transform: uppercase !important; color: var(--sub) !important;
}
/* botão de período e data do filtro: mesma altura e peso do botão padrão */
:is(.content, body) :is(.dfc-per__btn, .plk-per-bt) { height: 34px !important; border-radius: 8px !important; font-size: 13px !important; font-weight: 500 !important; }
:is(.content, body) .dfc-per__btn.is-on, :is(.content, body) .plk-per-bt.is-on { font-weight: 600 !important; }
:is(.content, body) .cv-dia input[type=date] { border-radius: 8px !important; font-weight: 500 !important; }
/* chip de período (Print, diesel, médias, fretes...): mesma altura, canto e texto do campo */
:is(.content, body) [class*="dchip__btn"] { height: 34px !important; min-height: 34px !important; border-radius: 8px !important; font-family: var(--pu-font) !important; font-size: 13px !important; }

/* 4.11 cabeçalho de tabela em qualquer tabela de módulo (não só as listadas
   em 4.4 e 4.9): mesma letra, peso, espaçamento, caixa alta e cor */
:is(.content, body) table thead th {
  font-family: var(--pu-font) !important; font-size: 10.5px !important; font-weight: 600 !important; letter-spacing: .05em !important;
  text-transform: uppercase !important; color: var(--sub) !important;
}

/* 4.12 botões de ação com nome próprio no módulo: mesmo corpo do .btn
   (13/500, 34 px, canto 8). Seletor de período e seletor múltiplo também. */
:is(.content, body) :is(.aprod-btn, .cxa-btn-ghost, .cxa-btn, .dfc-btn-primary, .dfc-btn, .fr-btn, .gf-btn:not(.gf-btn--sm), .lc-csv, .pl-add, .rmt-bt, .sv-bar__reset,
  .sv-btn, .sv-btn-pivot, .sv-fbtn, .vg-btn, .vg-fbtn-ghost, .apr-pdf, .cxa-per__btn, .perbtn, .dsmp-fper-btn, .fclear, .est-btn) {
  font-family: var(--pu-font) !important; font-size: 13px !important; font-weight: 500 !important; height: 34px !important; min-height: 34px !important;
  border-radius: 8px !important; box-sizing: border-box !important;
}
:is(.content, body) :is(.dsmp-ms-btn, .vg-fmulti__btn, .filtro-multi-btn) {
  font-family: var(--pu-font) !important; font-size: 13px !important; height: 34px !important; min-height: 34px !important; border-radius: 8px !important;
}
:is(.content, body) .gf-btn.gf-btn--sm { height: 30px !important; min-height: 30px !important; font-size: 12px !important; border-radius: 8px !important; }
/* Caixa: seis KPIs cabem numa linha (com 210 px de mínimo o sexto descia sozinho e deixava vão) */
.cxa .portal-grid { grid-template-columns: repeat(auto-fit, minmax(165px, 1fr)) !important; }
/* Gestão financeira: os seis passos da configuração em 3 × 2 (antes o sexto ficava sozinho na segunda linha) */
.gf-onb__passos { grid-template-columns: repeat(auto-fit, minmax(max(220px, calc((100% - 20px) / 3)), 1fr)) !important; }

/* 4.13 fonte condensada fora: as classes abaixo chumbavam 'Barlow Condensed'
   no CSS do módulo. Fica só no painel do login e no modo apresentação do
   Reconhecimento (palco de slides, desenho próprio). */
:is(.content, body) :is(.fb-frota-kpi-n, .prd-fun-cab__t, .prd-cob-al__n, .chart-tt .tt-value, .chart-tt .tt-val, .uplift-chart-tip__value, .dm-nt10-num,
  .dd-eyebrow, .dd-cap, .dd-chip-v, .dd-stat-v, .dd-daytab thead th, .dd-daypill, .dd-clu, .dd-hr-v,
  .tabelao-h, .propo-card__h, .propo-money__big, .propo-tbl__head > span, .story-stage__n, .story-stage__h, .story-formula,
  .propo-fx__name, .propo-sim__h, .propo-sim__num b, .propo-pers__head, .propo-pers__total b) {
  font-family: var(--pu-font) !important; font-stretch: normal !important;
}

/* 4.9 "Filtro da seção" na linha do título (14/10/2026, js/core/topo-secao.js):
   a faixa do chip de período sai de cima do cabeçalho e fica à direita
   dele, centralizada na altura. Sem vão em cima do título nem embaixo do chip. */
.pd-topo-junto {
  position: absolute !important; z-index: 30; left: auto !important; bottom: auto !important;
  margin: 0 !important; padding: 0 !important; border: 0 !important; background: none !important;
  box-shadow: none !important; width: auto !important; max-width: none !important; min-height: 0 !important;
}
.pd-topo-junto > [class$="__inner"] { padding: 0 !important; margin: 0 !important; max-width: none !important; }
:is(.content, body) .pd-cab-com-topo.pd-cab-com-topo { padding-right: calc(var(--pd-topo-w, 0px) + 24px) !important; min-height: var(--pd-topo-h, 0px); }
/* botões do cabeçalho na mesma linha de centro do chip */
:is(.content, body) .pd-cab-com-topo.pd-cab-com-topo { align-items: center; }

/* 2.4b papel da placa (14/10/2026): cavalo e carreta com tarjas diferentes em
   todo módulo. O chip leva data-papel="cavalo" | "carreta" (padrao.placa(txt,
   { papel }) ou o chip do próprio módulo). Cavalo = cor da marca; carreta =
   laranja da paleta. Módulo de cliente com cores próprias redefine os tokens
   no contêiner (ex.: Carvão Aperam, ameixa e laranja). Sem papel, vale a
   tarja da marca de sempre. */
:root { --placa-cavalo: var(--brand-primary, var(--primary)); --placa-carreta: #E08A3C; }
html body [data-papel="cavalo"]::before { background: var(--placa-cavalo) !important; }
html body [data-papel="carreta"]::before { background: var(--placa-carreta) !important; }