/* ============================================================
   ME-Xclusive — Design tokens (from handoff design system)
   Default: Dark theme.  Light theme via [data-theme="light"]
   ============================================================ */
:root {
  /* base — dark */
  --bg:           #0A0C10;
  --surface:      #13161C;
  --surface-2:   #171B22;
  --surface-3:   #1D222B;
  --fg:           #F4F5F7;
  --muted:        #8B919C;
  --muted-2:      #B4B9C3;
  --border:       rgba(255,255,255,0.08);

  /* brand */
  --brand:        #E53935;
  --brand-dark:   #B71C1C;
  --gold:         #D4AF37;

  /* tier defaults (overridden per-context with --tier-color etc.) */
  --tier-S:       #D4AF37;
  --tier-S-soft:  rgba(212,175,55,0.14);
  --tier-S-dark:  #8B5A1E;
  --tier-A:       #E9B949;
  --tier-A-soft:  rgba(233,185,73,0.14);
  --tier-A-dark:  #8B5A1E;
  --tier-B:       #C5CDD9;
  --tier-B-soft:  rgba(197,205,217,0.14);
  --tier-B-dark:  #586270;
  --tier-C:       #D08A4E;
  --tier-C-soft:  rgba(208,138,78,0.14);
  --tier-C-dark:  #6F3B14;
  --tier-D:       #8E97A6;
  --tier-D-soft:  rgba(142,151,166,0.14);
  --tier-D-dark:  #3A424F;

  /* feedback */
  --success:      #28A86C;
  --info:         #8B8EF2;
  --warning:      #FFC857;
  --danger:       #DC3545;

  /* radii */
  --r-sm: 6px;
  --r-md: 10px;
  --r-lg: 14px;
  --r-xl: 20px;

  /* shadows */
  --shadow-sm: 0 1px 3px rgba(0,0,0,0.3);
  --shadow-md: 0 4px 12px rgba(0,0,0,0.4);
  --shadow-lg: 0 10px 30px rgba(0,0,0,0.5);

  /* fonts */
  --font-thai: 'Noto Sans Thai', 'Inter', system-ui, sans-serif;
  --font-latin: 'Inter', 'Noto Sans Thai', system-ui, sans-serif;
}

[data-theme="light"] {
  --bg:        #F5F6F8;
  --surface:   #FFFFFF;
  --surface-2: #FFFFFF;
  --surface-3: #F0F1F4;
  --fg:        #0F1115;
  --muted:     #6E7380;
  --muted-2:   #42464F;
  --border:    rgba(0,0,0,0.08);
}
