/* Painel Nota Delivery. Organizado por: 1 tokens, 2 base, 3 estrutura (menu, topo), 4 componentes, 5 paginas, 6 celular.
   Sem fontes, imagens nem scripts de fora: o painel abre inteiro so com o servidor. */

/* ---------------------------------------------------------------- 1. tokens */
:root {
  --fundo: #f5f6fa; --papel: #ffffff; --papel-2: #f0f2f7; --texto: #1f2433; --suave: #596076; --linha: #e3e6ee;
  --marca: #c94a08; --marca-forte: #ad3f06; --marca-texto: #ffffff; --laranja: #f26a1b; --link: #b04007;
  --menu-fundo: #181c27; --menu-texto: #c9cfdd; --menu-suave: #8d97b0; --menu-ativo: rgba(242, 106, 27, .16);
  --teste-fundo: #fff3bf; --teste-texto: #5c4400; --teste-borda: #e0a800; --prod-fundo: #c62828; --prod-texto: #ffffff;
  --ok: #14692f; --ok-fundo: #ddf4e4; --info: #1c45b8; --info-fundo: #e1eaff;
  --amarelo: #6b4b00; --amarelo-fundo: #fff1bf; --laranja-t: #8a3504; --laranja-fundo: #ffe3cf;
  --erro: #a4231b; --erro-fundo: #fde0de; --roxo: #5a2da3; --roxo-fundo: #ebe1fb;
  --cinza: #4a5266; --cinza-fundo: #e9ecf2; --escuro: #ffffff; --escuro-fundo: #3a4152;
  --g-pront: #f9b98e;
  --raio: 8px; --raio-g: 12px; --sombra: 0 1px 2px rgba(24, 28, 39, .06), 0 2px 8px rgba(24, 28, 39, .05);
  --e2: .5rem; --e3: .75rem; --e4: 1rem; --e5: 1.5rem; --e6: 2rem;
  --foco: 0 0 0 3px rgba(242, 106, 27, .55);
}
:root[data-tema="escuro"] {
  --fundo: #0f1218; --papel: #181c26; --papel-2: #1f2430; --texto: #e9ecf3; --suave: #a3acbf; --linha: #2a3142;
  --marca: #f26a1b; --marca-forte: #ff8240; --marca-texto: #1a0f06; --link: #ff9a5c;
  --menu-fundo: #0b0e14; --menu-ativo: rgba(242, 106, 27, .22);
  --teste-fundo: #4a3b00; --teste-texto: #ffe58a; --teste-borda: #e0a800; --prod-fundo: #d94141;
  --ok: #7fe0a0; --ok-fundo: #143823; --info: #a9c1ff; --info-fundo: #182a58;
  --amarelo: #ffe08a; --amarelo-fundo: #463600; --laranja-t: #ffbf94; --laranja-fundo: #4a2208;
  --erro: #ffa8a1; --erro-fundo: #46181a; --roxo: #cdb4ff; --roxo-fundo: #2f1f55;
  --cinza: #c0c7d6; --cinza-fundo: #2a3142; --escuro: #0f1218; --escuro-fundo: #c9cfdd;
  --g-pront: #8a4a24; --sombra: 0 1px 2px rgba(0, 0, 0, .4);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) {
    --fundo: #0f1218; --papel: #181c26; --papel-2: #1f2430; --texto: #e9ecf3; --suave: #a3acbf; --linha: #2a3142;
    --marca: #f26a1b; --marca-forte: #ff8240; --marca-texto: #1a0f06; --link: #ff9a5c;
    --menu-fundo: #0b0e14; --menu-ativo: rgba(242, 106, 27, .22);
    --teste-fundo: #4a3b00; --teste-texto: #ffe58a; --teste-borda: #e0a800; --prod-fundo: #d94141;
    --ok: #7fe0a0; --ok-fundo: #143823; --info: #a9c1ff; --info-fundo: #182a58;
    --amarelo: #ffe08a; --amarelo-fundo: #463600; --laranja-t: #ffbf94; --laranja-fundo: #4a2208;
    --erro: #ffa8a1; --erro-fundo: #46181a; --roxo: #cdb4ff; --roxo-fundo: #2f1f55;
    --cinza: #c0c7d6; --cinza-fundo: #2a3142; --escuro: #0f1218; --escuro-fundo: #c9cfdd;
    --g-pront: #8a4a24; --sombra: 0 1px 2px rgba(0, 0, 0, .4);
  }
}

