// Mobile menu functionality
function toggleMobileMenu(): void {
    const mobileMenu = document.getElementById('mobileMenu');
    if (mobileMenu) {
        mobileMenu.classList.toggle('active');
    }
}

// Form submission handler
function handleSubmit(event: Event): void {
    event.preventDefault();

    const form = event.target as HTMLFormElement;
    const formData = new FormData(form);

    // Get form values
    const name = formData.get('name') as string;
    const email = formData.get('email') as string;

    // Simple validation
    if (!name || !email) {
        alert('Please fill in required fields (Name and Email)');
        return;
    }

    // Show success message
    alert('Thank you for your interest! We will contact you within 24 hours.');

    // Reset form
    form.reset();
}

// Smooth scrolling for navigation links
function initSmoothScrolling(): void {
    const navLinks = document.querySelectorAll('a[href^="#"]');

    navLinks.forEach(link => {
        link.addEventListener('click', (e) => {
            e.preventDefault();

            const targetId = link.getAttribute('href')?.substring(1);
            const targetElement = document.getElementById(targetId || '');

            if (targetElement) {
                const headerHeight = 64; // Height of sticky header
                const targetPosition = targetElement.offsetTop - headerHeight;

                window.scrollTo({
                    top: targetPosition,
                    behavior: 'smooth'
                });

                // Close mobile menu if open
                const mobileMenu = document.getElementById('mobileMenu');
                if (mobileMenu) {
                    mobileMenu.classList.remove('active');
                }
            }
        });
    });
}

// Intersection Observer for animations
function initScrollAnimations(): void {
    const observerOptions = {
        threshold: 0.1,
        rootMargin: '0px 0px -50px 0px'
    };

    const observer = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                entry.target.classList.add('animate-in');
            }
        });
    }, observerOptions);

    // Observe service cards for animation
    const serviceCards = document.querySelectorAll('.service-card');
    serviceCards.forEach(card => observer.observe(card));

    // Observe stat items
    const statItems = document.querySelectorAll('.stat-item');
    statItems.forEach(item => observer.observe(item));
}

// Close mobile menu when clicking outside
function initMobileMenuClose(): void {
    document.addEventListener('click', (event) => {
        const mobileMenu = document.getElementById('mobileMenu');
        const menuButton = document.querySelector('.mobile-menu-btn');

        if (mobileMenu &&
            !mobileMenu.contains(event.target as Node) &&
            !menuButton?.contains(event.target as Node)) {
            mobileMenu.classList.remove('active');
        }
    });
}

// Header scroll effect
function initHeaderScroll(): void {
    const header = document.querySelector('.header') as HTMLElement;

    window.addEventListener('scroll', () => {
        if (window.scrollY > 50) {
            header.style.background = 'rgba(255, 255, 255, 0.95)';
            header.style.boxShadow = '0 4px 6px rgba(0, 0, 0, 0.1)';
        } else {
            header.style.background = 'rgba(255, 255, 255, 0.9)';
            header.style.boxShadow = 'none';
        }
    });
}

// Image lazy loading
function initLazyLoading(): void {
    const images = document.querySelectorAll('img[data-src]');

    const imageObserver = new IntersectionObserver((entries) => {
        entries.forEach(entry => {
            if (entry.isIntersecting) {
                const img = entry.target as HTMLImageElement;
                img.src = img.dataset.src || '';
                img.classList.remove('lazy');
                imageObserver.unobserve(img);
            }
        });
    });

    images.forEach(img => imageObserver.observe(img));
}

// Initialize all functionality when DOM is loaded
document.addEventListener('DOMContentLoaded', () => {
    initSmoothScrolling();
    initScrollAnimations();
    initMobileMenuClose();
    initHeaderScroll();
    initLazyLoading();

    // Add loading class removal for better UX
    document.body.classList.add('loaded');
});

// Export functions for global access
(window as any).toggleMobileMenu = toggleMobileMenu;
(window as any).handleSubmit = handleSubmit;