/* ══════════════════════════════════════════════════════════════════════════
   COLORS — Peter Computer Services
   Base palette (raw scales) + semantic aliases that flip between light & dark.
   Accent: warm amber-gold #F5B400. Neutrals: warm "stone / sand".
   ══════════════════════════════════════════════════════════════════════════ */

:root {
  /* ── Brand: amber-gold scale ───────────────────────────────────────────── */
  --yellow-50:  #FEF8E6;
  --yellow-100: #FDEFC2;
  --yellow-200: #FBE08A;
  --yellow-300: #F9CE4D;
  --yellow-400: #F5B400;  /* ← primary brand accent */
  --yellow-500: #DBA000;
  --yellow-600: #B98400;
  --yellow-700: #936800;
  --yellow-800: #6E4E00;
  --yellow-900: #4A3500;

  /* ── Warm neutral: "stone / sand" scale ────────────────────────────────── */
  --stone-0:   #FFFFFF;
  --stone-50:  #FAF8F4;
  --stone-100: #F3EEE5;
  --stone-150: #ECE5D8;
  --stone-200: #E2D9C8;
  --stone-300: #CDC1AC;
  --stone-400: #A89B82;
  --stone-500: #847862;
  --stone-600: #645B49;
  --stone-700: #4A4337;
  --stone-800: #322D25;
  --stone-850: #28241D;
  --stone-900: #1F1B16;
  --stone-950: #15120E;

  /* ── Semantic status hues (shared, tuned warm) ─────────────────────────── */
  --green-500:  #3FA34D;
  --green-100:  #DDF1E0;
  --green-700:  #2C7637;
  --red-500:    #D6453B;
  --red-100:    #FAE0DD;
  --red-700:    #A52E26;
  --blue-500:   #3B82C4;
  --blue-100:   #DCEAF6;
  --blue-700:   #2A5F92;
  --orange-500: #E8800C;
  --orange-100: #FBE6CC;
  --orange-700: #B0610A;
}

/* ══════════════════════════════════════════════════════════════════════════
   LIGHT THEME (default) — semantic aliases
   ══════════════════════════════════════════════════════════════════════════ */
:root,
[data-theme="light"] {
  color-scheme: light;

  /* Accent */
  --accent:            var(--yellow-400);
  --accent-hover:      var(--yellow-500);
  --accent-press:      var(--yellow-600);
  --accent-soft:       var(--yellow-100);
  --accent-soft-hover: var(--yellow-200);
  --on-accent:         var(--stone-900);   /* dark text reads best on yellow */

  /* Surfaces */
  --bg:            var(--stone-50);
  --bg-subtle:     var(--stone-100);
  --surface:       var(--stone-0);
  --surface-2:     var(--stone-50);
  --surface-sunken:var(--stone-100);
  --surface-inverse: var(--stone-900);

  /* Text */
  --text:          var(--stone-900);
  --text-secondary:var(--stone-600);
  --text-muted:    var(--stone-500);
  --text-faint:    var(--stone-400);
  --text-inverse:  var(--stone-50);
  --text-on-accent:var(--stone-900);
  --text-link:     var(--yellow-700);

  /* Borders & lines */
  --border:        var(--stone-200);
  --border-strong: var(--stone-300);
  --border-subtle: var(--stone-150);
  --ring:          var(--yellow-400);

  /* Status — foreground / soft-bg pairs */
  --success:       var(--green-500);
  --success-soft:  var(--green-100);
  --success-text:  var(--green-700);
  --danger:        var(--red-500);
  --danger-soft:   var(--red-100);
  --danger-text:   var(--red-700);
  --info:          var(--blue-500);
  --info-soft:     var(--blue-100);
  --info-text:     var(--blue-700);
  --warning:       var(--orange-500);
  --warning-soft:  var(--orange-100);
  --warning-text:  var(--orange-700);

  /* Shadow tint (warm brown, not neutral black) */
  --shadow-color: 38 28 12;
}

/* ══════════════════════════════════════════════════════════════════════════
   DARK THEME — "dark stone"
   ══════════════════════════════════════════════════════════════════════════ */
[data-theme="dark"] {
  color-scheme: dark;

  --accent:            var(--yellow-400);
  --accent-hover:      var(--yellow-300);
  --accent-press:      var(--yellow-500);
  --accent-soft:       rgba(245, 180, 0, 0.16);
  --accent-soft-hover: rgba(245, 180, 0, 0.26);
  --on-accent:         var(--stone-900);

  --bg:            var(--stone-950);
  --bg-subtle:     var(--stone-900);
  --surface:       var(--stone-850);
  --surface-2:     var(--stone-800);
  --surface-sunken:var(--stone-950);
  --surface-inverse: var(--stone-50);

  --text:          var(--stone-50);
  --text-secondary:var(--stone-300);
  --text-muted:    var(--stone-400);
  --text-faint:    var(--stone-500);
  --text-inverse:  var(--stone-900);
  --text-on-accent:var(--stone-900);
  --text-link:     var(--yellow-300);

  --border:        var(--stone-800);
  --border-strong: var(--stone-700);
  --border-subtle: var(--stone-850);
  --ring:          var(--yellow-400);

  --success:       #4FB95E;
  --success-soft:  rgba(63, 163, 77, 0.18);
  --success-text:  #7FD68B;
  --danger:        #E85A50;
  --danger-soft:   rgba(214, 69, 59, 0.18);
  --danger-text:   #F09A92;
  --info:          #5499D6;
  --info-soft:     rgba(59, 130, 196, 0.18);
  --info-text:     #8FC0E8;
  --warning:       #F59A2E;
  --warning-soft:  rgba(232, 128, 12, 0.18);
  --warning-text:  #F6BC73;

  --shadow-color: 0 0 0;
}