/* PRODUCTION JAVASCRIPT */
document.addEventListener('DOMContentLoaded', function() {
    initAOS();
    initNavbar();
    initMobileMenu();
    initFilters();
    initSearch();
    initSort();
    initCategoryLinks();
});

// AOS
function initAOS() {
    if (typeof AOS !== 'undefined') {
        AOS.init({ duration: 600, easing: 'ease-out', once: true, offset: 50 });
    }
}

// Navbar Scroll
function initNavbar() {
    const navbar = document.querySelector('.navbar');
    if (!navbar) return;
    
    let lastScroll = 0;
    window.addEventListener('scroll', function() {
        const currentScroll = window.pageYOffset;
        if (currentScroll > 50) {
            navbar.classList.add('scrolled');
        } else {
            navbar.classList.remove('scrolled');
        }
        lastScroll = currentScroll;
    });
}

// Mobile Menu
function initMobileMenu() {
    const toggle = document.querySelector('.mobile-menu-toggle');
    const menu = document.querySelector('.mobile-menu');
    
    if (!toggle || !menu) return;
    
    toggle.addEventListener('click', function() {
        this.classList.toggle('active');
        menu.classList.toggle('active');
        document.body.style.overflow = menu.classList.contains('active') ? 'hidden' : '';
    });
    
    // Close on link click
    menu.querySelectorAll('a').forEach(link => {
        link.addEventListener('click', function() {
            toggle.classList.remove('active');
            menu.classList.remove('active');
            document.body.style.overflow = '';
        });
    });
}

// Category Filters
function initFilters() {
    const filterOptions = document.querySelectorAll('.filter-option[data-category]');
    const priceFilters = document.querySelectorAll('.filter-option[data-price]');
    const productCards = document.querySelectorAll('#products-grid .product-card');
    const countEl = document.getElementById('visible-count');
    
    let currentCategory = 'all';
    let currentPrice = 'all';
    
    function filterProducts() {
        let visibleCount = 0;
        
        productCards.forEach(card => {
            const cardCategory = card.getAttribute('data-category');
            const cardPrice = parseFloat(card.getAttribute('data-price'));
            
            let categoryMatch = currentCategory === 'all' || cardCategory === currentCategory;
            let priceMatch = true;
            
            if (currentPrice !== 'all') {
                if (currentPrice === '0-50') priceMatch = cardPrice < 50;
                else if (currentPrice === '50-100') priceMatch = cardPrice >= 50 && cardPrice < 100;
                else if (currentPrice === '100-200') priceMatch = cardPrice >= 100 && cardPrice < 200;
                else if (currentPrice === '200') priceMatch = cardPrice >= 200;
            }
            
            if (categoryMatch && priceMatch) {
                card.style.display = 'block';
                visibleCount++;
            } else {
                card.style.display = 'none';
            }
        });
        
        if (countEl) countEl.textContent = visibleCount;
    }
    
    // Category filter click
    filterOptions.forEach(option => {
        option.addEventListener('click', function() {
            filterOptions.forEach(o => o.classList.remove('active'));
            this.classList.add('active');
            currentCategory = this.getAttribute('data-category');
            filterProducts();
        });
    });
    
    // Price filter click
    priceFilters.forEach(option => {
        option.addEventListener('click', function() {
            priceFilters.forEach(o => o.classList.remove('active'));
            this.classList.add('active');
            currentPrice = this.getAttribute('data-price');
            filterProducts();
        });
    });
    
    // Dropdown category links
    document.querySelectorAll('.dropdown-item[data-category]').forEach(item => {
        item.addEventListener('click', function(e) {
            e.preventDefault();
            const cat = this.getAttribute('data-category');
            
            // Find and click the sidebar filter
            const filterOption = document.querySelector(`.filter-option[data-category="${cat}"]`);
            if (filterOption) {
                filterOption.click();
            }
            
            // Scroll to products
            const productsSection = document.getElementById('all-products');
            if (productsSection) {
                productsSection.scrollIntoView({ behavior: 'smooth' });
            }
        });
    });
}

