/* HOME — apenas estilos específicos da página.
   O “casco” dos cards e a tipografia ficam idênticos aos outros módulos. */

/* ====== KPIs (cards do topo) ====== */
.summary-cards-row{
  display:grid;
  grid-template-columns:repeat(4, minmax(240px,1fr));
  gap:16px;
  margin-bottom:16px;
}

.summary-card{
  background:#fff;
  border:1px solid var(--bs-border-color);
  border-radius:12px;
  padding:16px 20px;
  box-shadow:0 4px 12px rgba(25,70,133,.06);
  display:flex; align-items:center; gap:1rem;
  min-width:220px;
}
.summary-card .icon{ font-size:2.25rem; color:var(--fnp-blue); margin-bottom:.25rem; }
.summary-card h6{ margin:0 0 .25rem; color:#6c757d; font-size:.95rem; font-weight:600; }
.summary-card .value{ font-size:1.6rem; font-weight:700; color:var(--fnp-blue); }
.summary-card .sub-value{ font-size:.85rem; color:#6c757d; }

/* Responsivo */
@media (max-width:1199.98px){ .summary-cards-row{ grid-template-columns:repeat(3,1fr);} }
@media (max-width:991.98px){  .summary-cards-row{ grid-template-columns:repeat(2,1fr);} }
@media (max-width:575.98px){  .summary-cards-row{ grid-template-columns:1fr;} }

/* ====== Blocos de conteúdo (gráfico / tabelas) ====== */
.chart-card,
.table-card{
  background:#fff;
  border:1px solid var(--bs-border-color);
  border-radius:12px;
  padding:16px 20px;
  box-shadow:0 4px 12px rgba(25,70,133,.06);
  margin-bottom:16px;
}

.chart-card>h5,
.table-card>h5{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin:0 0 12px 0;
  color:var(--fnp-blue);
  font-weight:700;
  font-size:1.125rem; /* ~18px */
  line-height:1.25;
}

/* Controles no cabeçalho dos cards */
.chart-card .chart-controls,
.table-card .table-controls{ display:flex; gap:.75rem; }

.chart-card .chart-controls .btn-group,
.table-card .table-controls .btn-group{
  border:1px solid var(--bs-border-color);
  border-radius:.375rem;
  overflow:hidden;
}

.chart-card .chart-controls .btn,
.table-card .table-controls .btn{
  padding:.25rem .75rem;
  font-size:.8rem;
  color:var(--fnp-blue);
  background:#fff;
  border-radius:0;
}

.chart-card .chart-controls .btn.active,
.table-card .table-controls .btn.active{
  background:var(--fnp-blue);
  color:#fff;
  border-color:var(--fnp-blue);
  box-shadow:inset 0 1px 2px rgba(0,0,0,.075);
}

/* ====== Toggle (2000 e 2023) — mantém o look existente ====== */
.toggle-container{
  display:flex; border:1px solid #ccc; border-radius:5px;
  overflow:hidden; background:#fff; font-size:14px;
}
.toggle-option{
  padding:10px 20px; cursor:pointer; color:var(--fnp-blue); transition:.3s;
}
.toggle-option:hover{ background:#dde4ed; }
.toggle-option.active{ background:var(--fnp-blue); color:#fff; font-weight:bold; }

/* Diferença %: cores por sinal */
.summary-card .value.positive { color: #16a34a; } /* verde */
.summary-card .value.negative { color: #dc2626; } /* vermelho */
.summary-card .value.neutral  { color: var(--fnp-blue); } /* zero */


.btn-info-tooltip {
  background: none !important;
  border: none !important;
  padding: 0 !important;
  line-height: 1 !important;
  box-shadow: none !important;
  outline: none !important;
}

.btn-info-tooltip:focus,
.btn-info-tooltip:hover,
.btn-info-tooltip:active {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  outline: none !important;
}