$(function () {
  if ($(".js-modal-video").length) {
    $(".js-modal-video").modalVideo({
      channel: "youtube",
      youtube: { controls: 1 },
    });
  }
});

// アコーディオン
const accordionTargets = ['.qaItem', '.guidanceItem', '.guidanceFaq'];

accordionTargets.forEach(selector => {
  const items = document.querySelectorAll(selector);
  if (!items.length) return;

  items.forEach(item => {
    const button = item.querySelector('.qaQuestion, .guidanceItemButton, .guidanceFaqButton');
    const answer = item.querySelector('.qaAnswer, .guidanceItemAnswer, .guidanceFaqAnswer');
    if (!button || !answer) return;

    if (item.classList.contains('active')) {
      answer.style.height = answer.scrollHeight + 'px';
    }

    button.addEventListener('click', () => {
      if (item.classList.contains('active')) {
        answer.style.height = answer.scrollHeight + 'px';
        requestAnimationFrame(() => {
          answer.style.height = '0px';
        });
        item.classList.remove('active');
      } else {
        item.classList.add('active');
        answer.style.height = answer.scrollHeight + 'px';

        answer.addEventListener('transitionend', () => {
          if (item.classList.contains('active')) {
            answer.style.height = 'auto';
          }
        }, { once: true });
      }
    });
  });
});

// SP/PC 切り替え
const hoverMenuApp = document.getElementById('hoverMenuApp');
let currentMode = '';

function render() {
  if (!hoverMenuApp) return;

  const isMobile = window.innerWidth < 960;
  const nextMode = isMobile ? 'sp' : 'pc';
  if (currentMode === nextMode) return;

  currentMode = nextMode;
  const template = document.getElementById(isMobile ? 'hoverMenuSp' : 'hoverMenuPc');
  if (!template) return;

  hoverMenuApp.innerHTML = '';
  hoverMenuApp.appendChild(template.content.cloneNode(true));
}
render();
window.addEventListener('resize', render);

// タブ切り替え
const tabs = document.querySelectorAll('.js-tab');
const panels = document.querySelectorAll('.js-panel');

if (tabs.length && panels.length) {
  let current = panels[0].dataset.panel;

  tabs[0].classList.add('is-active');
  panels[0].classList.add('is-active');

  tabs.forEach(tab => {
    tab.addEventListener('click', () => {
      const target = tab.dataset.tab;
      if (target === current) return;

      current = target;

      tabs.forEach(t => t.classList.remove('is-active'));
      tab.classList.add('is-active');

      panels.forEach(panel => {
        panel.classList.toggle('is-active', panel.dataset.panel === target);
      });
    });
  });
}

// IntersectionObserver
const targets = document.querySelectorAll('.headerTitleLogo');
if (targets.length) {
  const observer = new IntersectionObserver(entries => {
    entries.forEach(entry => {
      if (entry.isIntersecting) {
        setTimeout(() => entry.target.classList.add('is-show'), 500);
        observer.unobserve(entry.target);
      }
    });
  });

  targets.forEach(target => observer.observe(target));
}

// スクロール表示
const fixedMenu = document.querySelector('#footerFixed');
if (fixedMenu) {
  window.addEventListener('scroll', () => {
    const scrollY = window.scrollY;
    const docHeight = document.documentElement.scrollHeight;
    const winHeight = window.innerHeight;
    const distanceFromBottom = docHeight - (scrollY + winHeight);

    fixedMenu.classList.toggle(
      'is-show',
      scrollY >= 400 && distanceFromBottom >= 300
    );
  });
}

// モーダル
const menuBtn = document.querySelector('.menuBtn');
const modal = document.querySelector('.modalMenu');
const overlay = document.querySelector('.modalOverlay');

if (menuBtn && modal && overlay) {
  menuBtn.addEventListener('click', () => {
    menuBtn.classList.toggle('is-active');
    modal.classList.toggle('is-active');
    overlay.classList.toggle('is-active');
  });

  overlay.addEventListener('click', () => {
    menuBtn.classList.remove('is-active');
    modal.classList.remove('is-active');
    overlay.classList.remove('is-active');
  });
}