/* =========================================================
   RIVET — Design tokens (krok 1.6a + 1.6c fleet)
   Single source of truth: typography, semantic colors, spacing.
   Consumers: dashboard-hardening.css, dashboard-fleet.css.
   ========================================================= */

:root {
  /* — Typography — */
  --rv-font-mono: 'IBM Plex Mono', ui-monospace, monospace;
  --rv-text-xs: 10px;
  --rv-text-sm: 11px;
  --rv-text-base: 12px;
  --rv-text-md: 13px;
  --rv-text-body: 14px;
  --rv-text-lg: 17px;
  --rv-text-xl: 23px;
  --rv-text-2xl: 27px;
  --rv-text-3xl: 29px;
  --rv-text-stat: 25px;
  --rv-text-stat-sm: 19px;
  --rv-text-hero: 20px;
  --rv-text-score: 45px;
  --rv-text-detail: 12.5px;
  --rv-tabular: tabular-nums;

  /* — Semantic status (chips, badges, log levels) — */
  /* 1.6f palette (CEO 2026-07-04) — single yellow for WARN + PRO */
  --rv-color-ok: #2dff6a;
  --rv-color-warn: #ffcc00;
  --rv-color-block: #ff3b30;
  --rv-color-info: #4db8ff;
  --rv-color-white: #ffffff;

  --rv-color-ok-bg: rgba(57, 255, 110, 0.12);
  --rv-color-ok-bg-strong: rgba(57, 255, 110, 0.14);
  --rv-color-ok-bg-nav: rgba(57, 255, 110, 0.08);
  --rv-color-ok-bg-hover: rgba(57, 255, 110, 0.05);
  --rv-color-ok-bg-flash: rgba(57, 255, 110, 0.1);
  --rv-color-chip-bg: rgba(255, 255, 255, 0.04);
  --rv-color-block-bg: rgba(255, 85, 68, 0.12);
  --rv-color-block-bg-hover: rgba(255, 85, 68, 0.22);
  --rv-color-block-muted: #ff8a7a;
  --rv-color-block-border: rgba(255, 85, 68, 0.45);
  --rv-color-attack-muted: #c06a5e;
  --rv-color-green-dim: #1d6e3a;
  --rv-color-placeholder: #3a6048;
  --rv-fg-input: #e6f5ea;
  --rv-bg-pro-overlay: rgba(7, 11, 8, 0.86);

  /* — Surfaces — */
  --rv-bg-root: #070b08;
  --rv-bg-sidebar: #08100a;
  --rv-bg-panel: #0a120c;
  --rv-bg-inset: #060c08;
  --rv-bg-overlay: rgba(8, 16, 10, 0.92);
  --rv-bg-scrim: rgba(0, 0, 0, 0.6);
  --rv-bg-row-hover: rgba(57, 255, 110, 0.04);
  --rv-border-row: #0e1c12;

  /* — Borders (1.6f hierarchy) — */
  --rv-border-width: 1px;
  --rv-border-width-card: 2px;
  --rv-border-width-focus: 2px;
  --rv-border: #17321f;
  --rv-border-strong: #1d4029;
  --rv-border-card: #122418;
  --rv-border-pro: #2c5a3a;
  --rv-bg-kpi-critical: #150b0a;
  --rv-border-kpi-critical: #3a1512;
  --rv-bg-kpi-high: #150f08;
  --rv-border-kpi-high: #3a2410;
  --rv-bg-kpi-medium: #13130a;
  --rv-border-kpi-medium: #34330f;

  /* — Text hierarchy — */
  --rv-fg: #c9ddc9;
  --rv-fg-bright: #a9e8ba;
  --rv-fg-muted: #7fbf93;
  --rv-fg-dim: #4e8a60;
  --rv-fg-value: #cfe6d5;
  --rv-fg-on-accent: #070b08;
  --rv-fg-prose: #8fb89c;
  --rv-fg-prose-light: #9fc4a8;
  --rv-fg-env-key: #c98fd6;
  --rv-color-pro-accent: var(--rv-color-warn);
  --rv-color-pro-bg: rgba(255, 208, 0, 0.1);
  --rv-color-pro-bg-hover: rgba(255, 208, 0, 0.2);
  --rv-glow-pro: 0 0 10px rgba(255, 208, 0, 0.35);
  --rv-color-warn-dot: #bfa94a;
  --rv-color-alert-high: #ff9933;
  --rv-color-alert-high-label: #c0935e;
  --rv-color-alert-medium-label: #a8a35a;
  --rv-color-alert-low: #8b9694;
  --rv-color-geo-badge-border: #5a2420;
  --rv-text-2xs: 9px;

  /* — Spacing scale — */
  --rv-space-xs: 8px;
  --rv-space-sm: 12px;
  --rv-space-md: 16px;
  --rv-space-lg: 22px;

  /* — Effects — */
  --rv-glow-ok: 0 0 8px rgba(57, 255, 110, 0.35);
  --rv-glow-ok-soft: 0 0 8px rgba(57, 255, 110, 0.3);
  --rv-glow-ok-nav: 0 0 6px rgba(57, 255, 110, 0.4);
  --rv-glow-brand: 0 0 12px rgba(57, 255, 110, 0.5);
  --rv-shadow-sidebar: 8px 0 24px rgba(0, 0, 0, 0.45);
  --rv-text-shadow-nav-active: 0 0 6px rgba(57, 255, 110, 0.4);
  --rv-text-shadow-title: 0 0 8px rgba(57, 255, 110, 0.3);
}

