document.addEventListener('DOMContentLoaded', function() {
    const form = document.getElementById('quizForm');
    if (!form) return;

    let currentStep = 1;
    const scriptURL = 'https://script.google.com/macros/s/AKfycbzjzemGBQoVbXW69Z_pkhDQqrBWTHGDuWoKLLoedbx7hsMQwwpiY693stUxr7c_l2z6sQ/exec';
    const nextBtn = document.getElementById('nextBtn');
    const prevBtn = document.getElementById('prevBtn');
    const submitBtn = document.getElementById('submitBtn');

    nextBtn.addEventListener('click', function() {
        if (validateStep(currentStep)) {
            if (currentStep < totalSteps) {
                hideStep(currentStep);
                currentStep++;
                showStep(currentStep);
                updateProgress();
                updateButtons();
                window.scrollTo(0, 0);
            }
        }
    });

    prevBtn.addEventListener('click', function() {
        if (currentStep > 1) {
            hideStep(currentStep);
            currentStep--;
            showStep(currentStep);
            updateProgress();
            updateButtons();
            window.scrollTo(0, 0);
        }
    });

    form.addEventListener('submit', function(e) {
        e.preventDefault();
        submitQuiz();
    });

    function showStep(stepNum) {
        const step = document.getElementById(`step-${stepNum}`);
        if (step) step.style.display = 'block';
    }

    function hideStep(stepNum) {
        const step = document.getElementById(`step-${stepNum}`);
        if (step) step.style.display = 'none';
    }

    function updateProgress() {
        const percentage = (currentStep / totalSteps) * 100;
        document.getElementById('progressFill').style.width = percentage + '%';
        document.getElementById('stepNumber').textContent = currentStep;
    }

    function updateButtons() {
        prevBtn.style.display = currentStep > 1 ? 'inline-block' : 'none';
        if (currentStep === totalSteps) {
            nextBtn.style.display = 'none';
            submitBtn.style.display = 'inline-block';
        } else {
            nextBtn.style.display = 'inline-block';
            submitBtn.style.display = 'none';
        }
    }

    function validateStep(stepNum) {
        const step = document.getElementById(`step-${stepNum}`);
        if (!step) return true;

        const inputs = step.querySelectorAll('input[required]');
        let isValid = true;

        inputs.forEach(input => {
            if (input.type === 'text' || input.type === 'email' || input.type === 'tel') {
                if (!input.value.trim()) {
                    input.style.borderColor = '#E74C3C';
                    isValid = false;
                } else {
                    input.style.borderColor = '';
                }
            } else if (input.type === 'radio') {
                const radioGroup = step.querySelectorAll(`input[name="${input.name}"]`);
                const isChecked = Array.from(radioGroup).some(radio => radio.checked);
                if (!isChecked) {
                    isValid = false;
                }
            }
        });

        if (stepNum === 2) {
            const checkboxes = step.querySelectorAll('input[type="checkbox"]');
            const noPreference = Array.from(checkboxes).find(cb => cb.value === 'No preference' && cb.checked);
            const anySelected = Array.from(checkboxes).some(cb => cb.value !== 'No preference' && cb.checked);
            
            if (!noPreference && !anySelected) {
                isValid = false;
                alert('Please select at least one location or select "No preference"');
            }
        }

        return isValid;
    }

    function submitQuiz() {
        if (!validateStep(totalSteps)) {
            alert('Please complete all required fields');
            return;
        }

        const formData = new FormData(form);
        const data = {
            fullName: formData.get('fullName'),
            email: formData.get('email'),
            phone: formData.get('phone'),
            ageGroup: formData.get('ageGroup'),
            budget: formData.get('budget'),
            timeline: formData.get('timeline'),
            locations: formData.getAll('location'),
            amenities: formData.getAll('amenities')
        };

        submitBtn.disabled = true;
        submitBtn.textContent = 'Generating your report...';

        fetch(scriptURL, {
            method: 'POST',
            body: JSON.stringify(data),
            headers: {
                'Content-Type': 'application/json'
            }
        })
        .then(response => response.json())
        .then(result => {
            if (result.success) {
                alert('Thank you! Your information has been received. We\'ll be in touch shortly.');
                window.location.href = 'index.html';
            } else {
                alert('There was an error. Please try again.');
                submitBtn.disabled = false;
                submitBtn.textContent = 'Get My Report';
            }
        })
        .catch(error => {
            console.error('Error:', error);
            alert('There was an error submitting your quiz.');
            submitBtn.disabled = false;
            submitBtn.textContent = 'Get My Report';
        });
    }

    updateProgress();
    updateButtons();
});