/* ---------------------------------------------------------------- 2. base */
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--fundo); color: var(--texto); font: 15px/1.5 "Segoe UI Variable Text", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif; font-variant-numeric: tabular-nums; overflow-x: hidden; }
a { color: var(--link); }
h1 { font-size: 1.45rem; line-height: 1.2; margin: 0; letter-spacing: -.01em; }
h2 { font-size: 1.05rem; margin: 0 0 var(--e3); }
p { margin: 0 0 var(--e3); }
:focus-visible { outline: none; box-shadow: var(--foco); border-radius: 6px; }
.ico { flex: none; display: block; }
.so-escuro { display: none; }
.so-claro { display: block; }
:root[data-tema="escuro"] .so-escuro { display: block; }
:root[data-tema="escuro"] .so-claro { display: none; }
@media (prefers-color-scheme: dark) {
  :root:not([data-tema="claro"]) .so-escuro { display: block; }
  :root:not([data-tema="claro"]) .so-claro { display: none; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* ---------------------------------------------------------------- 3. estrutura */
.faixa { padding: .5rem 16px; text-align: center; font-size: .95rem; }
.faixa-teste { background: var(--teste-fundo); color: var(--teste-texto); border-bottom: 3px solid var(--teste-borda); }
.faixa-producao { background: var(--prod-fundo); color: var(--prod-texto); font-weight: 600; }

.app { display: grid; grid-template-columns: minmax(0, 1fr); min-height: calc(100vh - 38px); }
.com-menu .app { grid-template-columns: 248px minmax(0, 1fr); }
.coluna { min-width: 0; display: flex; flex-direction: column; }

.sidebar { background: var(--menu-fundo); color: var(--menu-texto); position: sticky; top: 0; height: 100vh; align-self: start; display: flex; flex-direction: column; overflow-y: auto; z-index: 40; }
.logo { display: flex; align-items: center; gap: var(--e3); padding: 18px 16px 14px; }
.logo-marca { width: 38px; height: 38px; border-radius: 10px; background: var(--laranja); color: #fff; display: grid; place-items: center; flex: none; }
.logo-nome { font-weight: 700; color: #fff; line-height: 1.15; flex: 1; }
.logo-nome small { display: block; font-weight: 400; color: var(--menu-suave); font-size: .75rem; }
.menu { padding: 4px 10px 16px; flex: 1; }
.menu-grupo { text-transform: uppercase; letter-spacing: .08em; font-size: .68rem; font-weight: 700; color: var(--menu-suave); padding: 16px 10px 6px; }
.menu-item { position: relative; display: flex; align-items: center; gap: var(--e3); padding: 9px 10px; border-radius: var(--raio); color: var(--menu-texto); text-decoration: none; font-weight: 500; transition: background .15s; }
.menu-item:hover { background: rgba(255, 255, 255, .07); color: #fff; }
.menu-item[aria-current="page"] { background: var(--menu-ativo); color: #fff; }
.menu-item[aria-current="page"]::before { content: ""; position: absolute; left: -10px; top: 7px; bottom: 7px; width: 4px; border-radius: 0 4px 4px 0; background: var(--laranja); }
.menu-item[aria-current="page"] .ico { color: var(--laranja); }
.menu-rodape { padding: 12px 18px; font-size: .75rem; color: var(--menu-suave); border-top: 1px solid rgba(255, 255, 255, .08); }
.btn-icone.menu-fechar, .btn-icone.menu-abrir, .menu-fundo { display: none; }

.topbar { position: sticky; top: 0; z-index: 30; display: flex; align-items: center; gap: var(--e3); min-height: 60px; padding: 8px 20px; background: var(--papel); border-bottom: 1px solid var(--linha); }
.topbar-marca { font-weight: 700; }
.topbar-espaco { flex: 1; }
.empresa { display: flex; align-items: center; gap: var(--e3); min-width: 0; }
.empresa-icone { width: 36px; height: 36px; border-radius: 10px; background: var(--papel-2); display: grid; place-items: center; color: var(--suave); flex: none; }
.empresa-texto { display: grid; line-height: 1.2; min-width: 0; }
.empresa-texto strong { font-size: .95rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.empresa-texto small { color: var(--suave); font-size: .78rem; }
.amb { font-weight: 800; font-size: .78rem; letter-spacing: .06em; text-transform: uppercase; padding: 5px 11px; border-radius: 999px; white-space: nowrap; }
.amb-teste { background: var(--teste-fundo); color: var(--teste-texto); border: 2px solid var(--teste-borda); }
.amb-producao { background: var(--prod-fundo); color: var(--prod-texto); border: 2px solid var(--prod-fundo); }
.usuario { display: flex; align-items: center; gap: var(--e2); }
.avatar { width: 34px; height: 34px; border-radius: 50%; background: var(--laranja); color: #1a0f06; font-weight: 700; display: grid; place-items: center; }
.usuario-nome { font-weight: 600; font-size: .9rem; }
.sair { margin: 0; }

main { width: 100%; max-width: 1280px; margin: 0 auto; padding: var(--e5) 20px var(--e6); flex: 1; min-width: 0; }
.rodape { text-align: center; color: var(--suave); font-size: .78rem; padding: var(--e4); }
.sem-menu main { max-width: 480px; }

/* ---------------------------------------------------------------- 4. componentes */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: var(--e2); font: inherit; font-weight: 600; text-decoration: none; cursor: pointer; padding: 0 var(--e4); min-height: 44px; border-radius: var(--raio); border: 1px solid var(--linha); background: var(--papel); color: var(--texto); transition: background .15s, border-color .15s; }
.btn:hover { background: var(--papel-2); }
.btn-primary { background: var(--marca); border-color: var(--marca); color: var(--marca-texto); }
.btn-primary:hover { background: var(--marca-forte); border-color: var(--marca-forte); }
.btn-sutil { border-color: transparent; background: transparent; color: var(--suave); }
.btn:disabled { opacity: .55; cursor: not-allowed; }
.btn-icone { display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--raio); border: 1px solid transparent; background: transparent; color: var(--suave); cursor: pointer; padding: 0; }
.btn-icone:hover { background: var(--papel-2); color: var(--texto); }

.card { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-g); box-shadow: var(--sombra); padding: var(--e4); }
.caixa { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-g); box-shadow: var(--sombra); padding: var(--e5); }
.estreita { margin: var(--e5) auto; }
.estreita h1 { margin-bottom: var(--e4); }

label { display: grid; gap: 4px; font-size: .8rem; font-weight: 600; color: var(--suave); min-width: 0; }
input, select { font: inherit; font-weight: 400; color: var(--texto); background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio); padding: 0 .7rem; min-height: 42px; }
input:not([type="checkbox"]), select { width: 100%; min-width: 0; }
input[type="checkbox"] { width: 20px; height: 20px; min-height: 0; accent-color: var(--marca); }
input:focus-visible, select:focus-visible { outline: none; box-shadow: var(--foco); border-color: var(--laranja); }
.formulario { display: grid; gap: var(--e4); }

.pagina-topo { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--e3) var(--e4); margin-bottom: var(--e5); }
.pagina-topo p { margin: 2px 0 0; color: var(--suave); }

.filters { display: grid; grid-template-columns: repeat(auto-fit, minmax(128px, 1fr)); gap: var(--e3); align-items: end; margin-bottom: var(--e4); }
.filters .btn { width: 100%; }

.chips { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; background: var(--papel); border: 1px solid var(--linha); border-radius: 10px; }
.chip { display: inline-flex; align-items: center; min-height: 36px; padding: 0 var(--e3); border-radius: 7px; color: var(--texto); text-decoration: none; font-weight: 600; font-size: .9rem; }
.chip:hover { background: var(--papel-2); }
.chip[aria-current="true"] { background: var(--marca); color: var(--marca-texto); }

.pill { display: inline-flex; align-items: center; padding: 2px 10px; border-radius: 999px; font-size: .76rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; background: var(--cinza-fundo); color: var(--cinza); }
.pill.est-pendente { background: var(--info-fundo); color: var(--info); }
.pill.est-emitida { background: var(--ok-fundo); color: var(--ok); }
.pill.est-aguardando_cpf { background: var(--amarelo-fundo); color: var(--amarelo); }
.pill.est-aguardando_catalogo { background: var(--laranja-fundo); color: var(--laranja-t); }
.pill.est-cancelada { background: var(--escuro-fundo); color: var(--escuro); }
.pill.est-rejeitada, .pill.est-divergente { background: var(--erro-fundo); color: var(--erro); }
.pill.est-consultar { background: var(--roxo-fundo); color: var(--roxo); }

.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--e4); margin-bottom: var(--e4); }
.kpis-auto { grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.kpi { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--e3); background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-g); box-shadow: var(--sombra); padding: var(--e4); color: var(--texto); text-decoration: none; min-width: 0; }
a.kpi:hover { border-color: var(--laranja); }
.kpi-texto { display: grid; gap: 2px; min-width: 0; }
.kpi-nome { font-size: .82rem; font-weight: 600; color: var(--suave); }
.kpi-valor { font-size: 1.55rem; font-weight: 750; line-height: 1.15; letter-spacing: -.01em; }
.kpi-sub { font-size: .8rem; color: var(--suave); }
.kpi-icone { width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; flex: none; background: var(--cinza-fundo); color: var(--cinza); }
.kpi-icone.est-pendente { background: var(--info-fundo); color: var(--info); }
.kpi-icone.est-emitida { background: var(--ok-fundo); color: var(--ok); }
.kpi-icone.est-aguardando_cpf { background: var(--amarelo-fundo); color: var(--amarelo); }
.kpi-icone.est-aguardando_catalogo { background: var(--laranja-fundo); color: var(--laranja-t); }
.kpi-icone.est-rejeitada, .kpi-icone.est-divergente { background: var(--erro-fundo); color: var(--erro); }
.kpi-icone.est-consultar { background: var(--roxo-fundo); color: var(--roxo); }
.kpi-icone.est-cancelada { background: var(--escuro-fundo); color: var(--escuro); }

