script.js

document.addEventListener('DOMContentLoaded', () => {
    // Initialize Lucide icons
    if (typeof lucide !== 'undefined') {
        lucide.createIcons();
    }

    // Global Search Logic
    const mainSearch = document.getElementById('mainSearch');
    const categoryCards = document.querySelectorAll('.card');

    if (mainSearch) {
        mainSearch.addEventListener('input', (e) => {
            const term = e.target.value.toLowerCase();
            categoryCards.forEach(card => {
                const title = card.querySelector('.card-title').textContent.toLowerCase();
                const desc = card.querySelector('.card-desc').textContent.toLowerCase();
                card.style.display = (title.includes(term) || desc.includes(term)) ? 'flex' : 'none';
            });
        });
    }

    // Individual Page Search Logic
    const shortcutSearch = document.getElementById('shortcutSearch');
    const shortcutItems = document.querySelectorAll('.shortcut-item');

    if (shortcutSearch) {
        shortcutSearch.addEventListener('input', (e) => {
            const term = e.target.value.toLowerCase();
            shortcutItems.forEach(item => {
                const desc = item.querySelector('.shortcut-desc').textContent.toLowerCase();
                const key = item.querySelector('.shortcut-key').textContent.toLowerCase();
                item.style.display = (desc.includes(term) || key.includes(term)) ? 'flex' : 'none';
            });
        });
    }

    // Add animation delay to cards and items for a staggered effect
    categoryCards.forEach((card, index) => {
        card.style.animationDelay = `${index * 0.1}s`;
    });

    shortcutItems.forEach((item, index) => {
        item.style.animationDelay = `${index * 0.05}s`;
    });
});