function toggleMenu() {
    const navLinks = document.querySelector('.nav-links');
    navLinks.classList.toggle('active');
}



let currentStep = 0;

function showStep(step) {
    const steps = document.querySelectorAll('.step');
    const indicators = document.querySelectorAll('.step-indicator div');
    steps.forEach(s => s.classList.remove('active'));
    indicators.forEach(i => i.classList.remove('active'));
    steps[step].classList.add('active');
    indicators[step].classList.add('active');
}

function nextStep() {
    if (validateStep(currentStep)) {
        currentStep++;
        if (currentStep >= document.querySelectorAll('.step').length) {
            currentStep = document.querySelectorAll('.step').length - 1;
        }
        showStep(currentStep);
         if (currentStep === 2) {
            reviewData();
        }
    }
}

function prevStep() {
    currentStep--;
    if (currentStep < 0) {
        currentStep = 0;
    }
    showStep(currentStep);
}

        function validateStep(step) {
            const inputs = document.querySelectorAll(`#step${step + 1} input, #step${step + 1} select`);
            for (let input of inputs) {
                if (!input.checkValidity()) {
                    input.reportValidity();
                    return false;
                }
            }
            return true;
        }

        function reviewData() {
            const fullName = document.getElementById('fullName').value;
            const email = document.getElementById('email').value;
            const phone = document.getElementById('phone').value;
            const gender = document.querySelector('input[name="gender"]:checked').value;
            const age = document.getElementById('age').value;
            const education = document.getElementById('education').value;
            const experience = document.getElementById('experience').value;
            const currentRole = document.getElementById('currentRole').value;

            const skills = Array.from(document.querySelectorAll('input[name="skills"]:checked')).map(el => el.value).join(', ');

            document.getElementById('review').innerHTML = `
                <p><strong>Full Name:</strong> ${fullName}</p>
                <p><strong>Email:</strong> ${email}</p>
                <p><strong>Phone:</strong> ${phone}</p>
                <p><strong>Gender:</strong> ${gender}</p>
                <p><strong>Age:</strong> ${age}</p>
                <p><strong>Education:</strong> ${education}</p>
                <p><strong>Skills:</strong> ${skills}</p>
                <p><strong>Experience:</strong> ${experience} years</p>
                <p><strong>Current Role:</strong> ${currentRole}</p>
            `;
        }

        function submitForm() {
            const data = {
                fullName: document.getElementById('fullName').value,
                email: document.getElementById('email').value,
                phone: document.getElementById('phone').value,
                gender: document.querySelector('input[name="gender"]:checked').value,
                age: document.getElementById('age').value,
                education: document.getElementById('education').value,
                skills: Array.from(document.querySelectorAll('input[name="skills"]:checked')).map(el => el.value),
                experience: document.getElementById('experience').value,
                currentRole: document.getElementById('currentRole').value
            };

            localStorage.setItem('formData', JSON.stringify(data));
            document.getElementById('multiStepForm').style.display = 'none';
            document.getElementById('successMessage').style.display = 'block';
        }

function exportData() {
    const data = localStorage.getItem('formData');
    const blob = new Blob([data], { type: 'application/json' });
    const url = URL.createObjectURL(blob);
    const a = document.createElement('a');
    a.href = url;
    a.download = 'formData.json';
    document.body.appendChild(a);
    a.click();
    document.body.removeChild(a);
}

        function clearForm() {
            document.getElementById('multiStepForm').reset();
            localStorage.removeItem('formData');
            currentStep = 0;
            showStep(currentStep);
            document.getElementById('successMessage').style.display = 'none';
        }

        // Initialize the form
        showStep(currentStep);