document.addEventListener("DOMContentLoaded", () => {
  const videoBlocks = document.querySelectorAll(".yt-cover-video[data-video-id]");
  if (!videoBlocks.length) return;

  // ===== Settings =====
  const DEFAULT_PARAMS = {
    enablejsapi: "1",
    rel: "0",
    playsinline: "1"
    // mute: "1", // Uncomment if you want autoplay muted
  };

  function buildEmbedSrc(videoId, extraParams = {}) {
    const params = new URLSearchParams({ ...DEFAULT_PARAMS, ...extraParams });
    return `https://www.youtube.com/embed/${encodeURIComponent(videoId)}?${params.toString()}`;
  }

  videoBlocks.forEach((block) => {
    const videoId = (block.dataset.videoId || "").trim();
    const iframe = block.querySelector(".yt-cover-video__iframe");
    const cover = block.querySelector(".yt-cover-video__cover");

    if (!videoId || !iframe || !cover) return;

    let isPlayed = false;

    // Ensure iframe has a clean base src (no autoplay) on load
    const baseSrc = buildEmbedSrc(videoId);
    iframe.setAttribute("src", baseSrc);
    iframe.setAttribute("allow", "autoplay; encrypted-media; picture-in-picture");

    function playVideo() {
      if (isPlayed) return;

      const playSrc = buildEmbedSrc(videoId, { autoplay: "1" });
      iframe.setAttribute("src", playSrc);

      cover.classList.add("is-hidden");
      isPlayed = true;
    }

    cover.addEventListener("click", playVideo);

    // Keyboard accessibility if you use role/button + tabindex
    cover.addEventListener("keydown", (event) => {
      if (event.key === "Enter" || event.key === " ") {
        event.preventDefault();
        playVideo();
      }
    });
  });
});