/* BI Comercial Domaná — complementos ao estilo.css herdado do dashboard
   financeiro (que fica idêntico ao original para manter a mesma aparência).
   Só usa os tokens já definidos em estilo.css, então o tema escuro funciona
   sem regras extras. */

/* faixa de preview com dados fictícios */
.faixa-ficticio{background:var(--amarelo-bg);color:var(--amarelo-txt);font-size:12px;text-align:center;padding:7px 16px;border-bottom:1px solid color-mix(in srgb, var(--amarelo-txt) 20%, transparent);}

/* filtros no topo (mesmo .filtro/.fsel do financeiro); os grupos não criam caixa própria */
.fdata{border:0;background:transparent;font-size:13px;font-weight:600;color:var(--texto);padding:8px 6px 8px 2px;min-height:40px;}
.fdata:focus{outline:none;}
/* Desktop: título e tema na primeira linha; filtros numa grade de colunas
   iguais logo abaixo, ocupando toda a largura (alinhados entre si). */
.filtros-grupo{display:contents;}
.topo-botoes{display:flex;align-items:center;gap:10px;}
.topo .topo-acoes{flex-basis:100%;display:grid;grid-template-columns:repeat(6, minmax(0, 1fr));gap:10px;}
/* 12 filtros: 6 colunas = 2 linhas cheias; em telas médias, 4 colunas = 3 linhas cheias */
@media (max-width: 1280px){ .topo .topo-acoes{grid-template-columns:repeat(4, minmax(0, 1fr));} }
.topo-acoes .filtro{min-width:0;}
.topo-acoes .fsel, .topo-acoes .fdata{flex:1;min-width:0;width:100%;max-width:none;}
.sem-filtros .topo-acoes, .sem-filtros .btn-filtros-celular{display:none !important;}
.btn-filtros-celular{display:none;align-items:center;gap:8px;min-height:42px;padding:0 14px;background:var(--superficie);border:1px solid var(--cinza-borda);border-radius:10px;font-size:13px;font-weight:700;color:var(--texto);cursor:pointer;}
.btn-filtros-celular svg{width:16px;height:16px;}
.btn-filtros-celular[aria-expanded="true"]{background:var(--superficie-2);}
.contador-filtros{min-width:20px;height:20px;border-radius:10px;background:var(--roxo);color:#FFFFFF;font-size:11px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;}

/* cartões de indicador: estado da regra + ações */
.kpi-sub{font-size:12px;color:var(--texto-3);}
.kpi-rodape{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:8px;flex-wrap:wrap;}
.kpi-botoes{display:flex;gap:4px;}
.btn-link{background:none;border:0;padding:4px 6px;min-height:28px;border-radius:6px;font-size:12px;font-weight:700;color:var(--roxo-txt);cursor:pointer;}
.btn-link:hover{background:var(--roxo-claro);}
.selo-regra{font-size:10px;font-weight:700;letter-spacing:.3px;border-radius:20px;padding:2px 8px;white-space:nowrap;}
.selo-regra.homologado{background:var(--verde-bg);color:var(--verde);}
.selo-regra.pendente{background:var(--amarelo-bg);color:var(--amarelo-txt);}
.selo-regra.indisponivel{background:var(--superficie-2);color:var(--texto-4);}
.kc-indisponivel .kv{color:var(--texto-fraco) !important;}
.kv-indisp{font-size:16px;font-weight:600;}
/* volume por unidade: cada unidade é um item que quebra para a linha de baixo, nunca é cortado */
.kv.kv-unidades{font-size:17px;white-space:normal;line-height:1.35;display:flex;flex-wrap:wrap;gap:2px 12px;}
.kv-unidades small{font-size:11px;font-weight:600;color:var(--texto-3);}

/* barras com participação e itens clicáveis (detalhamento) */
.bpct{font-size:11px;color:var(--texto-3);min-width:46px;text-align:right;font-variant-numeric:tabular-nums;}
.clicavel{cursor:pointer;border-radius:6px;}
.br.clicavel:hover, .br.clicavel:focus-visible{background:var(--hover-linha);}
.card-largo{grid-column:1 / -1;}

/* tabelas de dados */
.tabela-dados td.num, .tabela-dados th.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap;}
.tabela-dados tr.clicavel:hover td{background:var(--hover-linha);}
.tabela-dados .linha-total td{font-weight:700;background:var(--roxo-claro);color:var(--roxo-txt);}
.neg-v{color:var(--vermelho);font-weight:600;}
.paginacao{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;}
.paginacao .nota{margin:0;}
.paginacao-botoes{display:flex;gap:6px;}
.btn:disabled{opacity:.5;cursor:default;}

