/* ============================================================
   vtop_tokens.css — vtop Design System Tokens v1.5
   Authority: CCO — published 2026-06-20
   Source: CCO/tokens/vtop_dna_v1.5.md
   Distribution: CCO/tokens/ (Tier 1 — master)
   ============================================================ */

:root {

  /* ── PALETTE ────────────────────────────────────────────── */
  --vtop-navy:        #1B3A8C;   /* Structural — buttons, borders, active states  */
  --vtop-navy-dark:   #14306e;   /* Navy pressed/hover state                      */
  --vtop-green:       #4DB840;   /* Operational — live, active, success            */
  --vtop-green-light: #7ed86b;   /* Lightened green — text on navy surfaces        */
  --vtop-floor:       #D8DCE4;   /* ALL page backgrounds — titanium ground         */
  --vtop-slate:       #5A6272;   /* ALL text — unified Vantity brand slate         */
  --vtop-white:       #FFFFFF;   /* Card/panel surfaces above the floor            */
  --vtop-light:       #F7F8FA;   /* Sidebar column backgrounds                     */
  --vtop-border:      #E2E8F0;   /* All borders and dividers                       */
  --vtop-muted:       #9AA5B4;   /* Placeholder, disabled, badges ONLY — NOT for labels */
  --vtop-eef:         #EEF2FF;   /* Navy-tinted hover/active fill                  */
  --vtop-active:      #E8F5E9;   /* Green-tinted active/selected fill              */

  /* ── TEXT ───────────────────────────────────────────────── */
  --vtop-text-primary:   #1A1F2A;   /* Headings, primary content                */
  --vtop-text-secondary: #5A6272;   /* Body, labels — matches --vtop-slate      */
  --vtop-text-muted:     #8A909E;   /* Timestamps, disabled, fine print         */

  /* ── TYPOGRAPHY ─────────────────────────────────────────── */
  --vtop-font-ui:   "Inter", system-ui, sans-serif;
  --vtop-font-head: "Poppins", system-ui, sans-serif;

  /* ── TYPESCALE — px, not rem — v1.5 corrected 2026-06-20 ── */
  --vtop-size-head:    16px;   /* Panel titles, card headers                        */
  --vtop-size-body:    14px;   /* Body copy, inputs, interactive rows               */
  --vtop-size-label:   13px;   /* Form labels, readable UI labels                   */
  --vtop-size-section: 12px;   /* Uppercase section dividers — minimum exception    */
  --vtop-size-meta:    11px;   /* Badges, chips, timestamps — decorative only       */

  /* ── RADIUS ─────────────────────────────────────────────── */
  --vtop-radius-sm: 4px;
  --vtop-radius-md: 6px;
  --vtop-radius-lg: 8px;

  /* ── SPACING ────────────────────────────────────────────── */
  --vtop-gap-xs: 4px;
  --vtop-gap-sm: 8px;
  --vtop-gap-md: 12px;
  --vtop-gap-lg: 16px;

  /* ── SEMANTIC — DANGER (inactive/closed terminal state) ─── */
  --vtop-danger-bg: #FEF2F2;
  --vtop-danger-br: #FECACA;
  --vtop-danger-tx: #B91C1C;

  /* ── SEMANTIC — WARN (cautionary/reserved/placeholder) ──── */
  --vtop-warn-bg: #FFFBEB;
  --vtop-warn-br: #FDE68A;
  --vtop-warn-tx: #92400E;

  /* ── SEMANTIC — SKILL TIERS ─────────────────────────────── */
  --vtop-skill-core-bg: #DBEAFE;
  --vtop-skill-core-br: #93C5FD;
  --vtop-skill-core-tx: #1E40AF;

  --vtop-skill-rec-bg:  #DCFCE7;
  --vtop-skill-rec-br:  #86EFAC;
  --vtop-skill-rec-tx:  #166534;

  --vtop-skill-avl-bg:  #F1F5F9;
  --vtop-skill-avl-br:  #CBD5E1;
  --vtop-skill-avl-tx:  #475569;

}