document.addEventListener('DOMContentLoaded', function() {
    // Mobile menu toggle
    const hamburger = document.querySelector('.hamburger');
    const navLinks = document.querySelector('.nav-links');
    
    hamburger.addEventListener('click', function() {
        this.classList.toggle('active');
        navLinks.classList.toggle('active');
    });

    // Close menu when clicking a link (mobile)
    document.querySelectorAll('.nav-links a').forEach(link => {
        link.addEventListener('click', () => {
            hamburger.classList.remove('active');
            navLinks.classList.remove('active');
        });
    });

    // Smooth scrolling for anchor links
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function(e) {
            e.preventDefault();
            
            const targetId = this.getAttribute('href');
            if (targetId === '#') return;
            
            const targetElement = document.querySelector(targetId);
            if (targetElement) {
                window.scrollTo({
                    top: targetElement.offsetTop - 80, // Adjusted for fixed header
                    behavior: 'smooth'
                });
            }
        });
    });
});

document.addEventListener('DOMContentLoaded', function() {
    const serverCards = document.querySelectorAll('.server-card');
    const API_URL = '/api/check-port'; // Change in production
    
    async function checkServerStatus(card) {
        const ip = card.dataset.ip;
        const port = card.dataset.port;
        const statusElement = card.querySelector('.status');
        
        if (!ip || !port || !statusElement) return;
        
        statusElement.textContent = 'Checking...';
        statusElement.className = 'status unknown';
        
        try {
            const response = await fetch(`${API_URL}?host=${encodeURIComponent(ip)}&port=${port}`);
            const data = await response.json();
            
            statusElement.textContent = data.status.charAt(0).toUpperCase() + data.status.slice(1);
            statusElement.className = `status ${data.status}`;
        } catch (e) {
            statusElement.textContent = 'Error';
            statusElement.className = 'status unknown';
        }
    }
    
    // Initial check
    serverCards.forEach(checkServerStatus);
    
    // Click handler for manual refresh
    serverCards.forEach(card => {
        card.addEventListener('click', () => checkServerStatus(card));
    });
    
    // Periodic checks every 5 minutes
    setInterval(() => serverCards.forEach(checkServerStatus), 5 * 60 * 1000);
});