<div class="hidden-folders-section mb-8" id="hidden-folders">
    <div class="section-header bg-base-200 p-4 rounded-t-lg border-b border-base-300">
        <div class="flex flex-col md:flex-row md:items-center md:justify-between">
            <div>
                <h2 class="text-2xl font-bold text-base-content">
                    <i class="fas fa-eye-slash mr-3"></i>
                    Hidden Folders
                </h2>
                <p class="text-base-content/70 mt-1">Folders that are ignored during email processing</p>
            </div>
        </div>
    </div>
    
    <div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-6 p-6">
        {% for folder in folders|selectattr('folder_type', 'equalto', 'ignore') %}
            {% include 'partials/folder_card_ignore.html' %}
        {% else %}
        <div class="col-span-full text-center py-12 bg-base-100 rounded-box shadow-lg border border-dashed border-base-300">
            <div class="text-5xl mb-4 text-secondary">
                <i class="fas fa-folder-slash"></i>
            </div>
            <h3 class="text-2xl font-bold mb-2">No hidden folders</h3>
            <p class="mb-6 text-base-content/70">Folders that are set to ignore will appear here.</p>
        </div>
        {% endfor %}
    </div>
</div>