document.addEventListener('DOMContentLoaded', function () {
  /** 月のスライド **/
  new Splide('.fas-splide01', {
    type: 'fade',
    rewind: true,
    autoplay: true,
    interval: 5000,
    arrows: true,
    pagination: true,
    speed: 1000,
    pauseOnHover: false,
  }).mount();

  new Splide('.fas-splide02', {
    type: 'fade',
    rewind: true,
    autoplay: true,
    interval: 5000,
    arrows: true,
    pagination: true,
    speed: 1000,
    pauseOnHover: false,
  }).mount();

  /** 切り替え用 **/
  const buttons = document.querySelectorAll('.meal-button');
  const panels = document.querySelectorAll('.meal-menu');

  buttons.forEach(button => {
    button.addEventListener('click', () => {
      const target = button.dataset.target;

      buttons.forEach(btn => btn.classList.remove('active'));
      button.classList.add('active');

      panels.forEach(panel => {
        panel.classList.toggle('show', panel.dataset.content === target);
      });
    });
  });
});