/* Paleta de datos validada para ambos modos (ver dataviz/references/palette.md).
   Los slots se asignan en orden fijo, nunca se ciclan. */
:root {
  --monitor-chart-height: 220px;

  --series-1: #2a78d6;
  --series-2: #eb6834;
  --series-3: #1baf7a;
  --series-4: #eda100;
  --series-5: #e87ba4;
  --series-6: #008300;
  --series-7: #4a3aa7;
  --series-8: #e34948;

  --viz-grid: #e1e0d9;
  --viz-axis: #c3c2b7;
  --viz-muted: #898781;

  --status-good: #0ca30c;
  --status-warning: #fab219;
  --status-critical: #d03b3b;
}

:root[data-bs-theme="dark"] {
  --series-1: #3987e5;
  --series-2: #d95926;
  --series-3: #199e70;
  --series-4: #c98500;
  --series-5: #d55181;
  --series-6: #008300;
  --series-7: #9085e9;
  --series-8: #e66767;

  --viz-grid: #2c2c2a;
  --viz-axis: #383835;
  --viz-muted: #898781;
}

body {
  min-height: 100vh;
}

.kpi {
  font-size: clamp(1.5rem, 1.1rem + 1.4vw, 2rem);
  font-weight: 600;
  line-height: 1.1;
}

.chart-wrap {
  position: relative;
  height: var(--monitor-chart-height);
}

.table > :not(caption) > * > * {
  font-variant-numeric: tabular-nums;
}

.state-dot {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  margin-right: 0.4rem;
  vertical-align: middle;
}

.state-running { background-color: var(--status-good); }
.state-degraded { background-color: var(--status-warning); }
.state-stopped { background-color: var(--status-critical); }

.login-body {
  display: grid;
  place-items: center;
  min-height: 100vh;
  padding: 1rem;
  background: var(--bs-tertiary-bg);
}

.login-card {
  width: min(100%, 26rem);
}

@media (max-width: 575.98px) {
  :root { --monitor-chart-height: 180px; }
}