/* Ajustes visuais do Scrooge. As cores e fontes vêm do tema (Tema/TemaScrooge.cs); aqui ficam só os detalhes
   que o MudBlazor não expõe pelo tema: bordas dos cartões, menu lateral, gráficos e números tabulares. */

html, body {
  font-family: 'Inter', 'Roboto', sans-serif;
  margin: 0;
  background: #F6F4EF;
  -webkit-font-smoothing: antialiased;
}

/* Números alinhados em coluna (a Inter tem algarismos tabulares). */
body {
  font-variant-numeric: tabular-nums;
}

.carregando {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100vh;
  color: #6E6B64;
}

/* ---- Cartões e tabelas: borda fina + sombra suave (a sombra vem do tema) ---- */
.mud-paper.mud-elevation-1,
.mud-paper.mud-elevation-2,
.mud-paper.mud-elevation-3,
.mud-table.mud-elevation-1 {
  border: 1px solid var(--mud-palette-lines-default);
}

/* Tabelas dentro de um cartão não ganham borda nem sombra próprias. */
.mud-paper .mud-simple-table,
.mud-paper .mud-table {
  border: none;
  box-shadow: none;
}

/* Diálogos e menus flutuantes continuam sem borda. */
.mud-dialog.mud-paper,
.mud-popover .mud-paper,
.mud-menu-list.mud-paper {
  border: none;
}

/* Rótulos pequenos em caixa alta (título dos KPIs) em cinza. */
.mud-typography-overline {
  color: var(--mud-palette-text-secondary);
}

/* ---- Barra superior ---- */
.barra-superior {
  border-bottom: 1px solid rgba(255, 255, 255, 0.06);
}

/* ---- Menu lateral escuro ---- */
.mud-drawer {
  border-right: 1px solid rgba(255, 255, 255, 0.06);
}

.menu-lateral {
  padding: 10px 10px;
}

.menu-lateral .mud-nav-link {
  position: relative;
  font-size: .875rem;
  font-weight: 500;
}

.menu-lateral .mud-nav-link:hover:not(.active):not(.mud-nav-link-disabled) {
  background-color: rgba(255, 255, 255, 0.05);
}

.mud-drawer .mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(.mud-nav-link-disabled),
.mud-drawer .mud-navmenu.mud-navmenu-default .mud-nav-link.active:not(.mud-nav-link-disabled):hover:not(.mud-nav-link-disabled) {
  color: #E2B94B;
  background-color: rgba(226, 185, 75, 0.10);
}

.mud-drawer .mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled) .mud-nav-link-icon {
  color: #E2B94B;
}

.mud-drawer .mud-navmenu .mud-nav-link.active:not(.mud-nav-link-disabled)::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 8px;
  bottom: 8px;
  width: 3px;
  border-radius: 0 3px 3px 0;
  background: #E2B94B;
}

.menu-secao {
  display: block;
  padding: 18px 16px 6px;
  color: #6F6B62;
}

/* ---- Gráficos (MudChart): eixos discretos e grade mais leve ---- */
.mud-chart .mud-charts-xaxis,
.mud-chart .mud-charts-yaxis {
  fill: var(--mud-palette-text-secondary);
  font-size: 11px;
}

.mud-chart .mud-charts-gridlines-yaxis,
.mud-chart .mud-charts-gridlines-xaxis-lines,
.mud-chart .mud-chart-grid-line {
  stroke: var(--mud-palette-lines-default);
}

.mud-chart .mud-chart-legend .mud-chart-legend-item {
  font-size: .8125rem;
  color: var(--mud-palette-text-secondary);
}

.mud-chart .mud-chart-legend .mud-chart-legend-item .mud-chart-legend-marker {
  height: 9px;
  width: 9px;
}

/* ---- Início: barras de limite e marcador de "hoje" ---- */
.barra-limite {
  position: relative;
  padding: 6px 0;
}

.barra-limite .mud-progress-linear {
  height: 6px !important;
}

.barra-limite .marca-hoje {
  position: absolute;
  top: 2px;
  bottom: 2px;
  width: 2px;
  border-radius: 1px;
  background: #C9A24A;
}

/* Marcador colorido nas legendas em tabela (categorias do donut). */
.marcador-serie {
  display: inline-block;
  width: 9px;
  height: 9px;
  border-radius: 50%;
  margin-right: 8px;
  vertical-align: middle;
}

#blazor-error-ui {
  background: #C0392B;
  color: #fff;
  bottom: 0;
  left: 0;
  display: none;
  padding: 0.6rem 1.25rem 0.7rem;
  position: fixed;
  width: 100%;
  z-index: 1000;
}

#blazor-error-ui .dismiss,
#blazor-error-ui .reload {
  color: #fff;
  cursor: pointer;
  margin-left: 0.75rem;
}