{# ===================== PROJETS ===================== #}
<div class="p-4 rounded-base border bg-white">
	<h2 class="font-semibold mb-4">Projets</h2>

	<div class="space-y-4">
		{% for project in projects %}
			<div>
				<div class="flex justify-between text-sm">
					<span>{{ project.name }}</span>
					<span>{{ (project.getTotalTransactions() / 100)|number_format(2, ',', ' ') }}
						/
						{{ (project.budgetLimit / 100)|format_currency('EUR') }}</span>
				</div>
				<div class="h-2 bg-gray-100 rounded">
					<div class="h-2 bg-purple-500 rounded" style="width: {{ max(min(project.percentage(), 100), 0) }}%"></div>
				</div>
			</div>
        {% else %}
            <div class="rounded border border-gray-200 bg-white shadow-sm overflow-hidden px-4 py-2 text-center">
				Aucun projet en cours.
            </div>
		{% endfor %}
	</div>
</div>