document.addEventListener('DOMContentLoaded', () => {
    const mainImage = document.querySelector('#main-product-image');
    document.querySelectorAll('[data-gallery-image]').forEach((button) => {
        button.addEventListener('click', () => {
            if (!mainImage) return;
            document.querySelectorAll('[data-gallery-image]').forEach((item) => item.classList.remove('active'));
            button.classList.add('active');
            mainImage.style.opacity = '0.35';
            const nextImage = new Image();
            nextImage.onload = () => {
                mainImage.src = button.dataset.galleryImage;
                mainImage.style.opacity = '1';
            };
            nextImage.src = button.dataset.galleryImage;
        });
    });

    const buyButton = document.querySelector('#buy-button');
    const buyPrice = document.querySelector('#buy-price');
    const formatTry = (value) => new Intl.NumberFormat('tr-TR', {
        style: 'currency', currency: 'TRY', maximumFractionDigits: 0,
    }).format(Number(value));

    document.querySelectorAll('.package-card').forEach((card) => {
        card.addEventListener('click', () => {
            document.querySelectorAll('.package-card').forEach((item) => {
                item.classList.remove('selected');
                item.setAttribute('aria-checked', 'false');
            });
            card.classList.add('selected');
            card.setAttribute('aria-checked', 'true');
            if (buyPrice) buyPrice.textContent = formatTry(card.dataset.price);
            if (buyButton) buyButton.href = `checkout.php?quantity=${card.dataset.quantity}`;
        });
    });

    document.querySelectorAll('[data-copy]').forEach((button) => {
        button.addEventListener('click', async () => {
            const target = document.querySelector(button.dataset.copy);
            if (!target) return;
            const text = target.textContent.trim();
            try {
                await navigator.clipboard.writeText(text);
            } catch (_) {
                const area = document.createElement('textarea');
                area.value = text;
                document.body.appendChild(area);
                area.select();
                document.execCommand('copy');
                area.remove();
            }
            const old = button.innerHTML;
            button.innerHTML = '<i class="bi bi-check2"></i> Kopyalandı';
            setTimeout(() => { button.innerHTML = old; }, 1800);
        });
    });

    const uploadInput = document.querySelector('#receipt');
    const fileName = document.querySelector('#file-name');
    const uploadBox = document.querySelector('.upload-box');
    if (uploadInput && fileName) {
        uploadInput.addEventListener('change', () => {
            fileName.textContent = uploadInput.files?.[0]?.name || '';
        });
    }
    if (uploadBox) {
        ['dragenter', 'dragover'].forEach((eventName) => uploadBox.addEventListener(eventName, () => uploadBox.classList.add('dragover')));
        ['dragleave', 'drop'].forEach((eventName) => uploadBox.addEventListener(eventName, () => uploadBox.classList.remove('dragover')));
    }

    document.querySelectorAll('form[data-loading]').forEach((form) => {
        form.addEventListener('submit', () => {
            const button = form.querySelector('button[type="submit"]');
            if (!button) return;
            button.disabled = true;
            button.dataset.oldText = button.innerHTML;
            button.innerHTML = '<i class="bi bi-arrow-repeat"></i> İşleniyor…';
        });
    });
});
