<div class="section-container">
    <div class="section-header">
        <h2>📥 Téléchargements</h2>
        <div class="header-actions">
            <button class="btn btn-sm btn-secondary" 
                    hx-post="/api/downloads/cleanup" 
                    hx-swap="none"
                    hx-on::after-request="htmx.trigger('#downloads-container-inner', 'refresh')">
                Nettoyer terminés
            </button>
        </div>
    </div>

    <!-- Container that loads content via HTMX -->
    <div id="downloads-container-inner" 
         hx-get="/api/downloads?html=1" 
         hx-trigger="load, refresh, every 3s" 
         hx-swap="innerHTML">
        <div class="loading-placeholder">
            <div class="spinner"></div> Chargement des téléchargements...
        </div>
    </div>
</div>

<style>
.section-container { margin-bottom: 40px; }
/* Styles already defined or moved to downloads_list.html */
</style>
