/* PacketSpear Design Tokens — shared CSS custom properties */
/* @import this file or reference tokens directly for consistent theming */

:root {
  /* ==================== Server (Command) Palette ==================== */
  --ds-bg-primary: #0b0f14;
  --ds-bg-secondary: #090c10;
  --ds-bg-card: #101720;
  --ds-bg-elevated: #17202b;
  --ds-bg-input: #121922;
  --ds-bg-card-header: #131c24;

  --ds-border-subtle: #1d2630;
  --ds-border-default: #2b3746;

  --ds-text-primary: #e8edf2;
  --ds-text-secondary: #8fa0b4;
  --ds-text-muted: #5a6580;

  --ds-accent: #f0a040;
  --ds-accent-dim: rgba(240, 160, 64, 0.15);
  --ds-accent-on-dark: #111111;

  /* ==================== Client (Node) Palette ==================== */
  --ds-client-bg-primary: #f5f0e8;
  --ds-client-bg-secondary: #fffdf8;
  --ds-client-bg-card: #ffffff;
  --ds-client-bg-elevated: #f0ebe3;
  --ds-client-bg-node: #121820;

  --ds-client-border-subtle: #e4dbce;
  --ds-client-border-default: #d4c9bb;

  --ds-client-text-primary: #14181d;
  --ds-client-text-secondary: #66707c;
  --ds-client-text-muted: #8fa0b4;

  --ds-client-accent: #f0a040;
  --ds-client-accent-light: rgba(240, 160, 64, 0.08);

  /* ==================== Semantic Status Colors ==================== */
  --ds-status-ok: #2fb36d;
  --ds-status-ok-dim: rgba(47, 179, 109, 0.12);
  --ds-status-warn: #ffd27a;
  --ds-status-warn-dim: rgba(255, 210, 122, 0.12);
  --ds-status-error: #ff7f7f;
  --ds-status-error-dim: rgba(255, 127, 127, 0.12);
  --ds-status-info: #7eb1f0;
  --ds-status-info-dim: rgba(126, 177, 240, 0.12);

  /* Aliases for legacy style.css compatibility */
  --bg-primary: var(--ds-bg-primary);
  --bg-secondary: var(--ds-bg-secondary);
  --bg-card: var(--ds-bg-card);
  --bg-card-header: var(--ds-bg-card-header);
  --border-color: var(--ds-border-default);
  --text-primary: var(--ds-text-primary);
  --text-secondary: var(--ds-text-secondary);
  --text-muted: var(--ds-text-muted);
  --accent: var(--ds-accent);
  --accent-dim: var(--ds-accent-dim);
  --green: var(--ds-status-ok);
  --green-dim: var(--ds-status-ok-dim);
  --red: var(--ds-status-error);
  --red-dim: var(--ds-status-error-dim);
  --yellow: var(--ds-status-warn);
  --yellow-dim: var(--ds-status-warn-dim);
  --blue: var(--ds-status-info);
  --blue-dim: var(--ds-status-info-dim);
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 14px;
  --radius-round: 999px;
  --shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
}

/* ==================== Spacing ==================== */
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
}

/* ==================== Typography ==================== */
:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, sans-serif;
  --font-mono: "SF Mono", "Fira Code", "Cascadia Code", "Cascadia Mono", Consolas, monospace;
}