(() => {
  const { EventManager } = ShopbySkin;

  // 커스텀 팝업으로 이관할 popupId 목록 (design-popup에서 제외)
  // custom-popup.js의 CUSTOM_POPUP_IDS와 동일하게 유지해야 함
  const CUSTOM_POPUP_IDS = ['BIG-POP-PC'];

  const designPopup = document.querySelector('design-popup');

  // 로컬스토리지 유틸리티 (만료일 지원)
  const storageUtils = {
    // 데이터 저장 (만료일 포함)
    set: (key, value, expiryDays = 1) => {
      const now = new Date();
      const item = {
        value: value,
        expiry: now.getTime() + expiryDays * 24 * 60 * 60 * 1000, // 밀리초로 변환
      };
      localStorage.setItem(key, JSON.stringify(item));
    },

    // 데이터 가져오기 (만료 확인)
    get: (key) => {
      const itemStr = localStorage.getItem(key);
      if (!itemStr) return null;

      try {
        const item = JSON.parse(itemStr);
        const now = new Date();

        // 만료 확인
        if (now.getTime() > item.expiry) {
          localStorage.removeItem(key);
          return null;
        }

        return item.value;
      } catch (e) {
        return null;
      }
    },

    // 데이터 존재 확인
    has: (key) => {
      return storageUtils.get(key) !== null;
    },

    // 데이터 삭제
    remove: (key) => {
      localStorage.removeItem(key);
    },
  };

  // 팝업 닫기 함수 (일반 + 멀티 팝업 모두 지원)
  const closePopup = (popupNo) => {
    const popupItem =
      document.querySelector(`.popup-item[data-popup-no="${popupNo}"]`) ||
      document.querySelector(`.popup-item-multi[data-popup-no="${popupNo}"]`);

    if (popupItem) {
      popupItem.style.display = 'none';
      checkAllPopupsClosed();
    }
  };

  // 오늘 하루 안보기 함수 (일반 + 멀티 팝업 모두 지원)
  const hidePopupToday = (popupNo) => {
    storageUtils.set(`popup_hidden_${popupNo}`, 'true', 1);

    const popupItem =
      document.querySelector(`.popup-item[data-popup-no="${popupNo}"]`) ||
      document.querySelector(`.popup-item-multi[data-popup-no="${popupNo}"]`);

    if (popupItem) {
      popupItem.style.display = 'none';
    }

    checkAllPopupsClosed();
  };

  // 모든 팝업이 닫혔는지 확인 (일반 + 멀티 팝업 모두 체크)
  const checkAllPopupsClosed = () => {
    const allPopups = document.querySelectorAll('.popup-item, .popup-item-multi');
    const visiblePopups = Array.from(allPopups).filter((popup) => popup.style.display !== 'none');

    if (visiblePopups.length === 0) {
      const container = document.querySelector('.popup-slider-container');
      if (container) {
        container.style.display = 'none';
      }
    }
  };

  // 이벤트 리스너 등록
  const initPopupEvents = () => {
    // 이벤트 위임 방식으로 클릭 이벤트 처리
    document.addEventListener('click', (e) => {
      // 닫기 버튼
      if (e.target.classList.contains('close-popup-btn')) {
        const popupNo = e.target.getAttribute('data-popup-no');
        closePopup(popupNo);
      }

      // 오늘 하루 안보기 버튼
      if (e.target.classList.contains('no-show-today-btn')) {
        const popupNo = e.target.getAttribute('data-popup-no');
        hidePopupToday(popupNo);
      }
    });
  };

  // 멀티팝업 Swiper 인스턴스 저장
  const multiPopupSwipers = new Map();

  // 멀티팝업 Swiper 초기화
  const initMultiPopupSwipers = () => {
    const swiperContainers = document.querySelectorAll('.popup-main-swiper');

    swiperContainers.forEach((container) => {
      const popupItem = container.closest('.popup-item-multi');
      if (!popupItem) return;

      const popupNo = popupItem.getAttribute('data-popup-no');

      // Swiper 초기화
      const swiper = new Swiper(container, {
        loop: false,
        slidesPerView: 1,
        spaceBetween: 0,
        observer: true,
        observeParents: true,
        autoplay: {
          delay: 2500,
          disableOnInteraction: true,
        },
        on: {
          slideChange: function () {
            // 슬라이드 변경 시 썸네일 활성화 상태 업데이트 (loop 모드에서는 realIndex 사용)
            updateThumbActive(popupItem, this.activeIndex);
          },
        },
      });

      // 강제로 Swiper 업데이트
      setTimeout(() => {
        swiper.update();
      }, 100);

      // 인스턴스 저장
      multiPopupSwipers.set(popupNo, swiper);

      // 첫 번째 썸네일 활성화
      updateThumbActive(popupItem, 0);
    });
  };

  // 썸네일 활성화 상태 업데이트
  const updateThumbActive = (popupItem, activeIndex) => {
    const thumbs = popupItem.querySelectorAll('.popup-thumb-item');
    thumbs.forEach((thumb, index) => {
      if (index === activeIndex) {
        thumb.style.outline = '2px solid #000';
        thumb.style.outlineOffset = '-1px';
      } else {
        thumb.style.outline = 'none';
      }
    });
  };

  // 썸네일 클릭 이벤트
  const initThumbClickEvents = () => {
    document.addEventListener('click', (e) => {
      const thumbItem = e.target.closest('.popup-thumb-item');
      if (!thumbItem) return;

      const slideIndex = parseInt(thumbItem.getAttribute('data-slide-index'), 10);
      const popupItem = thumbItem.closest('.popup-item-multi');
      if (!popupItem) return;

      const popupNo = popupItem.getAttribute('data-popup-no');
      const swiper = multiPopupSwipers.get(popupNo);

      if (swiper) {
        swiper.slideTo(slideIndex);
      }
    });
  };

  EventManager.on('PAGE_LOAD_COMPLETED', () => {
    const popupData = designPopup.store.state;

    // 이벤트 리스너 등록
    initPopupEvents();

    // 멀티팝업 Swiper 초기화
    initMultiPopupSwipers();

    // 썸네일 클릭 이벤트 등록
    initThumbClickEvents();

    // 일반 + 멀티 팝업 모두 가져오기
    const allPopups = document.querySelectorAll('.popup-item, .popup-item-multi');

    // 커스텀 팝업으로 이관된 popupId 목록에서 popupNo 해석
    // designPopup.store.state.popups 에서 팝업 데이터 활용
    const popupSource = popupData?.popups || [];
    const customPopupNos = popupSource
      .filter((popup) => popup.popupId && CUSTOM_POPUP_IDS.includes(popup.popupId))
      .map((popup) => String(popup.popupNo));

    // 커스텀 팝업으로 이관된 팝업 숨기기
    allPopups.forEach((popup) => {
      const popupNo = popup.getAttribute('data-popup-no');
      if (customPopupNos.includes(popupNo)) {
        popup.style.display = 'none';
      }
    });

    // 로컬스토리지에 저장된 팝업 숨기기
    allPopups.forEach((popup) => {
      const popupNo = popup.getAttribute('data-popup-no');
      if (storageUtils.has(`popup_hidden_${popupNo}`)) {
        popup.style.display = 'none';
      }
    });

    // 모든 팝업이 숨겨졌는지 확인
    checkAllPopupsClosed();
  });
})();