(function () {
  "use strict";

  var reduce = window.matchMedia("(prefers-reduced-motion: reduce)").matches;

  function collapse(panel) {
    if (reduce) { panel.hidden = true; return; }
    var h = panel.scrollHeight;
    panel.style.height = h + "px";
    // force reflow so the transition runs
    panel.offsetHeight; // eslint-disable-line no-unused-expressions
    panel.style.height = "0px";
    panel.addEventListener("transitionend", function done() {
      panel.hidden = true;
      panel.style.height = "";
      panel.removeEventListener("transitionend", done);
    });
  }

  function expand(panel) {
    panel.hidden = false;
    if (reduce) return;
    var h = panel.scrollHeight;
    panel.style.height = "0px";
    panel.offsetHeight; // reflow
    panel.style.height = h + "px";
    panel.addEventListener("transitionend", function done() {
      panel.style.height = "";
      panel.removeEventListener("transitionend", done);
    });
  }

  document.querySelectorAll("[data-topic]").forEach(function (item) {
    var head = item.querySelector(".topic__head");
    var panel = item.querySelector(".topic__panel");
    if (!head || !panel) return;

    // enable CSS height transition
    panel.style.transition = "height .42s cubic-bezier(.22,.61,.36,1)";
    panel.style.overflow = "hidden";

    head.addEventListener("click", function () {
      var open = item.classList.toggle("is-open");
      head.setAttribute("aria-expanded", open ? "true" : "false");
      if (open) { expand(panel); } else { collapse(panel); }
    });
  });
})();