// Search
function initSearch() {
    const searchInput = document.getElementById('nav-search-input');
    const productCards = document.querySelectorAll('#products-grid .product-card');
    const countEl = document.getElementById('visible-count');
    
    if (!searchInput) return;
    
    searchInput.addEventListener('input', function() {
        const term = this.value.toLowerCase().trim();
        let visibleCount = 0;
        
        productCards.forEach(card => {
            const name = card.getAttribute('data-name') || '';
            const category = card.getAttribute('data-category') || '';
            
            if (term === '' || name.includes(term) || category.toLowerCase().includes(term)) {
                card.style.display = 'block';
                visibleCount++;
            } else {
                card.style.display = 'none';
            }
        });
        
        if (countEl) countEl.textContent = visibleCount;
    });
    
    // Focus search and scroll to products
    searchInput.addEventListener('focus', function() {
        const productsSection = document.getElementById('all-products');
        if (productsSection) {
            setTimeout(() => {
                productsSection.scrollIntoView({ behavior: 'smooth' });
            }, 300);
        }
    });
}

// Sort
function initSort() {
    const sortSelect = document.getElementById('sort-select');
    const productsGrid = document.getElementById('products-grid');
    
    if (!sortSelect || !productsGrid) return;
    
    sortSelect.addEventListener('change', function() {
        const sortValue = this.value;
        const cards = Array.from(productsGrid.querySelectorAll('.product-card'));
        
        cards.sort((a, b) => {
            const priceA = parseFloat(a.getAttribute('data-price'));
            const priceB = parseFloat(b.getAttribute('data-price'));
            const nameA = a.getAttribute('data-name') || '';
            const nameB = b.getAttribute('data-name') || '';
            const viewsA = parseInt(a.getAttribute('data-views')) || 0;
            const viewsB = parseInt(b.getAttribute('data-views')) || 0;
            
            switch (sortValue) {
                case 'price-low': return priceA - priceB;
                case 'price-high': return priceB - priceA;
                case 'name': return nameA.localeCompare(nameB);
                case 'popular': return viewsB - viewsA;
                default: return 0;
            }
        });
        
        cards.forEach(card => productsGrid.appendChild(card));
    });
}

// Category Links (footer, category cards, etc)
function initCategoryLinks() {
    // Category cards
    document.querySelectorAll('.category-card[data-category]').forEach(card => {
        card.addEventListener('click', function(e) {
            e.preventDefault();
            const cat = this.getAttribute('data-category');
            
            const filterOption = document.querySelector(`.filter-option[data-category="${cat}"]`);
            if (filterOption) filterOption.click();
            
            const productsSection = document.getElementById('all-products');
            if (productsSection) {
                productsSection.scrollIntoView({ behavior: 'smooth' });
            }
        });
    });
    
    // Mobile category links
    document.querySelectorAll('.mobile-category-link[data-category]').forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            const cat = this.getAttribute('data-category');
            
            const filterOption = document.querySelector(`.filter-option[data-category="${cat}"]`);
            if (filterOption) filterOption.click();
            
            // Close mobile menu
            const toggle = document.querySelector('.mobile-menu-toggle');
            const menu = document.querySelector('.mobile-menu');
            if (toggle && menu) {
                toggle.classList.remove('active');
                menu.classList.remove('active');
                document.body.style.overflow = '';
            }
            
            const productsSection = document.getElementById('all-products');
            if (productsSection) {
                setTimeout(() => {
                    productsSection.scrollIntoView({ behavior: 'smooth' });
                }, 100);
            }
        });
    });
    
    // Footer category links
    document.querySelectorAll('.footer-cat-link[data-category]').forEach(link => {
        link.addEventListener('click', function(e) {
            e.preventDefault();
            const cat = this.getAttribute('data-category');
            
            const filterOption = document.querySelector(`.filter-option[data-category="${cat}"]`);
            if (filterOption) filterOption.click();
            
            const productsSection = document.getElementById('all-products');
            if (productsSection) {
                productsSection.scrollIntoView({ behavior: 'smooth' });
            }
        });
    });
}

// Smooth scroll for anchor links
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
    anchor.addEventListener('click', function(e) {
        const href = this.getAttribute('href');
        if (href === '#') return;
        
        const target = document.querySelector(href);
        if (target) {
            e.preventDefault();
            target.scrollIntoView({ behavior: 'smooth' });
        }
    });
});

console.log('%c🛍️ Store Ready!', 'color: #667eea; font-size: 14px; font-weight: bold;');