document.addEventListener('DOMContentLoaded', () => {
	const accordionButtons = document.querySelectorAll('.wp-block-accordion-heading__toggle');

	// ここで設定した秒数が反映されます
	const openSpeed = 600;   // 開くスピード（400ms = 0.4秒）
	const closeSpeed = 150;  // 閉じるスピード（150ms = 0.15秒）

	accordionButtons.forEach(button => {
		button.addEventListener('click', (e) => {
			// WordPressコアのJSが動くのをブロックする
			e.preventDefault();
			e.stopImmediatePropagation();

			const item = button.closest('.wp-block-accordion-item');
			const panel = item ? item.querySelector('.wp-block-accordion-panel') : null;

			if (!item || !panel) return;

			// 現在開いているかどうかの判定
			const isOpen = item.classList.contains('is-open');

			// アニメーション中のガタつきを防ぐ基本処理
			panel.style.setProperty('display', 'block', 'important');
			panel.style.overflow = 'hidden';
			const contentHeight = panel.scrollHeight;

			if (!isOpen) {
				// 【開くアニメーション】
				item.classList.add('is-open'); // 親にクラスをつけて外見をオープン状態に
				button.setAttribute('aria-expanded', 'true');
				panel.removeAttribute('inert');

				panel.animate([
					{ height: '0px', opacity: 0 },
					{ height: contentHeight + 'px', opacity: 1 }
				], {
					duration: openSpeed,
					easing: 'cubic-bezier(0.25, 1, 0.5, 1)',
					fill: 'forwards'
				});

				setTimeout(() => {
					panel.style.height = 'auto';
					panel.style.opacity = '1';
				}, openSpeed);

			} else {
				// 【閉じるアニメーション】
				item.classList.remove('is-open');
				button.setAttribute('aria-expanded', 'false');
				panel.setAttribute('inert', '');

				const currentHeight = panel.offsetHeight;

				const closingAnim = panel.animate([
					{ height: currentHeight + 'px', opacity: 1 },
					{ height: '0px', opacity: 0 }
				], {
					duration: closeSpeed,
					easing: 'ease-in',
					fill: 'forwards'
				});

				closingAnim.onfinish = () => {
					panel.style.removeProperty('display');
					panel.style.height = '';
					panel.style.opacity = '';
					panel.getAnimations().forEach(anim => anim.cancel());
				};
			}
		}, { capture: true }); // コアのJSより「先」にクリックに反応させる設定
	});
});