script.js

document.addEventListener('DOMContentLoaded', function() {
    // Theme toggle functionality
    const themeToggle = document.getElementById('themeToggle');
    const html = document.documentElement;
    
    // Check for saved theme preference or use system preference
    const savedTheme = localStorage.getItem('theme') || 
                      (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light');
    html.classList.add(savedTheme);
    
    themeToggle.addEventListener('click', () => {
        html.classList.toggle('dark');
        const theme = html.classList.contains('dark') ? 'dark' : 'light';
        localStorage.setItem('theme', theme);
        lucide.createIcons();
    });
    
    // Mobile menu toggle
    const menuToggle = document.getElementById('menuToggle');
    const sidebar = document.getElementById('sidebar');
    
    if (menuToggle && sidebar) {
        menuToggle.addEventListener('click', () => {
            sidebar.classList.toggle('-translate-x-full');
        });
    }
    
    // Handle responsive sidebar
    function handleResize() {
        if (window.innerWidth >= 1024 && sidebar) {
            sidebar.classList.remove('-translate-x-full');
        }
    }
    
    window.addEventListener('resize', handleResize);
    handleResize();
    
    // Update stats periodically with realistic data
    function updateStats() {
        const statsElements = document.querySelectorAll('.text-3xl.font-bold');
        statsElements.forEach((el, index) => {
            const currentValue = el.textContent.replace(/[$,%]/g, '').replace(/,/g, '');
            const isPercentage = el.textContent.includes('%');
            const isDollar = el.textContent.includes(');
            
            let change = 0;
            if (isPercentage) {
                change = (Math.random() * 0.5 - 0.25).toFixed(2);
                el.textContent = (parseFloat(currentValue) + parseFloat(change)).toFixed(2) + '%';
            } else if (isDollar) {
                change = Math.floor(Math.random() * 1000) - 500;
                el.textContent = ' + (parseInt(currentValue) + change).toLocaleString();
            } else {
                change = Math.floor(Math.random() * 100) - 50;
                el.textContent = (parseInt(currentValue) + change).toLocaleString();
            }
            
            // Add pulse animation
            el.classList.add('animate-pulse');
            setTimeout(() => el.classList.remove('animate-pulse'), 1000);
        });
    }
    
    // Update stats every 3 seconds
    setInterval(updateStats, 3000);
    
    // Add smooth scroll behavior
    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
        anchor.addEventListener('click', function (e) {
            e.preventDefault();
            const target = document.querySelector(this.getAttribute('href'));
            if (target) {
                target.scrollIntoView({ behavior: 'smooth', block: 'start' });
            }
        });
    });
    
    // Initialize tooltips
    const tooltipElements = document.querySelectorAll('[data-tooltip]');
    tooltipElements.forEach(element => {
        element.addEventListener('mouseenter', function() {
            const tooltip = document.createElement('div');
            tooltip.className = 'absolute z-50 px-2 py-1 text-xs text-white bg-gray-900 rounded shadow-lg';
            tooltip.textContent = this.getAttribute('data-tooltip');
            document.body.appendChild(tooltip);
            
            const rect = this.getBoundingClientRect();
            tooltip.style.left = rect.left + (rect.width / 2) - (tooltip.offsetWidth / 2) + 'px';
            tooltip.style.top = rect.top - tooltip.offsetHeight - 5 + 'px';
            
            this._tooltip = tooltip;
        });
        
        element.addEventListener('mouseleave', function() {
            if (this._tooltip) {
                this._tooltip.remove();
                delete this._tooltip;
            }
        });
    });
    
    // Simulate real-time notifications
    function addNotification() {
        const notifications = [
            { type: 'user', message: 'New user registration', icon: 'user-plus' },
            { type: 'order', message: 'New order received', icon: 'shopping-bag' },
            { type: 'comment', message: 'New comment posted', icon: 'message-circle' },
            { type: 'alert', message: 'Server alert triggered', icon: 'alert-triangle' }
        ];
        
        const randomNotification = notifications[Math.floor(Math.random() * notifications.length)];
        console.log('Notification:', randomNotification.message);
    }
    
    // Add random notifications every 30 seconds
    setInterval(addNotification, 30000);
    
    // Re-initialize Lucide icons when DOM changes
    const observer = new MutationObserver(() => {
        lucide.createIcons();
    });
    
    observer.observe(document.body, {
        childList: true,
        subtree: true
    });
});