/* ============================================================
   KOBROKR — COLOR TOKENS
   A confident cobalt, grounded in ink, with one signal accent.
   ============================================================ */

:root {
  /* ---- Brand palette (raw) ---- */
  --cobalt:        #2B54F0;  /* oklch(.55 .23 266) — primary brand        */
  --cobalt-deep:   #1B3AD1;  /* oklch(.45 .21 266) — gradients, hover     */
  --sky:           #6FA8FF;  /* oklch(.74 .13 258) — highlights, data     */
  --signal-mint:   #1FC8A0;  /* oklch(.74 .14 168) — live / available     */
  --ink:           #0B1430;  /* oklch(.20 .05 268) — text, dark UI        */
  --slate:         #46517A;  /* oklch(.43 .05 270) — secondary text       */
  --mist:          #EEF2FD;  /* oklch(.96 .01 264) — surfaces             */
  --paper:         #FBFCFE;  /* oklch(.99 .00 264) — background           */
  --white:         #FFFFFF;

  /* ---- Cobalt tint ramp (derived, for fills/borders/states) ---- */
  --cobalt-50:     #EEF2FE;
  --cobalt-100:    #DCE4FD;
  --cobalt-200:    #BCCBFB;
  --cobalt-300:    #94A9F7;
  --cobalt-400:    #6076F3;
  --cobalt-500:    #2B54F0;
  --cobalt-600:    #1B3AD1;
  --cobalt-700:    #1A33A8;
  --cobalt-800:    #1A2F85;
  --cobalt-900:    #182A66;

  /* ---- Ink / neutral ramp ---- */
  --ink-900:       #0B1430;
  --ink-800:       #161F40;
  --ink-700:       #232C50;
  --ink-600:       #343E64;
  --slate-500:     #46517A;
  --slate-400:     #6E78A0;
  --slate-300:     #9AA2C2;
  --slate-200:     #C7CDE2;
  --slate-100:     #E1E5F2;
  --mist:          #EEF2FD;
  --paper:         #FBFCFE;

  /* ---- Semantic: text ---- */
  --text-strong:   var(--ink-900);   /* headlines, primary copy           */
  --text-body:     var(--ink-800);   /* default paragraph                 */
  --text-muted:    var(--slate-500); /* secondary, captions               */
  --text-subtle:   var(--slate-400); /* placeholder, disabled hints       */
  --text-on-brand: #FFFFFF;          /* text over cobalt / ink            */
  --text-link:     var(--cobalt-600);

  /* ---- Semantic: surface ---- */
  --surface-page:    var(--paper);
  --surface-raised:  #FFFFFF;        /* cards on page                     */
  --surface-sunken:  var(--mist);    /* wells, inputs, table zebra        */
  --surface-brand:   var(--cobalt);
  --surface-brand-strong: var(--cobalt-deep);
  --surface-ink:     var(--ink-900); /* dark UI panels                    */

  /* ---- Semantic: border ---- */
  --border-subtle:  var(--slate-100);
  --border-default: var(--slate-200);
  --border-strong:  var(--slate-300);
  --border-brand:   var(--cobalt-500);
  --border-focus:   var(--cobalt-500);

  /* ---- Semantic: status ---- */
  --status-live:     var(--signal-mint); /* live / available inventory    */
  --status-live-bg:  #E4F9F3;
  --status-info:     var(--cobalt-500);
  --status-info-bg:  var(--cobalt-50);
  --status-positive: #1FC8A0;
  --status-positive-fg: #0C7A60;
  --status-negative: #E5484D;
  --status-negative-fg: #B42318;
  --status-negative-bg: #FDECEC;
  --status-warning:  #E8A317;
  --status-warning-fg: #9A6A04;
  --status-warning-bg: #FCF3DD;

  /* ---- Data viz (cobalt-led) ---- */
  --data-1: var(--cobalt-500);
  --data-2: var(--sky);
  --data-3: var(--signal-mint);
  --data-4: var(--cobalt-900);
  --data-5: var(--slate-400);

  /* ---- Brand gradient ---- */
  --gradient-brand: linear-gradient(135deg, var(--cobalt-500) 0%, var(--cobalt-deep) 100%);
  --gradient-ink:   linear-gradient(160deg, var(--ink-800) 0%, var(--ink-900) 100%);
}