/* ============================================================
   COLOR SCHEMES — Sébastien Reuille
   Sections are painted by applying ONE scheme class. Each scheme
   defines a background, a foreground (card/surface fill), a text
   color, and a border. Child components read the --color-scheme-*
   variables so they invert automatically on dark schemes.
   Values mirror the production site exactly.
   Alternate light/dark schemes down a page to build rhythm.
   ============================================================ */

.scheme-1 {
  --color-scheme-background: var(--color-white);
  --color-scheme-foreground: var(--color-neutral-lightest);
  --color-scheme-text: var(--color-neutral-darkest);
  --color-scheme-border: var(--color-black-15);
  background-color: var(--color-scheme-background);
  color: var(--color-scheme-text);
}

.scheme-2 {
  --color-scheme-background: var(--color-neutral-lightest);
  --color-scheme-foreground: var(--color-white);
  --color-scheme-text: var(--color-neutral-darkest);
  --color-scheme-border: var(--color-black-15);
  background-color: var(--color-scheme-background);
  color: var(--color-scheme-text);
}

.scheme-3 {
  --color-scheme-background: var(--color-alabaster-darkest);
  --color-scheme-foreground: var(--color-alabaster-darker);
  --color-scheme-text: var(--color-white);
  --color-scheme-border: var(--color-white-20);
  --color-scheme-btn-text: var(--color-neutral-darkest);
  background-color: var(--color-scheme-background);
  color: var(--color-scheme-text);
}

.scheme-4 {
  --color-scheme-background: var(--color-cod-gray);
  --color-scheme-foreground: var(--color-cod-gray-dark);
  --color-scheme-text: var(--color-white);
  --color-scheme-border: var(--color-white-20);
  --color-scheme-btn-text: var(--color-neutral-darkest);
  background-color: var(--color-scheme-background);
  color: var(--color-scheme-text);
}

.scheme-5 {
  --color-scheme-background: var(--color-turmeric);
  --color-scheme-foreground: var(--color-turmeric-dark);
  --color-scheme-text: var(--color-white);
  --color-scheme-border: var(--color-white-20);
  --color-scheme-btn-text: var(--color-neutral-darkest);
  background-color: var(--color-scheme-background);
  color: var(--color-scheme-text);
}