.tabela-card { background: var(--papel); border: 1px solid var(--linha); border-radius: var(--raio-g); box-shadow: var(--sombra); overflow: clip; }
.tabela-barra { display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3); padding: var(--e3) var(--e4); border-bottom: 1px solid var(--linha); }
.busca { position: relative; flex: 1 1 260px; max-width: 420px; }
.busca .ico { position: absolute; left: 12px; top: 11px; color: var(--suave); pointer-events: none; }
.busca input { padding-left: 38px; }
.soma { margin-left: auto; color: var(--suave); font-size: .88rem; }
.tabela-rolagem { overflow-x: auto; }
.table { border-collapse: collapse; width: 100%; font-size: .9rem; }
.table th, .table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--linha); vertical-align: middle; white-space: nowrap; }
.table th { background: var(--papel-2); font-size: .72rem; text-transform: uppercase; letter-spacing: .05em; color: var(--suave); font-weight: 700; }
.table tbody tr:hover td { background: var(--papel-2); }
.table tbody tr:last-child td { border-bottom: 0; }
.table .num { text-align: right; }
.table .col-marca { width: 44px; padding-right: 0; }
.table .acoes { text-align: right; white-space: nowrap; position: sticky; right: 0; background: var(--papel); box-shadow: -8px 0 8px -8px rgba(0, 0, 0, .18); }
.table th.acoes { background: var(--papel-2); }
.table tbody tr:hover td.acoes { background: var(--papel-2); }
.table tr.espera td.acoes { background: var(--laranja-fundo); }
.table tr.espera td { background: var(--laranja-fundo); }
.motivo { max-width: 14rem; overflow: hidden; text-overflow: ellipsis; color: var(--suave); font-size: .85rem; }
.chave { display: inline-flex; align-items: center; gap: 4px; font-family: ui-monospace, "Cascadia Mono", Consolas, monospace; font-size: .76rem; }
.chave-txt { max-width: 11rem; overflow: hidden; text-overflow: ellipsis; display: inline-block; vertical-align: middle; }
.table tr.detalhe td { background: var(--papel-2); white-space: normal; color: var(--suave); }
tr[hidden] { display: none; }
.icone { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; border: 0; background: transparent; color: var(--suave); cursor: pointer; text-decoration: none; padding: 0; }
.icone:hover { background: var(--papel-2); color: var(--texto); }
.icone-marca { color: var(--marca); }
.icone .ico { width: 18px; height: 18px; }
.plat { display: inline-grid; place-items: center; min-width: 26px; height: 22px; padding: 0 5px; margin-right: 8px; border-radius: 6px; font-size: .66rem; font-weight: 800; color: #fff; background: #5d657a; vertical-align: middle; }
.plat-ifood { background: #d7263d; }
.plat-deeliv { background: #2f6fed; }
.plat-cardapio { background: #0c7a54; }
.plat-pedzap { background: #1a8a4c; }

.barra-selecao { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: var(--e3); padding: var(--e3) var(--e4); background: var(--papel); border-top: 2px solid var(--laranja); box-shadow: 0 -6px 18px rgba(0, 0, 0, .1); }
.barra-selecao strong { margin-right: auto; }
.js .barra-selecao { display: none; }
.js .barra-selecao.com-selecao { display: flex; }

.aviso { padding: .7rem .9rem; border-radius: var(--raio); }
.aviso-erro { background: var(--erro-fundo); color: var(--erro); }
.aviso-info { background: var(--info-fundo); color: var(--info); }
.dica, .vazio { color: var(--suave); }
.vazio { padding: var(--e5); text-align: center; }
.texto { margin: 0; padding: var(--e4); overflow-x: auto; font: .82rem/1.45 ui-monospace, "Cascadia Mono", Consolas, monospace; }

/* ---------------------------------------------------------------- 5. paginas */
.atalhos { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--e4); margin-bottom: var(--e4); }
.atalho { display: flex; align-items: center; gap: var(--e4); padding: var(--e4) var(--e5); border-radius: var(--raio-g); text-decoration: none; font-weight: 700; font-size: 1.05rem; background: var(--papel); color: var(--texto); border: 1px solid var(--linha); box-shadow: var(--sombra); }
.atalho small { display: block; font-weight: 400; font-size: .85rem; color: var(--suave); }
.atalho .ico { width: 28px; height: 28px; }
.atalho-principal { background: var(--marca); color: var(--marca-texto); border-color: var(--marca); }
.atalho-principal small { color: inherit; opacity: .9; }
.atalho:hover { border-color: var(--laranja); }
.atalho-principal:hover { background: var(--marca-forte); }

.grafico-cab { display: flex; flex-wrap: wrap; justify-content: space-between; gap: var(--e2) var(--e4); margin-bottom: var(--e2); }
.grafico-cab h2 { margin: 0; }
.legenda { display: flex; gap: var(--e4); color: var(--suave); font-size: .82rem; }
.legenda i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; }
.grafico { width: 100%; height: auto; display: block; }
.g-linha { stroke: var(--linha); stroke-width: 1; }
.g-emit { fill: var(--laranja); }
.g-pront { fill: var(--g-pront); }
.g-rotulo { fill: var(--suave); font-size: 12px; text-anchor: middle; }
.g-valor { fill: var(--texto); font-size: 12px; font-weight: 700; text-anchor: middle; }
.g-sel .g-rotulo { fill: var(--texto); font-weight: 700; }

.ajuda-lista { display: grid; }
.ajuda-item { display: grid; grid-template-columns: 11.5rem minmax(0, 1fr); gap: var(--e4); align-items: start; padding: var(--e3) 0; border-bottom: 1px solid var(--linha); }
.ajuda-item:last-child { border-bottom: 0; }
.ajuda-item p { margin: 0; }

.login-marca { display: flex; align-items: center; gap: var(--e3); margin-bottom: var(--e4); font-weight: 700; font-size: 1.15rem; }
.login-marca .logo-marca { width: 46px; height: 46px; }

/* ---------------------------------------------------------------- 6. celular */
@media (max-width: 1100px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 900px) {
  .com-menu .app { grid-template-columns: minmax(0, 1fr); }
  .sidebar { position: static; height: auto; }  /* sem JavaScript o menu vira um bloco no alto da pagina */
  .js .sidebar { position: fixed; left: 0; top: 0; height: 100vh; width: 280px; max-width: 86vw; transform: translateX(-102%); transition: transform .2s; }
  .js.menu-aberto .sidebar { transform: none; box-shadow: 8px 0 30px rgba(0, 0, 0, .35); }
  .js.menu-aberto .menu-fundo { display: block; position: fixed; inset: 0; background: rgba(8, 10, 16, .55); z-index: 35; }
  .js .btn-icone.menu-abrir, .js.menu-aberto .btn-icone.menu-fechar { display: inline-grid; }
  .menu-fechar { margin-left: auto; color: var(--menu-texto); }
  .menu-item { min-height: 44px; }
  .table .acoes, .table th.acoes { position: static; box-shadow: none; }
}
@media (max-width: 640px) {
  main { padding: var(--e4) 16px var(--e5); }
  .topbar { padding: 8px 12px; gap: var(--e2); }
  .empresa-texto small, .usuario-nome, .so-largo, .empresa-icone { display: none; }
  .kpis-auto { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .kpi { padding: var(--e3); }
  .kpi-valor { font-size: 1.25rem; }
  .kpi-icone { width: 34px; height: 34px; border-radius: 10px; }
  .atalhos { grid-template-columns: minmax(0, 1fr); }
  .atalho { min-height: 64px; }
  .filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .filters > :last-child { grid-column: 1 / -1; }
  .ajuda-item { grid-template-columns: minmax(0, 1fr); gap: var(--e2); }
  .barra-selecao .btn { flex: 1 1 100%; }
  .soma { margin-left: 0; width: 100%; }
  .busca { max-width: none; }
  .caixa { padding: var(--e4); }
  .chips { width: 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .chip { justify-content: center; white-space: nowrap; padding: 0 var(--e2); }
  .chips input[type="date"] { grid-column: 1 / 3; }
}

/* ---------------------------------------------------------------- 7. ajustes finais */
.filters-topo { margin: 0; min-width: min(100%, 360px); grid-template-columns: minmax(0, 1fr) auto; }
.kpis-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 640px; }
.espaco-cima { margin-top: var(--e4); }
.barra-confirma { display: flex; flex-wrap: wrap; gap: var(--e3); margin: var(--e4) 0; }
.chips input[type="date"] { width: auto; min-height: 36px; border-color: transparent; background: transparent; }
.chips button.chip { border: 0; background: transparent; font: inherit; font-weight: 600; font-size: .9rem; cursor: pointer; }
.chips button.chip[aria-current="true"] { background: var(--marca); color: var(--marca-texto); }
.g-emit-cor { background: var(--laranja); }
.g-pront-cor { background: var(--g-pront); }
@media (max-width: 640px) { .filters-topo { grid-template-columns: minmax(0, 1fr); width: 100%; } .kpis-2 { max-width: none; } }