/* AEVUM Design System — Color Tokens
   Derived from studio photography: deep charcoal interiors, warm amber architectural
   lighting, red light therapy accent, natural oak/cedar materiality.
*/

:root {

  /* ── VOID / BASE ─────────────────────────────────────────── */
  --color-void:            #08070A;   /* true black, out-of-bounds */
  --color-abyss:           #0E0C10;   /* primary page background   */

  /* ── CHARCOAL SCALE ──────────────────────────────────────── */
  --color-charcoal-950:    #141218;   /* slightly elevated surface */
  --color-charcoal-900:    #1C1A20;   /* cards, panels             */
  --color-charcoal-800:    #24222A;   /* elevated / hover target   */
  --color-charcoal-700:    #302E38;   /* hairline borders           */
  --color-charcoal-600:    #3E3C48;   /* disabled element borders  */
  --color-charcoal-500:    #545060;   /* muted / disabled fills    */
  --color-charcoal-400:    #706C7A;   /* placeholder text          */
  --color-charcoal-300:    #9A96A5;   /* muted text                */
  --color-charcoal-200:    #C0BBCA;   /* secondary text            */
  --color-charcoal-100:    #E8E5F0;   /* near-white                */
  --color-cream:           #F0EDE8;   /* primary text (warm white) */

  /* ── AMBER / ARCHITECTURAL LIGHT ────────────────────────── */
  /* Sampled from LED strip lighting in studio photography     */
  --color-amber-950:       #1E0E04;
  --color-amber-800:       #4A2008;
  --color-amber-700:       #702E0C;
  --color-amber-600:       #9A4414;
  --color-amber-500:       #C87830;   /* primary architectural amber */
  --color-amber-400:       #D48840;   /* hover / highlight           */
  --color-amber-300:       #E0A060;   /* warm glow highlight         */
  --color-amber-200:       #ECC090;
  --color-amber-100:       #F5DEB8;

  /* ── RED / RED LIGHT THERAPY ─────────────────────────────── */
  /* Used ONLY in red light therapy context — never generically */
  --color-red-950:         #140404;
  --color-red-800:         #5C0C0C;
  --color-red-600:         #991818;
  --color-red-500:         #CC2020;   /* red light panel accent    */
  --color-red-400:         #E03030;   /* bright red                */
  --color-red-300:         #F05050;

  /* ── OAK / CEDAR ─────────────────────────────────────────── */
  /* Warm wood tones from sauna + shelf materiality             */
  --color-oak-dark:        #3C200C;
  --color-oak:             #7A5028;
  --color-oak-light:       #A06E38;

  /* ── SEMANTIC ALIASES ────────────────────────────────────── */
  --bg-base:               var(--color-abyss);
  --bg-surface:            var(--color-charcoal-950);
  --bg-card:               var(--color-charcoal-900);
  --bg-elevated:           var(--color-charcoal-800);
  --bg-overlay:            rgba(8, 7, 10, 0.85);
  --bg-glass:              rgba(20, 18, 24, 0.70);

  --border-hairline:       rgba(240, 237, 232, 0.06);
  --border-subtle:         rgba(240, 237, 232, 0.10);
  --border-default:        rgba(240, 237, 232, 0.16);
  --border-amber:          rgba(200, 120, 48, 0.30);
  --border-red:            rgba(204, 32, 32, 0.25);

  --text-primary:          var(--color-cream);
  --text-secondary:        var(--color-charcoal-200);
  --text-muted:            var(--color-charcoal-300);
  --text-disabled:         var(--color-charcoal-400);
  --text-amber:            var(--color-amber-400);
  --text-red:              var(--color-red-400);

  --accent-amber:          var(--color-amber-500);
  --accent-amber-hover:    var(--color-amber-400);
  --accent-red:            var(--color-red-500);
  --accent-red-glow:       rgba(204, 32, 32, 0.18);
  --accent-amber-glow:     rgba(200, 120, 48, 0.14);
}