/* The five looks a creator can choose, in one place.
 *
 * These lived twice — once in profile.html, once in feedback.html — and the two
 * copies had already drifted into different variable names for the same colour.
 * Anything that shows a creator's work should link this file and put their
 * chosen theme on <body data-theme="…">.
 *
 * Both naming sets are defined together on purpose. An alias declared elsewhere
 * (--electric: var(--accent) in a page's own :root) would resolve against the
 * value of --accent at :root, not the one the theme sets on <body> — so the
 * alias would silently keep the default colour. Declaring both here, in the
 * same rule, avoids that entirely.
 *
 * Each theme carries two text tones. The default pair is what the profile
 * pages have always used; the -bright pair exists because the feedback form was
 * deliberately lightened — nothing on it should read as dim — and a single
 * value would have to spoil one page or the other.
 *
 * Adding a theme means adding a block here and its name to THEMES in
 * netlify/functions/profiles.js, which decides what a profile may store.
 */

:root,
body[data-theme="electric"] {
  --bg: #151a2a;
  --surface: #1e2438;
  --surface-2: #262d44;
  --surface-3: #2f3750;
  --border: rgba(180,195,225,0.2);
  --border-mid: rgba(180,195,225,0.42);
  --border-hi: rgba(180,195,225,0.65);
  --text: #f2f6ff;
  --text-mid: #c2cce0;
  --text-dim: #8792ab;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #dde5f5;
  --text-dim-bright: #c3cee4;
  --silver: #dde5f2;
  --silver-hi: #f4f8ff;

  --accent: #5b8de8;
  --accent-soft: rgba(91,141,232,0.14);
  --electric: #5b8de8;
  --electric-dim: #2a4880;

  --danger: #c0394a;
  --radius: 2px;
}

body[data-theme="ember"] {
  --bg: #140d0c;
  --surface: #1e1412;
  --surface-2: #291c19;
  --surface-3: #33241f;
  --border: rgba(217,116,63,0.24);
  --border-mid: rgba(217,116,63,0.45);
  --border-hi: rgba(217,116,63,0.7);
  --text: #fdf3ee;
  --text-mid: #e6c9b8;
  --text-dim: #b08d78;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #f0ddd0;
  --text-dim-bright: #d8bba6;
  --silver: #f0ddd0;
  --silver-hi: #fdf3ee;

  --accent: #d9743f;
  --accent-soft: rgba(217,116,63,0.14);
  --electric: #d9743f;
  --electric-dim: #7a3f20;
}

body[data-theme="orchid"] {
  --bg: #150e1c;
  --surface: #1f1529;
  --surface-2: #2a1d37;
  --surface-3: #352545;
  --border: rgba(180,120,232,0.24);
  --border-mid: rgba(180,120,232,0.45);
  --border-hi: rgba(180,120,232,0.7);
  --text: #f7f0fd;
  --text-mid: #d6c4e8;
  --text-dim: #a189b8;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #e6d8f5;
  --text-dim-bright: #cbb6e2;
  --silver: #e6d8f5;
  --silver-hi: #f7f0fd;

  --accent: #b478e8;
  --accent-soft: rgba(180,120,232,0.14);
  --electric: #b478e8;
  --electric-dim: #5f3d7d;
}

body[data-theme="moss"] {
  --bg: #0d1512;
  --surface: #141f1a;
  --surface-2: #1c2b24;
  --surface-3: #24362d;
  --border: rgba(95,191,148,0.24);
  --border-mid: rgba(95,191,148,0.45);
  --border-hi: rgba(95,191,148,0.7);
  --text: #eefaf4;
  --text-mid: #bcd8cb;
  --text-dim: #85a394;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #d6ece1;
  --text-dim-bright: #a9cbbb;
  --silver: #d6ece1;
  --silver-hi: #eefaf4;

  --accent: #5fbf94;
  --accent-soft: rgba(95,191,148,0.14);
  --electric: #5fbf94;
  --electric-dim: #2f6650;
}

body[data-theme="noir"] {
  --bg: #101011;
  --surface: #1a1a1c;
  --surface-2: #242427;
  --surface-3: #2e2e32;
  --border: rgba(201,201,210,0.2);
  --border-mid: rgba(201,201,210,0.4);
  --border-hi: rgba(201,201,210,0.62);
  --text: #f4f4f6;
  --text-mid: #c4c4cc;
  --text-dim: #8a8a94;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #dcdce2;
  --text-dim-bright: #b6b6c0;
  --silver: #dcdce2;
  --silver-hi: #f4f4f6;

  --accent: #c9c9d2;
  --accent-soft: rgba(201,201,210,0.12);
  --electric: #c9c9d2;
  --electric-dim: #5c5c66;
}

/* The six added later are generated from a background hue and an accent the
 * same way the five above were tuned by hand, so they sit alongside them. */

body[data-theme="rose"] {
  --bg: #160c0f;
  --surface: #211217;
  --surface-2: #2c191f;
  --surface-3: #372027;
  --border: rgba(232,114,154,0.24);
  --border-mid: rgba(232,114,154,0.45);
  --border-hi: rgba(232,114,154,0.7);
  --text: #fbeff3;
  --text-mid: #dcbcc7;
  --text-dim: #ab8793;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #ebd5dd;
  --text-dim-bright: #d0b3bd;
  --silver: #ebd5dd;
  --silver-hi: #fbeff3;

  --accent: #e8729a;
  --accent-soft: rgba(232,114,154,0.14);
  --electric: #e8729a;
  --electric-dim: #683345;
}

