/* ============================================================
   鮨 SORA · interações
   ============================================================ */
(function () {
  "use strict";

  const root = document.documentElement;
  const prefersReduced = matchMedia("(prefers-reduced-motion: reduce)").matches;

  /* ---------- Intro: enso brush, then split panels ---------- */
  const intro = document.getElementById("intro");

  function endIntro() {
    if (intro) intro.classList.add("is-done");
    document.body.classList.remove("is-loading");
    // remove from the flow once the panels have slid away
    setTimeout(() => intro && intro.remove(), 1200);
  }

  window.addEventListener("load", () => {
    setTimeout(endIntro, prefersReduced ? 0 : 2900);
  });

  /* ---------- Theme toggle (persisted) ---------- */
  const toggle = document.getElementById("themeToggle");
  const label = toggle ? toggle.querySelector(".theme-toggle__label") : null;

  function syncLabel() {
    if (!label) return;
    const dark = root.getAttribute("data-theme") === "dark";
    label.textContent = dark ? label.dataset.dark : label.dataset.light;
  }
  syncLabel();

  if (toggle) {
    toggle.addEventListener("click", () => {
      const next = root.getAttribute("data-theme") === "dark" ? "light" : "dark";
      root.setAttribute("data-theme", next);
      try { localStorage.setItem("sora-theme", next); } catch (e) {}
      syncLabel();
    });
  }

  /* ---------- Topbar state on scroll ---------- */
  const topbar = document.getElementById("topbar");
  const onScroll = () => topbar.classList.toggle("is-scrolled", window.scrollY > 30);
  onScroll();
  window.addEventListener("scroll", onScroll, { passive: true });

  /* ---------- Reveal courses on scroll ---------- */
  const items = document.querySelectorAll(".course, .item");
  items.forEach((el) => el.classList.add("reveal"));

  if ("IntersectionObserver" in window && !prefersReduced) {
    const io = new IntersectionObserver((entries, obs) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          entry.target.classList.add("is-visible");
          obs.unobserve(entry.target);
        }
      });
    }, { threshold: 0.12, rootMargin: "0px 0px -6% 0px" });
    items.forEach((el) => io.observe(el));
  } else {
    items.forEach((el) => el.classList.add("is-visible"));
  }

  /* ---------- Active section in nav ---------- */
  const links = document.querySelectorAll(".menu-nav a");
  const sections = document.querySelectorAll("main section[id]");

  if ("IntersectionObserver" in window && links.length) {
    const spy = new IntersectionObserver((entries) => {
      entries.forEach((entry) => {
        if (entry.isIntersecting) {
          links.forEach((a) =>
            a.style.setProperty(
              "color",
              a.getAttribute("href") === "#" + entry.target.id ? "var(--red)" : ""
            )
          );
        }
      });
    }, { rootMargin: "-45% 0px -50% 0px" });
    sections.forEach((s) => spy.observe(s));
  }
})();
