/* ==========================================================================
   Fonts (self-hosted, no Google Fonts tracking)
   ========================================================================== */
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/poppins-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 500; font-display: swap; src: url('/assets/fonts/poppins-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 600; font-display: swap; src: url('/assets/fonts/poppins-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 700; font-display: swap; src: url('/assets/fonts/poppins-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Poppins'; font-style: normal; font-weight: 800; font-display: swap; src: url('/assets/fonts/poppins-latin-800-normal.woff2') format('woff2'); }
@font-face { font-family: 'Luckiest Guy'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/luckiest-guy-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Creepster'; font-style: normal; font-weight: 400; font-display: swap; src: url('/assets/fonts/creepster-latin-400-normal.woff2') format('woff2'); }

/* ==========================================================================
   Theme tokens
   The variable names follow the Atom template (--background, --panel, --border,
   --main-color, --color-accent, --text …). Every theme sets all of them.
   ========================================================================== */

:root,
[data-theme='halloween'] {
  color-scheme: dark;
  --background: #17101f;
  --background-transparent: rgba(23, 16, 31, 0.8);
  --footer: #0e0913;
  --transparent: rgba(255, 255, 255, 0.12);
  --transparent-hover: rgba(255, 255, 255, 0.2);
  --panel: #231a2e;
  --border: #33263f;
  --main-color: #ee7a1f;
  --main-color-hover: #cc6212;
  --color-accent: #ffa53d;
  --accent-glow: rgba(255, 150, 50, 0.35);
  --white: #ffffff;
  --heading: #ffffff;
  --text: rgba(255, 224, 200, 0.8);
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #52b43a;
  --green-hover: #469a31;
  --secondary: #8a4fc2;
  --season: #86e05a;
  --sky-top: #0f0a1c;
  --sky-bottom: #4a1f3a;
  --horizon: #ff8a2a;
  --scene-far: #2a1838;
  --scene-near: #0b0610;
  --logo-grad: linear-gradient(180deg, #ffe08a 0%, #ffb347 38%, #ff7a1a 62%, #c2410c 100%);
  --logo-depth: #3a1403;
  --logo-stroke: #1c0b01;
  --logo-sub: linear-gradient(90deg, #5a2d82, #8a4fc2);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Creepster', 'Luckiest Guy', cursive;
}

/* The original Atom colours */
[data-theme='classic'] {
  color-scheme: dark;
  --background: #1c242c;
  --background-transparent: rgba(28, 36, 44, 0.85);
  --footer: #141820;
  --transparent: rgba(255, 255, 255, 0.15);
  --transparent-hover: rgba(187, 187, 187, 0.15);
  --panel: #25323e;
  --border: #2c3a47;
  --main-color: #4cb1d0;
  --main-color-hover: #3e92ac;
  --color-accent: #3dd1ff;
  --accent-glow: rgba(61, 209, 255, 0.2);
  --white: #ffffff;
  --heading: #ffffff;
  --text: rgba(176, 227, 255, 0.8);
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #41b95b;
  --green-hover: #3daa55;
  --secondary: #3e92ac;
  --season: #3dd1ff;
  --sky-top: #1b2a3a;
  --sky-bottom: #3b5a74;
  --horizon: #8fd6ee;
  --scene-far: #243646;
  --scene-near: #16202a;
  --logo-grad: linear-gradient(180deg, #ffffff 0%, #bfe6f3 50%, #3fa9c9 100%);
  --logo-depth: #0f3a48;
  --logo-stroke: #0b1a20;
  --logo-sub: linear-gradient(90deg, #2b86a3, #3fa9c9);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Luckiest Guy', 'Poppins', sans-serif;
}

[data-theme='winter'] {
  color-scheme: dark;
  --background: #0f1a2a;
  --background-transparent: rgba(15, 26, 42, 0.82);
  --footer: #0a121e;
  --transparent: rgba(255, 255, 255, 0.13);
  --transparent-hover: rgba(255, 255, 255, 0.2);
  --panel: #172638;
  --border: #213349;
  --main-color: #d63a3a;
  --main-color-hover: #b52c2c;
  --color-accent: #8fd3ff;
  --accent-glow: rgba(143, 211, 255, 0.3);
  --white: #ffffff;
  --heading: #ffffff;
  --text: rgba(205, 232, 255, 0.82);
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #3fae5f;
  --green-hover: #36954f;
  --secondary: #3d8fd6;
  --season: #b9e3ff;
  --sky-top: #081427;
  --sky-bottom: #24466b;
  --horizon: #9fd8ff;
  --scene-far: #1b3553;
  --scene-near: #eaf6ff;
  --logo-grad: linear-gradient(180deg, #ffffff 0%, #d9f0ff 45%, #7cc7ff 100%);
  --logo-depth: #173b61;
  --logo-stroke: #0a1b2e;
  --logo-sub: linear-gradient(90deg, #a51f1f, #e23b3b);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Luckiest Guy', 'Poppins', sans-serif;
}

[data-theme='spring'] {
  color-scheme: dark;
  --background: #132019;
  --background-transparent: rgba(19, 32, 25, 0.82);
  --footer: #0c150f;
  --transparent: rgba(255, 255, 255, 0.13);
  --transparent-hover: rgba(255, 255, 255, 0.2);
  --panel: #1b2d22;
  --border: #25392c;
  --main-color: #e46fae;
  --main-color-hover: #c9568f;
  --color-accent: #ffa3d2;
  --accent-glow: rgba(255, 163, 210, 0.3);
  --white: #ffffff;
  --heading: #ffffff;
  --text: rgba(215, 245, 222, 0.82);
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #4fb43a;
  --green-hover: #449a32;
  --secondary: #5cbf3f;
  --season: #9be07b;
  --sky-top: #7cc3e8;
  --sky-bottom: #d5f0ff;
  --horizon: #fff4d6;
  --scene-far: #4f9a4a;
  --scene-near: #2d6b2f;
  --logo-grad: linear-gradient(180deg, #ffffff 0%, #ffd6ea 45%, #ff8fc7 100%);
  --logo-depth: #5a1c3b;
  --logo-stroke: #2b0b1b;
  --logo-sub: linear-gradient(90deg, #3f932a, #5cbf3f);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Luckiest Guy', 'Poppins', sans-serif;
}

[data-theme='summer'] {
  color-scheme: dark;
  --background: #1d1710;
  --background-transparent: rgba(29, 23, 16, 0.82);
  --footer: #14100a;
  --transparent: rgba(255, 255, 255, 0.13);
  --transparent-hover: rgba(255, 255, 255, 0.2);
  --panel: #2a2116;
  --border: #372b1d;
  --main-color: #f0a018;
  --main-color-hover: #cf8710;
  --color-accent: #2fd0cf;
  --accent-glow: rgba(47, 208, 207, 0.3);
  --white: #ffffff;
  --heading: #ffffff;
  --text: rgba(255, 238, 205, 0.82);
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #45b35a;
  --green-hover: #3c9a4e;
  --secondary: #1ec8c8;
  --season: #2fd0cf;
  --sky-top: #3aa6e0;
  --sky-bottom: #ffd89a;
  --horizon: #ffb347;
  --scene-far: #3f8f6a;
  --scene-near: #e8c47a;
  --logo-grad: linear-gradient(180deg, #fff7d6 0%, #ffd35c 45%, #ff9f1c 100%);
  --logo-depth: #6b3a00;
  --logo-stroke: #2a1c00;
  --logo-sub: linear-gradient(90deg, #129999, #1ec8c8);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Luckiest Guy', 'Poppins', sans-serif;
}

[data-theme='light'] {
  color-scheme: light;
  --background: #eef0f4;
  --background-transparent: rgba(238, 240, 244, 0.85);
  --footer: #1e222b;
  --transparent: rgba(20, 30, 50, 0.07);
  --transparent-hover: rgba(20, 30, 50, 0.12);
  --panel: #ffffff;
  --border: #e3e7ee;
  --main-color: #ee7a1f;
  --main-color-hover: #cc6212;
  --color-accent: #d9620b;
  --accent-glow: rgba(238, 122, 31, 0.25);
  --white: #ffffff;
  --heading: #1b1f27;
  --text: #545b68;
  --red: #d43246;
  --red-hover: #b92b3d;
  --green: #3fa052;
  --green-hover: #368a46;
  --secondary: #7a3fb5;
  --season: #7a3fb5;
  --sky-top: #ffd9b3;
  --sky-bottom: #fff3e6;
  --horizon: #ffe2c2;
  --scene-far: #f3c79c;
  --scene-near: #e6a978;
  --logo-grad: linear-gradient(180deg, #ffd27a 0%, #ff9a3d 45%, #f26b0f 70%, #c2410c 100%);
  --logo-depth: #5a2203;
  --logo-stroke: #2a1003;
  --logo-sub: linear-gradient(90deg, #5a2d82, #7a3fb5);
  --font-display: 'Luckiest Guy', 'Poppins', system-ui, sans-serif;
  --font-spooky: 'Luckiest Guy', 'Poppins', sans-serif;
}