body[data-theme="ocean"] {
  --bg: #0a1317;
  --surface: #101d23;
  --surface-2: #16272f;
  --surface-3: #1d303a;
  --border: rgba(63,180,217,0.24);
  --border-mid: rgba(63,180,217,0.45);
  --border-hi: rgba(63,180,217,0.7);
  --text: #eff7fb;
  --text-mid: #bcd1dc;
  --text-dim: #879fab;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #d5e4eb;
  --text-dim-bright: #b3c7d0;
  --silver: #d5e4eb;
  --silver-hi: #eff7fb;

  --accent: #3fb4d9;
  --accent-soft: rgba(63,180,217,0.14);
  --electric: #3fb4d9;
  --electric-dim: #1c5162;
}

body[data-theme="gold"] {
  --bg: #16130c;
  --surface: #211d12;
  --surface-2: #2c2619;
  --surface-3: #373020;
  --border: rgba(217,176,74,0.24);
  --border-mid: rgba(217,176,74,0.45);
  --border-hi: rgba(217,176,74,0.7);
  --text: #fbf7ef;
  --text-mid: #dcd3bc;
  --text-dim: #aba087;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #ebe5d5;
  --text-dim-bright: #d0c8b3;
  --silver: #ebe5d5;
  --silver-hi: #fbf7ef;

  --accent: #d9b04a;
  --accent-soft: rgba(217,176,74,0.14);
  --electric: #d9b04a;
  --electric-dim: #624f21;
}

body[data-theme="crimson"] {
  --bg: #170b0c;
  --surface: #231012;
  --surface-2: #2e1719;
  --surface-3: #391d20;
  --border: rgba(224,72,94,0.24);
  --border-mid: rgba(224,72,94,0.45);
  --border-hi: rgba(224,72,94,0.7);
  --text: #fbeff0;
  --text-mid: #dcbcbe;
  --text-dim: #ab878a;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #ebd5d7;
  --text-dim-bright: #d0b3b6;
  --silver: #ebd5d7;
  --silver-hi: #fbeff0;

  --accent: #e0485e;
  --accent-soft: rgba(224,72,94,0.14);
  --electric: #e0485e;
  --electric-dim: #65202a;
}

body[data-theme="midnight"] {
  --bg: #0a0c17;
  --surface: #0f1224;
  --surface-2: #151930;
  --surface-3: #1c203b;
  --border: rgba(124,140,255,0.24);
  --border-mid: rgba(124,140,255,0.45);
  --border-hi: rgba(124,140,255,0.7);
  --text: #eff0fb;
  --text-mid: #bcc0dc;
  --text-dim: #878cab;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #d5d8eb;
  --text-dim-bright: #b3b7d0;
  --silver: #d5d8eb;
  --silver-hi: #eff0fb;

  --accent: #7c8cff;
  --accent-soft: rgba(124,140,255,0.14);
  --electric: #7c8cff;
  --electric-dim: #383f73;
}

body[data-theme="ice"] {
  --bg: #0d1114;
  --surface: #141a1f;
  --surface-2: #1b242a;
  --surface-3: #232d34;
  --border: rgba(159,212,245,0.24);
  --border-mid: rgba(159,212,245,0.45);
  --border-hi: rgba(159,212,245,0.7);
  --text: #eff6fb;
  --text-mid: #bccfdc;
  --text-dim: #879cab;
  /* For pages that deliberately read brighter — see the note above. */
  --text-mid-bright: #d5e2eb;
  --text-dim-bright: #b3c4d0;
  --silver: #d5e2eb;
  --silver-hi: #eff6fb;

  --accent: #9fd4f5;
  --accent-soft: rgba(159,212,245,0.14);
  --electric: #9fd4f5;
  --electric-dim: #485f6e;
}

/* The one light theme. Its palette is complete here, but the pages that use
 * it were built dark — white-alpha glass and lines, dark bars, dark text on
 * accent buttons — so each of them scopes those back under
 * body[data-theme="daylight"] (profile.html, feedback.html). Its accent is deep
 * enough to read as text on white; a creator's own accent is darkened to match
 * by the page before it is applied. */

body[data-theme="daylight"] {
  --bg: #f6f4ef;
  --surface: #ffffff;
  --surface-2: #f0ede6;
  --surface-3: #e6e2d9;
  --border: rgba(28,32,52,0.13);
  --border-mid: rgba(28,32,52,0.24);
  --border-hi: rgba(28,32,52,0.4);
  --text: #191c28;
  --text-mid: #464b5d;
  --text-dim: #666b7e;
  /* "Brighter" on a light page means more legible, so these go darker. */
  --text-mid-bright: #383d4f;
  --text-dim-bright: #555a6d;
  --silver: #383d4f;
  --silver-hi: #191c28;

  --accent: #2f62d6;
  --accent-soft: rgba(47,98,214,0.1);
  --electric: #2f62d6;
  --electric-dim: #9db6ec;
  color-scheme: light;
}
