/* Sell Better — Color tokens
   Reduced palette (per brand owner): black & white + three accents
   (sky, lavender, green). No coral, no navy text. Text is black (or white
   on dark). Backgrounds are white; color is used sparingly. */

:root {
  /* ---- Core (print / logo) ---- */
  --black: #000000;
  --white: #ffffff;
  --print-black: #000000;
  --print-white: #ffffff;

  /* ---- Accents (the only colors — use sparingly) ---- */
  --support-sky:      #92B9D4; /* sky blue */
  --support-lavender: #D0BCF1; /* lavender */
  --support-green:    #5FCF6F; /* green */
  --support-sand:     #D8C5A0; /* warm sand / tan */

  /* Red — for stop/alert actions + form errors */
  --support-red:      #E35655;

  /* ---- Neutral grey ramp (cool) ---- */
  --neutral-0:   #ffffff;
  --neutral-50:  #f7f8f9;
  --neutral-100: #eef0f2;
  --neutral-200: #e1e4e8;
  --neutral-300: #c9ced4;
  --neutral-400: #9aa1aa;
  --neutral-500: #6c727b;
  --neutral-600: #4a4f56;
  --neutral-700: #34383d;
  --neutral-800: #222528;
  --neutral-900: #141618;
  --neutral-950: #000000;

  /* ---- Semantic aliases ---- */
  --color-ink:         var(--black);        /* all body & heading text */
  --color-ink-muted:   var(--neutral-600);  /* secondary text */
  --color-ink-subtle:  var(--neutral-400);  /* tertiary / placeholder */
  --color-ink-inverse: var(--white);

  --surface-page:    var(--white);
  --surface-card:    var(--white);
  --surface-sunken:  var(--neutral-50);
  --surface-inverse: var(--black);   /* the one bold dark surface, used rarely */
  --surface-tint:    var(--white);

  --border-subtle:  var(--neutral-200);
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-focus:   var(--black);

  /* Primary action = black on white. Secondary = soft grey. */
  --accent:          var(--black);
  --accent-hover:    var(--neutral-800);
  --accent-press:    var(--neutral-900);
  --accent-soft:     var(--neutral-100);
  --accent-on:       var(--white);

  --secondary:       var(--neutral-100);
  --secondary-hover: var(--neutral-200);
  --secondary-press: var(--neutral-300);
  --secondary-on:    var(--black);

  /* Status (minimal) */
  --success:      var(--support-green);
  --success-soft: #e4f6e7;
  --success-ink:  #2c7a3a;
  --info:         var(--support-sky);
  --info-soft:    #e7f0f7;
  --info-ink:     #2f5d7a;
  --danger:       var(--support-red);
  --danger-hover: #d2403f;
  --danger-press: #bd3231;
  --danger-soft:  #fbe6e6;
  --danger-ink:   #b23130;
  --danger-on:    var(--white);

  /* Decorative tints (faint accent washes) */
  --tint-sky:      #e7f0f7;
  --tint-lavender: #f3edfb;
  --tint-green:    #e4f6e7;
  --tint-sand:     #f5f0e4;

  /* A warm sand surface for sparing, calm background blocks */
  --surface-sand:  #efe8d8;
}