/**
 * Super Agency Theme - Main JavaScript
 * Handles theme interactive functionality
 */

document.addEventListener('DOMContentLoaded', function() {
    // Sticky header scroll effect
    const stickyWrapper = document.querySelector('body.super-agency-sticky-header header.wp-block-template-part');
    if (stickyWrapper) {
        window.addEventListener('scroll', function() {
            if (window.scrollY > 10) {
                stickyWrapper.classList.add('is-scrolled');
            } else {
                stickyWrapper.classList.remove('is-scrolled');
            }
        }, { passive: true });
    }


    // FAQ Accordion Enhancement (if present on page)
    const faqItems = document.querySelectorAll('.super-agency-faq-accordion details');
    
    faqItems.forEach(function(item) {
        const summary = item.querySelector('summary');
        
        if (summary) {
            summary.addEventListener('click', function() {
                // Add smooth animation class
                item.classList.add('animating');
                
                setTimeout(() => {
                    item.classList.remove('animating');
                }, 300);
            });
        }
    });
    
    // Portfolio Filter Functionality
    const portfolioSection = document.querySelector('.super-agency-portfolio-section');
    
    if (portfolioSection) {
        const portfolioFilters = portfolioSection.querySelectorAll('.super-agency-portfolio-filter a');
        const portfolioCards = portfolioSection.querySelectorAll('.super-agency-portfolio-card');
        
        if (portfolioFilters.length > 0 && portfolioCards.length > 0) {
            portfolioFilters.forEach(function(filter) {
                filter.addEventListener('click', function(e) {
                    e.preventDefault();
                    
                    // Remove active class from all filter containers
                    portfolioFilters.forEach(f => f.closest('.super-agency-portfolio-filter').classList.remove('is-active'));
                    
                    // Add active class to clicked filter container
                    this.closest('.super-agency-portfolio-filter').classList.add('is-active');
                    
                    // Get filter category
                    const filterCategory = this.getAttribute('data-filter');
                    
                    // Filter portfolio cards
                    portfolioCards.forEach(function(card) {
                        const cardCategory = card.getAttribute('data-category');
                        
                        if (filterCategory === 'all' || cardCategory === filterCategory) {
                            // Show card with animation
                            card.style.display = 'block';
                            setTimeout(() => {
                                card.style.opacity = '1';
                                card.style.transform = 'translateY(0)';
                            }, 50);
                        } else {
                            // Hide card with animation
                            card.style.opacity = '0';
                            card.style.transform = 'translateY(20px)';
                            setTimeout(() => {
                                card.style.display = 'none';
                            }, 300);
                        }
                    });
                });
            });
        }
    }
    
    // Smooth scroll for anchor links
    const anchorLinks = document.querySelectorAll('a[href^="#"]');
    
    anchorLinks.forEach(function(link) {
        link.addEventListener('click', function(e) {
            const href = this.getAttribute('href');
            
            if (href !== '#' && href.length > 1) {
                const target = document.querySelector(href);
                
                if (target) {
                    e.preventDefault();
                    target.scrollIntoView({
                        behavior: 'smooth',
                        block: 'start'
                    });
                }
            }
        });
    });
});