/* ============================================================================
   BASEFLY — GRÁFICOS E DADOS (etapa 5)
   Seção 6. Carrega depois de overlays.css.

   Os gráficos do projeto são HTML e CSS puro (divs com largura em %), sem
   biblioteca e sem canvas — a sequência de cores entra por token.

   Sequência de séries, nesta ordem (seção 6):
     --chart-1 blue-500 · --chart-2 brand-sky · --chart-3 brand-signal
     --chart-4 success  · --chart-5 blue-900  · --chart-6 n-500
   ============================================================================ */

/* --- superfície do gráfico: sem borda (seção 6) --------------------------- */
.analytics-card{
  background:var(--n-0);
  border:1px solid var(--n-200);       /* borda do CARTÃO, não do gráfico */
  border-radius:var(--r-md);
  box-shadow:var(--sh-card);
  padding:20px;
}
.analytics-funnel,
.analytics-hbars,
.analytics-timeline{ border:0; }

/* --- rótulo de eixo e de série ------------------------------------------- */
.analytics-hbar-label,
.analytics-timeline-label,
.analytics-funnel-label,
.chart-axis{
  color:var(--n-600);
  font-family:var(--font-text);
  font-size:11px;
}

/* --- valores: sempre monoespaçados (seção 6) ----------------------------- */
.analytics-hbar-num,
.analytics-kpi-num,
.analytics-timeline-num,
.analytics-funnel-value,
.chart-value{
  font-family:var(--font-mono);
  font-variant-numeric:tabular-nums;
  color:var(--n-900);
}

/* --- trilho e grade ------------------------------------------------------ */
.analytics-hbar-track,
.chart-track{
  background:var(--n-100);
  border-radius:var(--r-sm);
  border:0;
}
.chart-grid-line,
.analytics-timeline-grid{
  background:var(--n-200);
  height:0.75px;                        /* seção 6: grade de 0,75 px */
  border:0;
}

/* --- preenchimento padrão das séries ------------------------------------- */
.analytics-hbar-fill,
.analytics-timeline-bar,
.chart-serie-1{ background:var(--chart-1); border-radius:var(--r-sm); }
.chart-serie-2{ background:var(--chart-2); }
.chart-serie-3{ background:var(--chart-3); }
.chart-serie-4{ background:var(--chart-4); }
.chart-serie-5{ background:var(--chart-5); }
.chart-serie-6{ background:var(--chart-6); }

/* Alternância por posição, para listas de série sem classe própria.
   Segue a mesma ordem da seção 6. */
.chart-auto > *:nth-child(6n+1) .bar,.chart-auto > *:nth-child(6n+1)>.fill{ background:var(--chart-1); }
.chart-auto > *:nth-child(6n+2) .bar,.chart-auto > *:nth-child(6n+2)>.fill{ background:var(--chart-2); }
.chart-auto > *:nth-child(6n+3) .bar,.chart-auto > *:nth-child(6n+3)>.fill{ background:var(--chart-3); }
.chart-auto > *:nth-child(6n+4) .bar,.chart-auto > *:nth-child(6n+4)>.fill{ background:var(--chart-4); }
.chart-auto > *:nth-child(6n+5) .bar,.chart-auto > *:nth-child(6n+5)>.fill{ background:var(--chart-5); }
.chart-auto > *:nth-child(6n+6) .bar,.chart-auto > *:nth-child(6n+6)>.fill{ background:var(--chart-6); }

/* --- KPI ----------------------------------------------------------------- */
.analytics-kpi{
  background:var(--n-0);
  border:1px solid var(--n-200);
  border-radius:var(--r-md);
  box-shadow:var(--sh-card);
}
.analytics-kpi-lbl{ color:var(--n-600); font-family:var(--font-text); font-size:12px; }
.analytics-kpi-icon{ color:var(--n-500); }

/* --- perda ---------------------------------------------------------------
   Vermelho em gráfico significa perda, e só isso (seção 6). Queda entre
   etapas do funil é perda; série neutra nunca usa --danger.
   ------------------------------------------------------------------------- */
.analytics-funnel-dropoff{ color:var(--danger-text); font-family:var(--font-mono); font-size:11px; }