/* ─────────────────────────────────────────────
   Voltra · Design Tokens
   Dark "talent ops console" — neutral charcoal
   surfaces, mint accent.
   ───────────────────────────────────────────── */

:root {
  color-scheme: dark;

  /* ── Surfaces · neutral charcoal ── */
  --bg-page: #101210;
  --bg-rail: #131513;
  --bg-topbar: #131513;
  --bg-board: #161816;
  --bg-column: rgba(255, 255, 255, 0.025);
  --bg-card: #1c1f1c;
  --bg-card-hover: #212421;
  --bg-elevated: #232623;
  --bg-input: rgba(255, 255, 255, 0.05);
  --bg-chip: rgba(255, 255, 255, 0.06);

  /* ── Borders / lines ── */
  --line-1: rgba(255, 255, 255, 0.06);
  --line-2: rgba(255, 255, 255, 0.1);
  --line-3: rgba(255, 255, 255, 0.16);
  --line-accent: rgba(47, 227, 189, 0.35);

  /* ── Primary accent · mint (CTAs & interactive) ── */
  --acc-300: #86f2dc;
  --acc-400: #52eac9;
  --acc-500: #2fe3bd;
  --acc-600: #1cc7a2;
  --acc-ink: #052a20;             /* text on mint */
  --acc-soft: rgba(47, 227, 189, 0.1);

  /* ── Text ── */
  --text-1: #f2f4f2;
  --text-2: #a4aba6;
  --text-3: #6d746f;
  --text-disabled: #494f4b;

  /* ── Semantic ── */
  --danger-400: #ff6f61;
  --danger-soft: rgba(255, 111, 97, 0.09);
  --danger-line: rgba(255, 111, 97, 0.22);
  --ok-400: #7bdb90;
  --ok-soft: rgba(123, 219, 144, 0.07);
  --info-400: #6db3f2;

  /* ── Status dots (candidate availability) ── */
  --dot-green: #7bdb90;
  --dot-amber: #f2c14e;
  --dot-red: #ff6f61;
  --dot-violet: #b18cf2;

  /* ── Typography ── */
  --font-display: "Bricolage Grotesque", "Instrument Sans", sans-serif;
  --font-ui: "Instrument Sans", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, monospace;

  --fs-10: 0.625rem;
  --fs-11: 0.6875rem;
  --fs-12: 0.75rem;
  --fs-13: 0.8125rem;
  --fs-14: 0.875rem;
  --fs-15: 0.9375rem;
  --fs-18: 1.125rem;
  --fs-22: 1.375rem;
  --fs-32: 2rem;
  --fs-40: 2.5rem;

  /* ── Spacing (4px grid) ── */
  --sp-1: 0.25rem;
  --sp-2: 0.5rem;
  --sp-3: 0.75rem;
  --sp-4: 1rem;
  --sp-5: 1.25rem;
  --sp-6: 1.5rem;
  --sp-8: 2rem;
  --sp-10: 2.5rem;

  /* ── Radii ── */
  --r-xs: 6px;
  --r-sm: 8px;
  --r-md: 12px;
  --r-lg: 16px;
  --r-xl: 20px;
  --r-full: 999px;

  /* ── Elevation ── */
  --shadow-pop:
    0 0 0 1px rgba(255, 255, 255, 0.07),
    0 12px 32px rgba(0, 0, 0, 0.55),
    0 4px 12px rgba(0, 0, 0, 0.4);
  --shadow-drag:
    0 0 0 1px var(--line-3),
    0 24px 48px rgba(0, 0, 0, 0.6),
    0 8px 20px rgba(0, 0, 0, 0.5);
  --shadow-toast:
    0 0 0 1px rgba(255, 255, 255, 0.08),
    0 16px 40px rgba(0, 0, 0, 0.6);

  /* ── Motion ── */
  --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-out-back: cubic-bezier(0.34, 1.4, 0.5, 1);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --t-fast: 140ms;
  --t-med: 240ms;
  --t-slow: 420ms;

  /* ── Layout ── */
  --rail-w: 64px;
  --topbar-h: 60px;
  --col-w: 292px;
}