/* ==========================================================
   Dark mode — off-black + charcoal + warm cream + crimson
   Active when <html data-theme="dark">. Light mode is styles.css alone.
   ========================================================== */
html[data-theme="dark"] {
  color-scheme: dark;
  --paper: #1f1e1d;        /* off-black */
  --blush-2: #262624;      /* charcoal */
  --blush: #262624;
  --sand: #262624;
  --surface: #2c2b29;      /* cards on dark */
  --surface-2: #353432;    /* inputs, chips on dark */
  --ink: #f4efe7;
  --ink-2: #d9d3ca;
  --muted: #a39e97;
  --line: #3e3c39;
  --line-strong: #4a4744;
  --crimson-text: #ef4b62;
  --shadow: 0 18px 50px rgba(0, 0, 0, 0.35);
}
/* Warm cream sections inside dark mode (Workshops, Fokhus & Mariella, Contact) */
html[data-theme="dark"] .bg-blush,
html[data-theme="dark"] .bg-sand,
html[data-theme="dark"] .force-light {
  color-scheme: light;
  --ink: #1f1e1d;
  --ink-2: #3a3634;
  --muted: #6e6862;
  --line: #e2d9cd;
  --line-strong: #d6cabb;
  --surface: #fffdf9;
  --surface-2: #faf6f0;
  --crimson-text: #a6192e;
  --shadow: 0 18px 50px rgba(31, 30, 29, 0.16);
  background: #f4efe7;
  color: var(--ink);
}
/* Charcoal sections */
html[data-theme="dark"] .bg-blush-2:not(.force-light),
html[data-theme="dark"] .bg-white { background: #262624; }

html[data-theme="dark"] body { background: var(--paper); color: var(--ink); }
html[data-theme="dark"] .eyebrow,
html[data-theme="dark"] .card-kicker,
html[data-theme="dark"] .pod-body .with,
html[data-theme="dark"] .world small,
html[data-theme="dark"] .text-link,
html[data-theme="dark"] .list-clean li::before,
html[data-theme="dark"] .faq summary::after,
html[data-theme="dark"] .trio strong,
html[data-theme="dark"] .form-success h3 { color: var(--crimson-text); }
html[data-theme="dark"] .card.featured .card-kicker { color: #ffd2d9; }
html[data-theme="dark"] .fit-box blockquote { color: #ff9fae; }

/* Header */
html[data-theme="dark"] .site-header.solid,
html[data-theme="dark"] .site-header.always-solid { background: rgba(31, 30, 29, 0.94); color: #f4efe7; box-shadow: 0 1px 0 #3e3c39; }
html[data-theme="dark"] .site-header.solid .nav-links a:hover,
html[data-theme="dark"] .site-header.always-solid .nav-links a:hover { color: #ef4b62; }
@media (max-width: 900px) {
  html[data-theme="dark"] .nav-links { background: #1f1e1d; color: #f4efe7; box-shadow: 0 20px 40px rgba(0,0,0,.45); }
  html[data-theme="dark"] .nav-open .site-header { background: #1f1e1d; color: #f4efe7; }
}

/* Buttons */
html[data-theme="dark"] .btn-ghost { color: var(--ink); border-color: var(--ink); }
html[data-theme="dark"] .btn-ghost:hover { background: var(--ink); color: var(--paper); }
html[data-theme="dark"] .bg-blush .btn-ghost:hover,
html[data-theme="dark"] .bg-sand .btn-ghost:hover { color: #f4efe7; }

/* Surfaces that were white in light mode */
html[data-theme="dark"] .card,
html[data-theme="dark"] .pod,
html[data-theme="dark"] .world a,
html[data-theme="dark"] .form-card,
html[data-theme="dark"] .chips-static li { background: var(--surface); border-color: var(--line); color: var(--ink); }
html[data-theme="dark"] .form-card { border-top: 6px solid var(--crimson); }
html[data-theme="dark"] .card.featured { background: var(--crimson); border-color: var(--crimson); color: #fff; }
html[data-theme="dark"] .fit-box { background: var(--surface); }
html[data-theme="dark"] .fit-box.not { background: transparent; border-color: var(--line-strong); }
html[data-theme="dark"] .world a:hover { border-color: var(--crimson); }

/* Form */
html[data-theme="dark"] input[type="text"],
html[data-theme="dark"] input[type="email"],
html[data-theme="dark"] input[type="tel"],
html[data-theme="dark"] input[type="date"],
html[data-theme="dark"] select,
html[data-theme="dark"] textarea { background: var(--surface-2); border-color: var(--line-strong); color: var(--ink); }
html[data-theme="dark"] input:focus,
html[data-theme="dark"] textarea:focus { border-color: var(--crimson-text); box-shadow: 0 0 0 4px rgba(239,75,98,.18); }
html[data-theme="dark"] .choice label { background: var(--surface-2); border-color: var(--line-strong); color: var(--ink); }
html[data-theme="dark"] .choice input:checked + label { background: var(--crimson); border-color: var(--crimson); color: #fff; }

/* Footer a step darker */
html[data-theme="dark"] .site-footer { background: #161514; }
@media (max-width: 760px) {
  html[data-theme="dark"] .sticky-cta { background: rgba(31,30,29,.97); box-shadow: 0 -8px 24px rgba(0,0,0,.4); }
}

/* ---------- Theme toggle (both modes) ---------- */
.theme-toggle {
  width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid currentColor; background: transparent; color: inherit;
  display: grid; place-items: center; cursor: pointer; opacity: .9; transition: background .2s, color .2s, opacity .2s; flex: none;
}
.theme-toggle:hover { opacity: 1; background: var(--crimson); border-color: var(--crimson); color: #fff; }
.theme-toggle svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.theme-toggle .i-sun { display: none; }
html[data-theme="dark"] .theme-toggle .i-sun { display: block; }
html[data-theme="dark"] .theme-toggle .i-moon { display: none; }
.nav { gap: 14px; }
.nav .brand { margin-right: auto; }
@media (max-width: 900px) { .nav .theme-toggle { width: 40px; height: 40px; } }
html[data-theme="dark"] .theme-transition, html[data-theme="dark"] .theme-transition * { transition: background-color .3s ease, color .3s ease, border-color .3s ease !important; }
.nav .nav-links { order: 2; } .nav .theme-toggle { order: 3; } .nav .menu-toggle { order: 4; }
html[data-theme="dark"] .hero .eyebrow { color: #fff; }