/* avisos dentro das telas */
.aviso-bloco{display:flex;flex-wrap:wrap;gap:4px 8px;border-radius:12px;padding:12px 16px;font-size:13px;border:1px solid transparent;}
.aviso-bloco.info{background:var(--verde-marca-bg);color:var(--verde-marca-txt);}
.aviso-bloco.alerta{background:var(--amarelo-bg);color:var(--amarelo-txt);}
.aviso-bloco.erro{background:var(--vermelho-bg);color:var(--vermelho);}
.bloco-indisp{background:var(--superficie-2);border-radius:10px;}

/* drill empresa -> filial (visual da hierarquia do fluxo de caixa) */
.drill{min-width:520px;}
.drill-cab, .drill-linha{display:grid !important;grid-template-columns:minmax(200px, 1.6fr) repeat(var(--colunas), minmax(120px, 1fr));gap:8px;align-items:center;}
.drill-cab{padding:6px 12px;font-size:11px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--texto-3);}
.drill-cab span:not(:first-child), .drill-linha > span:not(:first-child){text-align:right;font-variant-numeric:tabular-nums;}

/* modais */
.modal-largo{max-width:960px;}
.modal-cabeca{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;}
.modal-cabeca h2{margin-bottom:2px;}
.modal-cabeca .btn-fechar-menu{display:flex;color:var(--texto);}
.regra-status{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:13px;margin-bottom:10px;}
.regra-h{font-size:12px;font-weight:700;letter-spacing:.6px;text-transform:uppercase;color:var(--texto-3);margin:14px 0 4px;}
.regra-txt{font-size:13px;line-height:1.55;color:var(--texto-2);}
.regra-col{min-width:320px;white-space:normal;}

/* administração: fontes */
.g3{display:grid;grid-template-columns:repeat(auto-fit, minmax(290px, 1fr));gap:16px;}
.fonte-card{display:flex;flex-direction:column;gap:12px;}
.fonte-cabeca{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;}
.fonte-dados{display:grid;grid-template-columns:1fr 1fr;gap:10px 14px;}
.fonte-dados dt{font-size:11px;font-weight:700;letter-spacing:.4px;text-transform:uppercase;color:var(--texto-3);}
.fonte-dados dd{font-size:13px;font-weight:600;}
.fonte-acoes{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;}
.status-pill.w{background:var(--amarelo-bg);color:var(--amarelo-txt);}
.status-pill.n{background:var(--superficie-2);color:var(--texto-4);}
.dropzone.desabilitado{cursor:not-allowed;opacity:.7;}

@media (max-width: 860px){
  /* Celular: filtros recolhidos atrás do botão "Filtros"; abertos, em 2 colunas compactas. */
  .btn-filtros-celular{display:inline-flex;}
  .topo .topo-acoes{display:none;grid-template-columns:repeat(2, minmax(0, 1fr));gap:8px;}
  .topo.filtros-abertos .topo-acoes{display:grid;}
  .topo-acoes .filtro{min-height:38px;padding-left:10px;flex-direction:column;align-items:flex-start;justify-content:center;gap:0;padding-top:4px;padding-bottom:2px;}
  .topo-acoes .filtro-rotulo{font-size:9px;}
  .topo-acoes .fsel, .topo-acoes .fdata{min-height:28px;padding-top:2px;padding-bottom:2px;font-size:12px;padding-left:0;}
  .topo-acoes .fsel{background-position:right 4px center;padding-right:20px;}
}
@media (max-width: 560px){
  .fonte-dados{grid-template-columns:1fr;}
  .bpct{min-width:40px;}
}

/* gráficos de linha escalam com o cartão; barras cabem em cartões estreitos */
.grafico-linha{display:block;width:100%;height:auto;}
.card .br .bn{width:clamp(84px, 36%, 190px);}
.card .br .bv{min-width:0;}
.modal .tabela-dados td{white-space:nowrap;}

/* gráfico de linha largo: sem limite ele cresce com a largura e as letras ficam enormes */
.card-largo .grafico-linha{max-height:300px;}