/* Theme presets — switched via [data-theme] on <body> */

:root,
[data-theme="black"] {
  --theme-bg: #000000;
  --theme-text: #ffffff;
  --theme-text-soft: rgba(255, 255, 255, 0.7);
  --theme-text-faint: rgba(255, 255, 255, 0.42);
  --theme-accent: #ffffff;
  --theme-border: rgba(255, 255, 255, 0.18);
  --theme-highlight: #D8261B;
}

[data-theme="red"] {
  --theme-bg: #B61C12;
  --theme-text: #ffffff;
  --theme-text-soft: rgba(255, 255, 255, 0.78);
  --theme-text-faint: rgba(255, 255, 255, 0.5);
  --theme-accent: #ffffff;
  --theme-border: rgba(255, 255, 255, 0.22);
  --theme-highlight: #F8F2D8;
}

[data-theme="blue"] {
  --theme-bg: #1A1FCB;
  --theme-text: #ffffff;
  --theme-text-soft: rgba(255, 255, 255, 0.78);
  --theme-text-faint: rgba(255, 255, 255, 0.5);
  --theme-accent: #ffffff;
  --theme-border: rgba(255, 255, 255, 0.22);
  --theme-highlight: #FBEBE6;
}

[data-theme="light-blue"] {
  --theme-bg: #BFEAF5;
  --theme-text: #000000;
  --theme-text-soft: rgba(0, 0, 0, 0.7);
  --theme-text-faint: rgba(0, 0, 0, 0.45);
  --theme-accent: #000000;
  --theme-border: rgba(0, 0, 0, 0.2);
  --theme-highlight: #B61C12;
}

[data-theme="cream"] {
  --theme-bg: #F8F2D8;
  --theme-text: #000000;
  --theme-text-soft: rgba(0, 0, 0, 0.7);
  --theme-text-faint: rgba(0, 0, 0, 0.45);
  --theme-accent: #000000;
  --theme-border: rgba(0, 0, 0, 0.2);
  --theme-highlight: #B61C12;
}

[data-theme="pink"] {
  --theme-bg: #faf2ef;
  --theme-text: #000000;
  --theme-text-soft: rgba(0, 0, 0, 0.7);
  --theme-text-faint: rgba(0, 0, 0, 0.45);
  --theme-accent: #000000;
  --theme-border: rgba(0, 0, 0, 0.2);
  --theme-highlight: #B61C12;
}

[data-theme="white"] {
  --theme-bg: #FFFFFF;
  --theme-text: #000000;
  --theme-text-soft: rgba(0, 0, 0, 0.7);
  --theme-text-faint: rgba(0, 0, 0, 0.45);
  --theme-accent: #D8261B;
  --theme-border: rgba(0, 0, 0, 0.16);
  --theme-highlight: #D8261B;
}

[data-theme="warm-grey"] {
  --theme-bg: #9A9690;
  --theme-text: #C81B12;
  --theme-text-soft: rgba(200, 27, 18, 0.78);
  --theme-text-faint: rgba(200, 27, 18, 0.5);
  --theme-accent: #C81B12;
  --theme-border: rgba(200, 27, 18, 0.28);
  --theme-highlight: #ffffff;
}

/* Custom theme: variables come from inline style on <body> */
[data-theme="custom"] {
  --theme-bg: var(--c-bg, #000);
  --theme-text: var(--c-text, #fff);
  --theme-text-soft: color-mix(in srgb, var(--theme-text) 70%, transparent);
  --theme-text-faint: color-mix(in srgb, var(--theme-text) 42%, transparent);
  --theme-accent: var(--c-accent, var(--theme-text));
  --theme-border: color-mix(in srgb, var(--theme-text) 18%, transparent);
  --theme-highlight: var(--c-accent, #D8261B);
}