/* Theme variants — aligned with src/theme/variables.scss */

:root[data-theme="dark"] {
  --color-primary: #c9a227;
  --color-primary-text: #c9a227;
  --color-primary-contrast: #111418;
  --color-secondary: #4688c7;
  --color-tertiary: #6f8f7a;
  --color-success: #4ecf88;
  --color-success-text: #4ecf88;
  --color-warning: #f2a93b;
  --color-danger: #e8697a;

  --color-bg: #111418;
  --color-bg-elevated: #20262e;
  --color-surface: #181d23;
  --color-border: #313845;
  --color-border-strong: #485263;

  --color-text: #eef1f4;
  --color-text-muted: #989fa8;
  --color-text-subtle: #6d7683;

  --color-brand-subtle: rgba(201, 162, 39, 0.14);
  --shadow-elevated: 0 4px 16px rgba(0, 0, 0, 0.35);
  --focus-ring: 0 0 0 3px rgba(201, 162, 39, 0.4);
}

:root.color-blind {
  --color-primary: #0000cc;
  --color-primary-text: #0000cc;
  --color-primary-contrast: #ffffff;
  --color-secondary: #ffaa00;
  --color-tertiary: #9966cc;
  --color-success: #007799;
  --color-success-text: #007799;
  --color-warning: #ffbb33;
  --color-danger: #cc6600;

  --color-bg: #fafbfd;
  --color-bg-elevated: #edf0f7;
  --color-surface: #fafbfd;
  --color-border: #dde3ee;
  --color-border-strong: #bcc6da;

  --color-text: #0f1520;
  --color-text-muted: #4f5c78;
  --color-text-subtle: #7a8ba0;

  --color-brand-subtle: #eef3ff;
  --focus-ring: 0 0 0 3px rgba(0, 0, 204, 0.35);
}

:root.color-blind[data-theme="dark"] {
  /* --color-primary (#0000cc) is tuned for white-text-on-it (buttons) and
     stays that way regardless of light/dark — but as foreground TEXT on
     this theme's dark surfaces, #0000cc is nearly invisible (~1.5:1). A
     lighter, still-recognizably-blue variant is needed here specifically. */
  --color-primary-text: #6699ff;
  /* #007799 as text on this theme's dark surfaces drops to ~3.4:1 — a
     lighter teal is needed here, same reasoning as --color-primary-text. */
  --color-success-text: #1aa8c9;
  --color-bg: #0f1117;
  --color-bg-elevated: #1a2035;
  --color-surface: #161b27;
  --color-border: #1e2738;
  --color-border-strong: #2a3650;

  --color-text: #e8edf5;
  --color-text-muted: #b3bfcc;
  --color-text-subtle: #8a9ab5;

  --color-brand-subtle: #1a2540;
  --focus-ring: 0 0 0 3px rgba(0, 102, 255, 0.45);
}

:root.red-green {
  --color-primary: #0066cc;
  /* #0066cc as text is only 4.58:1 on this theme's elevated background —
     technically AA but with almost no margin. Darkened slightly for a
     comfortable buffer; --color-primary itself (buttons/borders) unchanged. */
  --color-primary-text: #0058ad;
  --color-primary-contrast: #ffffff;
  --color-secondary: #ffcc00;
  --color-tertiary: #9933ff;
  --color-success: #0099cc;
  /* #0099cc as text is only 3.14:1 on this theme's surface, below WCAG
     AA's 3:1-for-graphical-objects with no margin — darkened for a
     comfortable buffer, same technique as --color-primary-text above. */
  --color-success-text: #006687;
  --color-warning: #ff9900;
  --color-danger: #996600;

  --color-bg: #f7f3ee;
  --color-bg-elevated: #efe8e0;
  --color-surface: #fdfaf7;
  --color-border: #e0d5c8;
  --color-border-strong: #b8a99a;

  --color-text: #1a1410;
  --color-text-muted: #5f5145;
  --color-text-subtle: #85786d;

  --color-brand-subtle: #f2eadf;
  --focus-ring: 0 0 0 3px rgba(0, 102, 204, 0.35);
}

:root.red-green[data-theme="dark"] {
  /* Same reasoning as color-blind-dark: #0066cc as text on this theme's
     dark surfaces drops to ~2.7-3.1:1 — a lighter blue is needed here. */
  --color-primary-text: #4da6ff;
  --color-success-text: #0099cc;
  --color-bg: #141210;
  --color-bg-elevated: #2a2622;
  --color-surface: #1f1c19;
  --color-border: #3d3833;
  --color-border-strong: #5a524a;

  --color-text: #f2ede6;
  --color-text-muted: #c5bcb0;
  --color-text-subtle: #887d72;

  --color-brand-subtle: #2a241c;
  --focus-ring: 0 0 0 3px rgba(0, 153, 204, 0.45);
}
