document.addEventListener('DOMContentLoaded', function() {
    const contactForm = document.getElementById('contact-form');
    const formMessages = document.getElementById('form-messages');

    if (contactForm) {
        contactForm.addEventListener('submit', function(e) {
            e.preventDefault();

            const formData = new FormData(contactForm);

            fetch('handle_contact.php', {
                method: 'POST',
                body: formData
            })
            .then(response => response.json())
            .then(data => {
                if (data.success) {
                    formMessages.innerHTML = `<div class="success">${data.message}</div>`;
                    contactForm.reset();
                } else {
                    formMessages.innerHTML = `<div class="error">${data.message}</div>`;
                }
            })
            .catch(error => {
                formMessages.innerHTML = `<div class="error">An error occurred while sending your message. Please try again.</div>`;
                console.error('Error:', error);
            });
        });
    }
});