/* ============================================================
   Renovaré — Color Tokens
   Evergreen primary, warm-gray neutrals, sparing secondary accents.
   Base palette + semantic aliases.
   ============================================================ */

:root {
  /* ---- Primary — Evergreen ---- */
  --primary-100: #e8f5ef; /* tint / backgrounds */
  --primary-200: #cfeadd; /* soft borders on light */
  --primary-300: #8fcfb4; /* accents on dark */
  --primary-400: #19ad6e; /* brightest brand green — hover / accents */
  --primary-500: #106e46; /* CORE green — default brand */
  --primary-600: #0d5738; /* link hover / pressed */
  --primary-700: #18412f; /* deep field / dark sections */
  --primary-800: #0b2c20; /* deeper field */
  --primary-900: #041d13; /* near-black green */
  --primary: var(--primary-500);

  /* ---- Neutral — Warm gray ---- */
  --neutral-100: #ffffff;
  --neutral-200: #faf7f5;
  --neutral-bg:  #f2f0ed; /* default page surface */
  --neutral-300: #e7e4e0;
  --neutral-400: #cfcac5;
  --neutral-500: #a6a09a;
  --neutral-600: #7d7771;
  --neutral-700: #4d4741;
  --neutral-800: #2b2722;
  --neutral-900: #080605;
  --neutral: var(--neutral-800);

  /* ---- Secondary — Accents (use sparingly) ---- */
  --orange:      #cc7829;
  --orange-deep: #a43939;
  --blue:        #558e99;
  --blue-deep:   #334657; /* podcast cover slate */
  --gold:        #d1a84c;
  --gold-deep:   #993e17;
  --purple:      #6e8acc;
  --purple-deep: #592e46;

  /* ---- Status ---- */
  --error: #a43939;

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

  /* Text */
  --text-body:     var(--neutral-800);
  --text-heading:  var(--neutral-900);
  --text-muted:    var(--neutral-600);
  --text-subtle:   var(--neutral-500);
  --text-inverse:  var(--neutral-100);
  --text-brand:    var(--primary-500);
  --text-on-dark:  var(--neutral-100);

  /* Surfaces */
  --surface-page:    var(--neutral-bg);
  --surface-card:    var(--neutral-100);
  --surface-raised:  var(--neutral-200);
  --surface-sunken:  var(--neutral-300);
  --surface-dark:    var(--primary-700);
  --surface-darkest: var(--primary-900);
  --surface-brand:   var(--primary-500);

  /* Borders */
  --border-default: var(--neutral-300);
  --border-strong:  var(--neutral-400);
  --border-brand:   var(--primary-700);
  --border-on-dark: rgba(255, 255, 255, 0.18);

  /* Interactive */
  --action:         var(--primary-500);
  --action-hover:   var(--primary-400);
  --action-pressed: var(--primary-600);
  --focus-ring:     rgba(143, 207, 180, 0.25); /* primary-300 / 25% */
}