/* ============================================================
   SUKATA — Admin (Dashboard Executivo, sem Chart.js)
   Gráficos próprios em SVG gerados no JS (js/views/admin.js)
   ============================================================ */

.admin-kpis { margin-bottom: var(--sp-5); }

.chart-card { margin-bottom: var(--sp-5); }
.chart-wrap { padding: var(--sp-5); }
.chart-wrap svg { display: block; width: 100%; height: auto; }

.legend {
  display: flex;
  gap: var(--sp-4);
  flex-wrap: wrap;
  font-size: var(--fs-12);
  color: var(--text-2);
  margin-top: var(--sp-3);
}
.legend .lg-item { display: inline-flex; align-items: center; gap: 6px; }
.legend .lg-swatch { width: 10px; height: 10px; border-radius: 3px; flex: 0 0 auto; }

.bar-list { display: flex; flex-direction: column; gap: var(--sp-3); }
.bar-row .br-head {
  display: flex;
  justify-content: space-between;
  font-size: var(--fs-12);
  color: var(--text-2);
  margin-bottom: 4px;
  gap: var(--sp-3);
}
.bar-row .br-head b { color: var(--text-1); font-weight: 600; word-break: break-all; }
.bar-row .br-track {
  height: 8px;
  border-radius: var(--radius-pill);
  background: var(--surface-3);
  overflow: hidden;
}
.bar-row .br-fill {
  height: 100%;
  border-radius: inherit;
  background: var(--suk-orange-gradient);
  transition: width var(--dur-slow) var(--ease);
}
.bar-row.br-green .br-fill { background: linear-gradient(90deg, #34d399, #10b981); }
.bar-row.br-sky .br-fill { background: linear-gradient(90deg, #7dd3fc, #0284c7); }
.bar-row.br-violet .br-fill { background: linear-gradient(90deg, #c4b5fd, #7c3aed); }

.two-col { display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-5); }
@media (max-width: 900px) {
  .two-col { grid-template-columns: 1fr; }
}

.fail-list { display: flex; flex-direction: column; }
.fail-item {
  padding: var(--sp-3) var(--sp-5);
  display: flex;
  gap: var(--sp-3);
  align-items: flex-start;
  font-size: var(--fs-13);
}
.fail-item + .fail-item { border-top: 1px solid var(--border); }
.fail-item .f-msg { color: var(--text-2); word-break: break-word; flex: 1; }
.fail-item .f-id { font-family: var(--font-mono); font-size: var(--fs-11); color: var(--text-3); white-space: nowrap; }

/* elementos dos gráficos SVG (admin) */
.ch-grid { stroke: var(--border); stroke-width: 1; stroke-dasharray: 3 5; }
.ch-axis, .ch-lbl { font-family: var(--font-ui); font-size: 10px; fill: var(--text-3); }
.ch-lbl { font-size: 9px; }