document.addEventListener('DOMContentLoaded', function () {
    const contactForm = document.getElementById('contactForm');
    const contactToast = new bootstrap.Toast(document.getElementById('contactToast'));
    const toastBody = document.querySelector('#contactToast .toast-body');

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

        if (!contactForm.checkValidity()) {
            contactForm.classList.add('was-validated');
            return;
        }

        const formData = new FormData(contactForm);
        const submitButton = contactForm.querySelector('button[type="submit"]');
        const originalButtonText = submitButton.innerHTML;
        submitButton.disabled = true;
        submitButton.innerHTML = `<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span> Sending...`;

        fetch('contact.php', {
            method: 'POST',
            body: formData
        })
        .then(response => response.json())
        .then(data => {
            if (data.success) {
                toastBody.textContent = 'Your message has been sent successfully!';
                contactForm.reset();
                contactForm.classList.remove('was-validated');
            } else {
                toastBody.textContent = 'An error occurred: ' + (data.error || 'Please try again.');
            }
            contactToast.show();
        })
        .catch(error => {
            toastBody.textContent = 'A network error occurred. Please try again.';
            contactToast.show();
        })
        .finally(() => {
            submitButton.disabled = false;
            submitButton.innerHTML = originalButtonText;
        });
    });
});