/* ============================================================
   Sunlight & Shelter — Color Tokens
   Warm, earthy, architectural. Sunlight (amber) + Shelter (clay
   & forest) resting on warm paper. Light-mode only.
   ============================================================ */

:root {
  /* ---- Base palette: Clay / Terracotta (primary, "shelter") ---- */
  --clay-900: #6e3a28;
  --clay-800: #8c4d36;
  --clay-700: #a85c43;
  --clay-600: #b86b50;
  --clay-500: #c67d63;   /* brand terracotta */
  --clay-450: #c89681;   /* brand blush / soft clay */
  --clay-300: #d9a994;
  --clay-200: #e8c8b9;
  --clay-100: #f1ddd2;
  --clay-50:  #f9ece4;

  /* ---- Base palette: Forest (secondary, "shelter" / ink) ---- */
  --forest-900: #232e22;
  --forest-800: #2e3b2c;
  --forest-700: #394734;
  --forest-600: #425240;   /* brand forest green */
  --forest-500: #556552;
  --forest-400: #74836f;
  --forest-300: #9aa694;
  --forest-200: #c2cabd;
  --forest-100: #dde2d8;
  --forest-50:  #eef1ea;

  /* ---- Base palette: Amber / Sun (accent, "sunlight") ---- */
  --amber-700: #b06c1b;
  --amber-600: #c87d20;
  --amber-500: #e0902f;   /* brand sun amber */
  --amber-400: #e9a753;
  --amber-300: #f0c082;
  --amber-200: #f6d9b3;
  --amber-100: #fbecd6;

  /* ---- Warm neutrals: Paper / Sand / Stone ---- */
  --paper-0:   #ffffff;
  --paper-50:  #faf7f2;
  --paper-100: #f4efe8;   /* brand cream — primary canvas */
  --paper-200: #ece4d8;
  --paper-300: #e0d5c5;
  --sand-400:  #cdbfa9;
  --stone-500: #9c8f7d;
  --stone-600: #7c7163;
  --stone-700: #5d5448;
  --ink-800:   #3a352d;
  --ink-900:   #2a2722;   /* warm near-black */

  /* ---- Semantic feedback (earthy-tuned) ---- */
  --positive-500: #5b7a4f;
  --positive-100: #e4ecdd;
  --caution-500:  #d8932c;
  --caution-100:  #fbecd6;
  --critical-600: #b14a35;
  --critical-500: #c25a44;
  --critical-100: #f3dcd4;
  --info-500:     #5a7d8c;
  --info-100:     #dde9ed;

  /* ============================================================
     SEMANTIC ALIASES — design against these, not the base scale
     ============================================================ */

  /* Surfaces & backgrounds */
  --color-canvas:        var(--paper-100);
  --color-surface:       var(--paper-50);
  --color-surface-raised: var(--paper-0);
  --color-surface-sunk:  var(--paper-200);
  --color-surface-inverse: var(--forest-600);
  --color-overlay:       rgba(42, 39, 34, 0.46);

  /* Text */
  --text-primary:   var(--ink-900);
  --text-heading:   var(--forest-600);
  --text-secondary: var(--stone-700);
  --text-muted:     var(--stone-500);
  --text-on-clay:   #fff7f2;
  --text-on-forest: var(--paper-100);
  --text-on-amber:  var(--ink-900);
  --text-link:      var(--clay-700);
  --text-link-hover:var(--clay-800);

  /* Brand roles */
  --color-primary:        var(--clay-500);
  --color-primary-hover:  var(--clay-600);
  --color-primary-press:  var(--clay-700);
  --color-primary-soft:   var(--clay-100);
  --color-secondary:      var(--forest-600);
  --color-secondary-hover:var(--forest-700);
  --color-secondary-soft: var(--forest-100);
  --color-accent:         var(--amber-500);
  --color-accent-hover:   var(--amber-600);
  --color-accent-soft:    var(--amber-100);

  /* Borders & lines */
  --border-subtle:  rgba(42, 39, 34, 0.08);
  --border-default: rgba(42, 39, 34, 0.14);
  --border-strong:  rgba(42, 39, 34, 0.24);
  --border-clay:    var(--clay-300);
  --border-forest:  var(--forest-300);

  /* Focus */
  --focus-ring: var(--amber-500);

  /* Feedback */
  --color-positive: var(--positive-500);
  --color-caution:  var(--caution-500);
  --color-critical: var(--critical-500);
  --color-info:     var(--info-500);
}