/*
 * Aurora color tokens
 *
 * Theme resolution:
 *   - No data-theme attribute  -> follows prefers-color-scheme
 *   - <html data-theme="light"> -> forces light
 *   - <html data-theme="dark">  -> forces dark
 *
 * All text/surface and control-border pairings are >= 4.5:1.
 * Decorative --border is exempt and must never be the only boundary of a control.
 * The dark values appear twice (system preference, manual override): change both.
 */

/* ---------- Light (default) ---------- */
:root {
  color-scheme: light dark;

  --bg:             #FFFFFF;
  --surface:        #F6F5F3;
  --surface-raised: #FFFFFF;
  --surface-sunken: #EDEBE8;

  --text:           #181716;
  --text-muted:     #55514C;  /* floor for any text, incl. placeholders */

  --primary:        #1F1E24;  /* the main button */
  --primary-hover:  #3A3841;
  --on-primary:     #FFFFFF;
  --accent:         #A8245C;
  --on-accent:      #FFFFFF;
  --link:           #A8245C;
  --focus-ring:     #1F1E24;

  --border:         #D3CFCA;  /* decorative dividers only */
  --border-strong:  #77726B;  /* inputs, controls */

  --success:        #146C2E;
  --warning:        #855000;
  --danger:         #B3261E;
  --info:           #0B5CAD;

  /* Video player letterboxing: black in light and dark alike */
  --player-bg:      #000000;
}

:root[data-theme="light"] {
  color-scheme: light;
}

/* ---------- Dark: system preference (unless forced light) ---------- */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg:             #121113;
    --surface:        #1B1A1D;
    --surface-raised: #252327;
    --surface-sunken: #0C0B0D;

    --text:           #F2F0EE;
    --text-muted:     #AEA9A2;

    --primary:        #F2F0EE;
    --primary-hover:  #FFFFFF;
    --on-primary:     #121113;
    --accent:         #FF8FB8;
    --on-accent:      #121113;
    --link:           #FF8FB8;
    --focus-ring:     #F2F0EE;

    --border:         #35323A;
    --border-strong:  #8A848D;

    --success:        #5FD08A;
    --warning:        #F0B34A;
    --danger:         #FF8A80;
    --info:           #7DB8FF;
  }
}

/* ---------- Dark: manual override ---------- */
:root[data-theme="dark"] {
  color-scheme: dark;

  --bg:             #121113;
  --surface:        #1B1A1D;
  --surface-raised: #252327;
  --surface-sunken: #0C0B0D;

  --text:           #F2F0EE;
  --text-muted:     #AEA9A2;

  --primary:        #F2F0EE;
  --primary-hover:  #FFFFFF;
  --on-primary:     #121113;
  --accent:         #FF8FB8;
  --on-accent:      #121113;
  --link:           #FF8FB8;
  --focus-ring:     #F2F0EE;

  --border:         #35323A;
  --border-strong:  #8A848D;

  --success:        #5FD08A;
  --warning:        #F0B34A;
  --danger:         #FF8A80;
  --info:           #7DB8FF;
}