/* ==========================================================================
   SelettaONE -- DRE: tipografia e marcador  (pacote 184, v1.58, 24/set/2026)

   Pedido do Gil, em nome da Monica: o triangulinho que abre o detalhe das
   linhas do DRE era tao pequeno e tao apagado (10px, cor --ink-3) que ela
   achou que era sujeira na tela. Aqui ele vira um botao redondo, verde,
   do tamanho de um clique de verdade -- e continua girando ao abrir, que
   e o que a style.css ja fazia.

   E, no mesmo pedido: "aumenta mais 1 ponto a fonte das informacoes do
   DRE no geral, e para valores aumenta 1.5".
     1 pt   = 1,33 px  -> texto:  14 px vira 15,3 px
     1,5 pt = 2,00 px  -> valores: 14 px vira 16 px
   Cada linha abaixo traz o tamanho antigo no comentario, pra conferencia.

   POR QUE UM ARQUIVO NOVO E NAO UM REMENDO NA style.css: a style.css
   e grande e mexida por varios pacotes; um arquivo separado, carregado
   DEPOIS dela, faz o mesmo efeito e desfaz-se tirando uma linha do
   index.html. Nada da style.css foi tocado.

   ESCOPO: tudo aqui exige a classe .dre-principal, que so existe nas
   DUAS tabelas da tela DRE (a cascata e o "Como o CMV foi formado").
   As outras ~17 tabelas do portal usam .dre-table tambem e NAO mudam.
   ========================================================================== */

/* ---- 1. Texto do DRE: +1 pt ---------------------------------------- */

.dre-principal thead th          { font-size: 12.8px; }   /* era 11,5 px */
.dre-principal tbody td          { font-size: 15.3px; }   /* era 14 px   */
.dre-principal tr.dre-nivel-1 .dre-nome { font-size: 13.8px; } /* era 12,5 px */
.dre-principal td.dre-pct        { font-size: 13.3px; }   /* era 12 px   */
.dre-principal .dre-nota         { font-size: 11.8px; }   /* era 10,5 px */
.dre-principal .dre-sep-row td   { font-size: 11.8px; }   /* era 10,5 px */

/* detalhe que abre embaixo da linha (lancamento a lancamento) */
.dre-principal .dre-detalhe-row th,
.dre-principal .dre-detalhe-row td { font-size: 13.3px; } /* era 12 px */
.dre-principal .dre-sub-bloco    { font-size: 13.8px; }   /* era 12,5 px */
.dre-principal .dre-sub-cab      { font-size: 12.3px; }   /* era 11 px   */

/* ---- 2. Valores: +1,5 pt ------------------------------------------- */
/* Coluna "Valor" da cascata, coluna "Valor" do bloco do CMV (usa .num)
   e o total de cada subcategoria no detalhe. O % e o "vs. mes anterior"
   nao sao valores em R$ -- ficam com o +1 pt do bloco de cima. */

.dre-principal td.dre-valor      { font-size: 16px; }     /* era 14 px */
/* a tabela do CMV nao usa .dre-valor; la a coluna do R$ e a 2a (.num) */
.dre-principal tbody td.num:nth-of-type(2) { font-size: 16px; }  /* era 14 px */
.dre-principal .dre-sub-valor    { font-size: 14.5px; }   /* era 12,5 px */

/* ---- 3. O marcador (o "sujeirinha" da Monica) ----------------------- */
/* Vira um botao redondo verde-Seletta. O :empty logo abaixo garante que
   as linhas que NAO abrem detalhe continuem sem bolinha nenhuma -- elas
   usam o mesmo <span> vazio so pra alinhar o texto, e por isso ele guarda
   a MESMA largura: assim "Receita Bruta" (que abre) e "Receita Liquida"
   (que nao abre) comecam exatamente na mesma coluna. */

.dre-principal .dre-caret,
.dre-principal .dre-sub .dre-sub-nome .dre-caret,
.fc-metodologia .dre-caret {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  border-radius: 50%;
  background: var(--accent-wash);
  color: var(--accent);
  font-size: 12.5px;
  line-height: 1;
  vertical-align: middle;
  transition: transform .12s ease, background .12s ease;
}

/* dentro do paragrafo explicativo o circulo acompanha o texto, menor */
.fc-metodologia .dre-caret { width: 17px; height: 17px; flex: 0 0 17px; font-size: 11px; }

.dre-principal .dre-caret:empty,
.dre-principal .dre-sub .dre-sub-nome .dre-caret:empty {
  background: none;
}

/* a linha inteira fica com cara de clicavel, nao so a bolinha */
.dre-principal tr.dre-clicavel:hover .dre-caret,
.dre-principal .dre-sub > summary:hover .dre-caret {
  background: var(--accent);
  color: var(--accent-ink);
}

/* o giro ao abrir ja existe na style.css (tr.dre-aberta) e no estilo que
   o app.js injeta (.dre-sub[open]); as duas regras continuam valendo. */


/* ==========================================================================
   ADENDO DO PACOTE 185 (v1.59, 24/set/2026) -- O ZERO COM PONTO NO MEIO

   Gil, olhando a tela: "esses numeros 0 tem uma bolinha no meio que tambem
   polui visualmente". A bolinha nao e sujeira nem erro: e o desenho do zero
   da IBM Plex Mono, a fonte monoespacada que a style.css usa em toda coluna
   de numero do portal. Nao da pra apagar so o ponto -- ele faz parte da
   letra. O jeito e trocar a fonte.

   Escolha do Gil (24/set): usar a MESMA fonte do resto do portal (IBM Plex
   Sans, a dos cards grandes acima da tabela, cujo zero e liso), e aplicar
   isso no PORTAL TODO, nao so no DRE -- senao cada tela ficaria com um
   numero de cara diferente.

   O alinhamento das colunas continua: font-variant-numeric: tabular-nums
   faz todo algarismo ocupar a mesma largura, que e o unico motivo real de
   usar monoespacada numa tabela de numeros.

   ESCOPO: so CELULA DE TABELA (td/th). Os <span class="mono"> que aparecem
   no meio de textos explicativos (ex: "Resultado apos alocacoes = ...")
   continuam monoespacados de proposito -- ali a fonte de maquina de
   escrever e o que marca que aquilo e uma formula.
   ========================================================================== */

td.num, th.num,
td.mono, th.mono,
.dre-table td.dre-valor,
.dre-table td.dre-pct,
.dre-table td.dre-delta,
.dre-sub-valor,
.dre-sub-pct,
.dre-sub-qtd {
  font-family: 'IBM Plex Sans', system-ui, -apple-system, sans-serif;
  font-variant-numeric: tabular-nums;
}