/* ===== Layout: viewport fixo, páginas sem scroll no corpo ===== */
.tab-panel { display: none; height: 100%; flex-direction: column; gap: 1rem; }
.tab-panel.active { display: flex; }
.kpi-row   { height: 252px; flex: none; }
.chart-row { flex: 1 1 0; min-height: 0; }

/* ===== Barra lateral ===== */
.nav-item {
  display: block; width: 100%; text-align: left;
  padding: 11px 22px;
  font-size: 13.5px; font-weight: 400;
  color: rgba(255, 255, 255, .88);
  border-left: 3px solid transparent;
  transition: background .15s;
}
.nav-item:hover { background: rgba(255, 255, 255, .09); }
.nav-item.active {
  background: #0d3f85; border-left-color: #9cc3f0;
  font-weight: 700; color: #fff;
}

/* ===== Cabeçalho ===== */
.header-sky { background: #dce9f8; }

.page-title { font-size: 27px; font-weight: 800; color: #123c86; line-height: 1.1; }
.page-sub   { font-size: 13.5px; font-weight: 600; color: #5b7290; margin-top: 1px; }

.pt-label { font-size: 13px; font-weight: 700; color: #123c86; }

/* ===== Selects ===== */
.pt-select {
  appearance: none; -webkit-appearance: none;
  padding: 7px 30px 7px 11px;
  font-size: 13px; font-weight: 600; color: #123c86;
  background: #fff url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23123c86' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E") no-repeat right 10px center;
  border: 1px solid #b7cfec; border-radius: 3px;
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(18, 60, 134, .08);
}
.pt-select:hover { border-color: #7fa8d9; }
.pt-select:focus { outline: 2px solid #a9c7ef; border-color: #4ba3e3; }

/* ===== Cartões ===== */
.chart-card, .kpi-card {
  background: #fff;
  border: 1px solid #d5e0f1;
  border-radius: 4px;
  min-height: 0;
}
.chart-card {
  display: flex; flex-direction: column; padding: 13px 15px 11px;
  overflow: hidden;
}
.card-title { font-size: 13.5px; font-weight: 700; color: #123c86; }
.card-cap   { font-size: 11px; color: #7d92ad; min-width: 0; }

.kpi-card {
  background: #e9effa;
  display: flex; flex-direction: column; justify-content: center; align-items: center;
  text-align: center;
  padding: 8px 16px;
  transition: opacity .2s, filter .2s, box-shadow .2s;
}
.kpi-label { font-size: 13.5px; font-weight: 700; color: #123c86; }
.kpi-value { font-size: 38px; font-weight: 700; color: #123c86; line-height: 1.12; }
.kpi-sub   { font-size: 11.5px; color: #64748b; margin-top: 3px; max-width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.kpi-card.kpi-dim  { opacity: .35; filter: grayscale(.5); }
.kpi-card.kpi-ring { box-shadow: 0 0 0 2px var(--accent, #123c86); }

.chart-canvas-wrap { position: relative; flex: 1 1 0; min-height: 0; }
.clickable canvas { cursor: pointer; }

/* ===== Mapa de freguesias (coropleto) ===== */
.map-host svg { display: block; }
.map-host path:hover { stroke: #123c86; stroke-width: 2; }
.map-leg-txt { font-size: 9.5px; fill: #5b7290; }
.map-tip {
  position: absolute; z-index: 50; pointer-events: none;
  display: none;
  background: #fff; border: 1px solid #d5e0f1; border-radius: 6px;
  box-shadow: 0 4px 14px rgba(18, 60, 134, .18);
  padding: 7px 11px; font-size: 11.5px; color: #1e293b;
  max-width: 270px; white-space: normal; line-height: 1.45;
}
.map-tip b { color: #123c86; font-size: 12px; }

/* ===== Chips de filtros ativos ===== */
.chip {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 3px 6px 3px 11px;
  font-size: 12px; font-weight: 600;
  color: #1e40af; background: #dbeafe;
  border: 1px solid #93c5fd; border-radius: 9999px;
  white-space: nowrap;
}
.chip button {
  display: flex; align-items: center; justify-content: center;
  width: 17px; height: 17px; border-radius: 9999px;
  font-size: 12px; line-height: 1; color: #1d4ed8;
}
.chip button:hover { background: #93c5fd; color: #172554; }

.clear-btn {
  font-size: 12px; font-weight: 600; color: #64748b;
  padding: 3px 8px; border-radius: 7px;
}
.clear-btn:hover { color: #e11d48; background: #ffe4e6; }

/* ===== Separador Comparar ===== */
.chip-off { background: #fff; color: #64748b; border-color: #d5e0f1; }
.chip-off:hover { border-color: #93c5fd; color: #1e40af; }
.mode-btn {
  font-size: 11.5px; font-weight: 700; color: #5b7290;
  background: #fff; border: 1px solid #d5e0f1;
  padding: 5px 11px; border-radius: 3px;
}
.mode-btn.active { background: #123c86; border-color: #123c86; color: #fff; }
.mode-btn:hover:not(.active) { border-color: #7fa8d9; color: #123c86; }

/* ===== Mapa de calor (época × entidade) ===== */
.heatmap-host { overflow: auto; }
.heat-table {
  width: 100%; height: 100%;
  border-collapse: separate; border-spacing: 2px;
  font-size: 11px;
}
.heat-table th {
  font-weight: 700; color: #123c86; font-size: 10.5px;
  padding: 2px 4px; text-align: center; vertical-align: bottom;
}
.heat-table td {
  text-align: center; border-radius: 3px;
  font-variant-numeric: tabular-nums; padding: 2px 4px; color: #1e293b;
}
.heat-table td.rowlbl { text-align: right; color: #5b7290; font-weight: 600; }

/* ===== Separador Dados (quadros brutos) ===== */
.chart-card.no-pad { padding: 0; }
.btn-navy {
  background: #123c86; color: #fff;
  font-size: 12px; font-weight: 700;
  padding: 7px 14px; border-radius: 3px;
  box-shadow: 0 1px 2px rgba(18, 60, 134, .25);
  transition: background .15s;
}
.btn-navy:hover { background: #0d2f6b; }

.data-table {
  border-collapse: separate; border-spacing: 0;
  font-size: 11.5px; width: max-content; min-width: 100%;
}
.data-table th, .data-table td {
  border-bottom: 1px solid #e4ebf5;
  border-right: 1px solid #eef2f9;
  padding: 5px 9px;
  white-space: nowrap;
}
.data-table thead th {
  position: sticky; top: 0; z-index: 2;
  background: #e9effa; color: #123c86;
  font-weight: 700; text-align: right;
}
.data-table .col-geo, .data-table .col-code { text-align: left; }
.data-table .col-geo {
  width: 250px; min-width: 250px; max-width: 250px;
  overflow: hidden; text-overflow: ellipsis;
}
.data-table .col-code { width: 76px; min-width: 76px; }
.data-table .sticky-1 { position: sticky; left: 0; z-index: 1; background: #fff; }
.data-table .sticky-2 { position: sticky; left: 250px; z-index: 1; background: #fff; color: #64748b; }
.data-table thead .sticky-1, .data-table thead .sticky-2 { z-index: 3; }
.data-table td.num {
  text-align: right;
  font-variant-numeric: tabular-nums;
  color: #1e293b;
}
.data-table tbody tr:hover td { background: #f1f5fc; }
.data-table tbody tr.lvl-supra .col-geo { color: #64748b; font-style: italic; }
.data-table tbody tr.lvl-mun   .col-geo { font-weight: 700; }

/* ===== Barras de scroll (só visíveis abaixo da largura mínima) ===== */
::-webkit-scrollbar { height: 10px; width: 10px; }
::-webkit-scrollbar-thumb { background: #b7cfec; border-radius: 8px; }
::-webkit-scrollbar-track { background: #eef2fa; }