/* dashboard.css — painel do supervisor.
   Não redefine identidade: herda as variáveis do styles.css.
   Se os nomes dos tokens no seu styles.css forem outros, troque só este bloco
   :root — o resto do arquivo consome apenas as variáveis --dash-*. */
:root {
  --dash-fundo:   var(--fundo,   #f4f2ee);
  --dash-papel:   var(--papel,   #ffffff);
  --dash-tinta:   var(--tinta,   #1c1c1c);
  --dash-suave:   var(--suave,   #6f6a63);
  --dash-linha:   var(--linha,   #ddd8d0);
  --dash-acento:  var(--acento,  #1c1c1c);
  --dash-raio:    var(--raio,    4px);
}

.dash {
  padding: 16px 14px 40px;
  color: var(--dash-tinta);
  background: var(--dash-fundo);
  min-height: 100vh;
}

.dash__topo {
  display: flex; align-items: flex-start; justify-content: space-between;
  gap: 12px; margin-bottom: 14px;
}
.dash__titulo { font-size: 1.15rem; margin: 0; letter-spacing: .04em; text-transform: uppercase; }
.dash__sub    { margin: 2px 0 0; font-size: .78rem; color: var(--dash-suave); }
.dash__sair {
  background: none; border: 1px solid var(--dash-linha); border-radius: var(--dash-raio);
  padding: 6px 12px; font: inherit; font-size: .8rem; color: var(--dash-tinta); cursor: pointer;
}

/* filtros */
.dash__filtros {
  display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end;
  padding-bottom: 14px; margin-bottom: 4px; border-bottom: 1px dashed var(--dash-linha);
}
.dash__campo { display: flex; flex-direction: column; gap: 4px; font-size: .72rem; color: var(--dash-suave); }
.dash__campo span { letter-spacing: .08em; text-transform: uppercase; }
.dash__campo select, .dash__campo input {
  font: inherit; font-size: .9rem; color: var(--dash-tinta);
  padding: 7px 9px; border: 1px solid var(--dash-linha); border-radius: var(--dash-raio);
  background: var(--dash-papel);
}
.dash__periodo { display: flex; flex-wrap: wrap; gap: 6px; }
.dash__chip {
  font: inherit; font-size: .82rem; cursor: pointer;
  padding: 7px 12px; border: 1px solid var(--dash-linha); border-radius: 999px;
  background: var(--dash-papel); color: var(--dash-tinta);
}
.dash__chip--on { background: var(--dash-acento); color: var(--dash-papel); border-color: var(--dash-acento); }
.dash__datas { display: flex; gap: 8px; }

/* seções e cartões */
.dash__secao { margin-top: 22px; }
.dash__h2 {
  font-size: .74rem; letter-spacing: .12em; text-transform: uppercase;
  color: var(--dash-suave); margin: 0 0 10px;
}
.dash__grade { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
@media (min-width: 720px) { .dash__grade { grid-template-columns: repeat(4, 1fr); } }

.dash-card {
  background: var(--dash-papel); border: 1px solid var(--dash-linha);
  border-radius: var(--dash-raio); padding: 12px 12px 10px;
  display: flex; flex-direction: column; gap: 2px;
}
.dash-card--destaque { border-color: var(--dash-acento); }
.dash-card__rotulo { font-size: .68rem; letter-spacing: .08em; text-transform: uppercase; color: var(--dash-suave); }
.dash-card__valor  { font-size: 1.6rem; line-height: 1.1; font-variant-numeric: tabular-nums; }
.dash-card__apoio  { font-size: .72rem; color: var(--dash-suave); }

/* barras */
.dash-barras {
  display: flex; align-items: flex-end; gap: 4px; overflow-x: auto;
  background: var(--dash-papel); border: 1px solid var(--dash-linha);
  border-radius: var(--dash-raio); padding: 10px 8px;
}
.dash-barras__col { flex: 1 0 26px; display: flex; flex-direction: column; align-items: center; gap: 3px; }
.dash-barras__num { font-size: .64rem; color: var(--dash-suave); font-variant-numeric: tabular-nums; min-height: .8em; }
.dash-barras__trilho { width: 100%; height: 108px; display: flex; align-items: flex-end; }
.dash-barras__total {
  width: 100%; background: var(--dash-linha); border-radius: 2px 2px 0 0;
  display: flex; align-items: flex-end; min-height: 2px;
  transition: height .25s ease;
}
.dash-barras__conv { width: 100%; background: var(--dash-acento); border-radius: 2px 2px 0 0; }
.dash-barras__rotulo { font-size: .62rem; color: var(--dash-suave); white-space: nowrap; }
.dash__legenda { font-size: .7rem; color: var(--dash-suave); margin: 6px 0 0; }

/* tabelas */
.dash-tabela {
  width: 100%; border-collapse: collapse; background: var(--dash-papel);
  border: 1px solid var(--dash-linha); border-radius: var(--dash-raio); overflow: hidden;
  font-size: .86rem;
}
.dash-tabela th, .dash-tabela td { padding: 8px 10px; border-bottom: 1px solid var(--dash-linha); text-align: left; }
.dash-tabela th { font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--dash-suave); }
.dash-tabela tr:last-child td { border-bottom: none; }
.dash-num { text-align: right; font-variant-numeric: tabular-nums; }

.dash-vazio { font-size: .82rem; color: var(--dash-suave); margin: 6px 0; }
.dash-erro {
  font-size: .82rem; padding: 8px 10px; border-radius: var(--dash-raio);
  border: 1px solid var(--dash-acento); background: var(--dash-papel);
}
.dash__rodape { margin-top: 26px; font-size: .72rem; color: var(--dash-suave); }

@media (prefers-reduced-motion: reduce) { .dash-barras__total { transition: none; } }