/**
 * Services page — tier detail modal (Portal 9).
 */
(function () {
  var modalEl = document.getElementById("tierDetailsModal");
  if (!modalEl || typeof bootstrap === "undefined") {
    return;
  }

  // Keep modal as a direct body child so it stacks above the backdrop.
  if (modalEl.parentElement !== document.body) {
    document.body.appendChild(modalEl);
  }

  var modal = bootstrap.Modal.getOrCreateInstance(modalEl, {
    backdrop: true,
    keyboard: true,
    focus: true,
  });

  var titleEl = document.getElementById("tierDetailsModalLabel");
  var ctaEl = document.getElementById("tierDetailsModalCta");
  var panels = modalEl.querySelectorAll(".mkt-tier-detail-panel");
  var contactHref = ctaEl ? ctaEl.getAttribute("href") : "";

  function showPanel(tierKey, tierName, ctaLabel, ctaClass) {
    panels.forEach(function (panel) {
      panel.hidden = panel.id !== "tier-detail-" + tierKey;
    });
    if (titleEl && tierName) {
      titleEl.textContent = tierName;
    }
    if (ctaEl) {
      ctaEl.textContent = ctaLabel || "Book a Strategy Call";
      ctaEl.className = "btn btn-lg " + (ctaClass || "btn-primary");
      if (contactHref) {
        ctaEl.setAttribute("href", contactHref);
      }
    }
  }

  function readTrigger(trigger) {
    return {
      tierKey: trigger.getAttribute("data-tier-details"),
      tierName: trigger.getAttribute("data-tier-name"),
      ctaLabel: trigger.getAttribute("data-tier-cta"),
      ctaClass: trigger.getAttribute("data-tier-cta-class"),
    };
  }

  function cleanupModalState() {
    document.body.classList.remove("modal-open");
    document.body.style.removeProperty("overflow");
    document.body.style.removeProperty("padding-right");
    document.querySelectorAll(".modal-backdrop").forEach(function (backdrop) {
      backdrop.remove();
    });
  }

  document.querySelectorAll("[data-tier-details]").forEach(function (trigger) {
    trigger.addEventListener("click", function () {
      var data = readTrigger(trigger);
      showPanel(data.tierKey, data.tierName, data.ctaLabel, data.ctaClass);
    });
  });

  modalEl.addEventListener("show.bs.modal", function (event) {
    var trigger = event.relatedTarget;
    if (!trigger || !trigger.hasAttribute("data-tier-details")) {
      return;
    }
    var data = readTrigger(trigger);
    showPanel(data.tierKey, data.tierName, data.ctaLabel, data.ctaClass);
  });

  modalEl.addEventListener("hidden.bs.modal", cleanupModalState);
})();