{# templates/admin/technique/_partials/_lots_list.html.twig #}
<div class="list-group list-group-flush">
    {% for lot in projet.lots %}
        {% set avancement = lot.avancement %} {# Appelle getAvancement() défini dans l'Entity #}
        
        <a href="#" class="list-group-item list-group-item-action clickable-item lot-item p-3" 
           data-id="{{ lot.id }}"
           data-evol-url="{{ path('ajax_technique_lot_evolution', {id: lot.id}) }}">
            
            <div class="d-flex justify-content-between align-items-start mb-2">
                <div class="min-w-0">
                    <h6 class="mb-0 fw-bold text-dark text-truncate">{{ lot.nomBien }}</h6>
                    <small class="text-muted">Lot n°{{ lot.numeroLot }} • {{ lot.typeBien.libelle|default('Type NC') }}</small>
                </div>
                <span class="badge bg-light text-dark border fw-normal" style="font-size: 0.7rem;">
                    {{ lot.statut.value|default('Statut NC') }}
                </span>
            </div>

            <div class="d-flex align-items-center gap-2">
                <div class="progress flex-grow-1" style="height: 6px; border-radius: 10px; background-color: #eee;">
                    {# js-lot-progress-bar : pour cibler la barre en JS #}
                    <div class="progress-bar js-lot-progress-bar {{ avancement < 100 ? 'bg-primary' : 'bg-success' }}" 
                         role="progressbar" 
                         style="width: {{ avancement }}%" 
                         aria-valuenow="{{ avancement }}" 
                         aria-valuemin="0" 
                         aria-valuemax="100">
                    </div>
                </div>
                {# js-lot-percentage : pour cibler le texte en JS #}
                <span class="small fw-bold js-lot-percentage {{ avancement == 100 ? 'text-success' : 'text-primary' }}" 
                      style="font-size: 0.75rem; min-width: 35px;">
                    {{ avancement }}%
                </span>
            </div>
        </a>
    {% else %}
        <div class="p-5 text-center text-muted">
            <i class="fas fa-info-circle fa-2x mb-3 opacity-25"></i>
            <p class="small mb-0">Aucun lot n'est rattaché à ce programme.</p>
        </div>
    {% endfor %}
</div>