/* ============================================================
   KSTK Predictive Mindset — Color tokens
   Extracted from "Templates KSTK.fig" (Elementos e Cores › Colors)
   ============================================================ */

:root {
  /* ---- Brand core (cores principais) ---- */
  --kstk-blue:    #0F6FFF; /* PRIMARY brand colour */
  --kstk-blue-on-dark: #68A5FF; /* blue text/icons on dark surfaces (WCAG AA) */
  --kstk-ink:     #262731; /* near-black, brand dark */
  --kstk-paper:   #F7F7FA; /* off-white surface */
  --kstk-amber:   #FDAC2E; /* yellow / amber accent */
  --kstk-amber-ink: #8A5A00; /* amber text/icons on light surfaces */
  --kstk-orange:  #EF551A; /* orange accent */
  --kstk-green:   #35CD7A; /* green accent — fills / dark backgrounds */
  --kstk-green-ink: #157A45; /* green text/icons on light surfaces (WCAG AA) */
  --kstk-purple:  #A669EC; /* purple accent */
  --kstk-purple-ink: #6B3FB0; /* purple text/icons on light surfaces */

  /* ---- Blue ramp (cores secundárias) ---- */
  --blue-50:   #DDEAFF;
  --blue-100:  #CAE0FF;
  --blue-200:  #B3D0FE;
  --blue-300:  #68A5FF;
  --blue-400:  #2B80FF;
  --blue-500:  #0F6FFF; /* = --kstk-blue */
  --blue-600:  #0763ED;
  --blue-700:  #005CE5;
  --blue-800:  #004AB8;
  --blue-900:  #213175; /* deep navy */

  /* ---- Neutral / slate ramp ---- */
  --neutral-0:    #FFFFFF;
  --neutral-50:   #F7F7FA;
  --neutral-100:  #EFF3F9;
  --neutral-200:  #E5E5E5;
  --neutral-300:  #D9D9D9;
  --neutral-400:  #B6C1D8;
  --neutral-500:  #979797;
  --neutral-600:  #747997;
  --neutral-700:  #494C63;
  --neutral-800:  #353946;
  --neutral-900:  #262731; /* = --kstk-ink */

  /* ---- Accent tints (soft backgrounds) ---- */
  --green-soft:   #D9F6E6;
  --orange-soft:  #FDE0D3;
  --amber-soft:   #FEF3D1;
  --purple-soft:  #EADCFB;
  --blue-soft:    #DDEAFF;

  /* ============================================================
     Semantic aliases — reference these in components
     ============================================================ */

  /* Text */
  --text-strong:    var(--kstk-ink);
  --text-body:      #494C63;
  --text-muted:     #747997;
  --text-subtle:    #979797;
  --text-on-brand:  #FFFFFF;
  --text-link:      var(--kstk-blue);

  /* Surfaces */
  --surface-page:    var(--neutral-50);
  --surface-card:    #FFFFFF;
  --surface-sunken:  var(--neutral-100);
  --surface-inverse: var(--kstk-ink);
  --surface-brand:   var(--kstk-blue);

  /* Borders */
  --border-subtle:  rgba(38, 39, 49, 0.10);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-brand:   var(--kstk-blue);

  /* Interactive (primary / brand) */
  --action-primary:        var(--kstk-blue);
  --action-primary-hover:  var(--blue-600);
  --action-primary-press:  var(--blue-700);
  --action-primary-focus:  var(--blue-900);
  --action-secondary-bg:   #FFFFFF;
  --action-tertiary-fg:    var(--kstk-blue);
  --action-soft-bg:        var(--blue-50);
  --action-soft-bg-hover:  var(--blue-100);

  /* Status / feedback */
  --status-success:     var(--kstk-green);
  --status-success-bg:  var(--green-soft);
  --status-warning:     var(--kstk-amber);
  --status-warning-bg:  var(--amber-soft);
  --status-danger:      var(--kstk-orange);
  --status-danger-bg:   var(--orange-soft);
  --status-info:        var(--kstk-blue);
  --status-info-bg:     var(--blue-soft);
  --status-accent:      var(--kstk-purple);
  --status-accent-bg:   var(--purple-soft);
}