/* Utility — numeric columns (uptime, counters, IP) */
.rv-tabular-nums {
  font-variant-numeric: var(--rv-tabular);
}

/* Utility — font scale */
.rv-fs-xs { font-size: var(--rv-text-xs); }
.rv-fs-sm { font-size: var(--rv-text-sm); }
.rv-fs-base { font-size: var(--rv-text-base); }
.rv-fs-md { font-size: var(--rv-text-md); }
.rv-fs-body { font-size: var(--rv-text-body); }
.rv-fs-lg { font-size: var(--rv-text-lg); }
.rv-fs-xl { font-size: var(--rv-text-xl); }
.rv-fs-2xl { font-size: var(--rv-text-2xl); }
.rv-fs-3xl { font-size: var(--rv-text-3xl); }
.rv-fs-stat { font-size: var(--rv-text-stat); }
.rv-fs-stat-sm { font-size: var(--rv-text-stat-sm); }
.rv-fs-score { font-size: var(--rv-text-score); }
.rv-fs-hero { font-size: var(--rv-text-hero); }
.rv-fs-detail { font-size: var(--rv-text-detail); }
.rv-fs-2xs { font-size: var(--rv-text-2xs); }

/* Utility — foreground hierarchy */
.rv-fg { color: var(--rv-fg); }
.rv-fg-bright { color: var(--rv-fg-bright); }
.rv-fg-muted { color: var(--rv-fg-muted); }
.rv-fg-dim { color: var(--rv-fg-dim); }
.rv-fg-value { color: var(--rv-fg-value); }

/* Data display standard (1.6e) — IPs, hostnames, numeric values in tables/logs */
.rv-data-value {
  color: var(--rv-fg-value);
  font-variant-numeric: var(--rv-tabular);
}
.rv-data-ip {
  color: var(--rv-fg-value);
  font-weight: 500;
  font-variant-numeric: var(--rv-tabular);
}
.rv-log-stream .rv-data-ip,
.rv-table-data-row .rv-data-ip {
  font-weight: 500;
  font-variant-numeric: var(--rv-tabular);
}
.rv-log-stream .rv-log-ip.rv-data-ip,
.rv-log-stream .rv-data-ip {
  color: var(--rv-color-white);
}

/* Utility — semantic text (1.8 log renderer, 1.6c fleet) */
.rv-text-ok { color: var(--rv-color-ok); }
.rv-text-warn { color: var(--rv-color-warn); }
.rv-text-block { color: var(--rv-color-block); }
.rv-text-info { color: var(--rv-color-info); }

/* — Type scale 1.6d (T1–T4) — size only; color/weight/CAPS stay in fleet.css or inline */
:root {
  --rv-type-display: var(--rv-text-lg);
  --rv-type-ui: var(--rv-text-md);
  --rv-type-label: var(--rv-text-sm);
  --rv-type-micro: var(--rv-text-xs);
}

/* Type scale 1.6d — semantic classes (prefer over rv-fs-* size-only) */
.rv-t-display {
  font-size: var(--rv-type-display);
  font-weight: 800;
  letter-spacing: 0.16em;
  color: var(--rv-fg-bright);
}
.rv-t-display--kpi {
  font-size: var(--rv-text-stat);
  font-weight: 700;
  font-variant-numeric: var(--rv-tabular);
  color: var(--rv-fg-value);
}
.rv-t-display--kpi-sm {
  font-size: var(--rv-text-stat-sm);
  font-weight: 700;
  font-variant-numeric: var(--rv-tabular);
  color: var(--rv-fg-value);
}
.rv-t-display--metric {
  font-size: var(--rv-text-2xl);
  font-weight: 700;
  font-variant-numeric: var(--rv-tabular);
  color: var(--rv-fg-bright);
  letter-spacing: 0.02em;
}
.rv-t-display--metric-sm {
  font-size: var(--rv-text-xl);
  font-weight: 700;
  font-variant-numeric: var(--rv-tabular);
  color: var(--rv-fg-bright);
  margin-top: 3px;
}
.rv-t-display--score {
  font-size: var(--rv-text-score);
  font-weight: 800;
  font-variant-numeric: var(--rv-tabular);
  color: var(--rv-fg-value);
}

.rv-t-ui {
  font-size: var(--rv-type-ui);
  font-weight: 400;
  color: var(--rv-fg);
}
.rv-t-ui--bold {
  font-weight: 700;
}
.rv-t-label {
  font-size: var(--rv-type-label);
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--rv-fg-dim);
}
.rv-t-micro {
  font-size: var(--rv-type-micro);
  font-weight: 700;
  letter-spacing: 0.08em;
}

/* IBM Plex Mono — self-host (1.6f) */
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/dashboard/assets/fonts/ibm-plex-mono/ibm-plex-mono-latin-400-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url('/dashboard/assets/fonts/ibm-plex-mono/ibm-plex-mono-latin-600-normal.woff2') format('woff2');
}
@font-face {
  font-family: 'IBM Plex Mono';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/dashboard/assets/fonts/ibm-plex-mono/ibm-plex-mono-latin-700-normal.woff2') format('woff2');
}
