{% load i18n %}
<!-- Invoices Card Partial -->
<div class="bg-white rounded-lg shadow-lg p-6 border-l-4 border-yellow-500 transform hover:scale-105 transition-all">
    <h3 class="text-lg font-semibold text-gray-700 mb-3">{% trans "Factures en attente" %}</h3>
    <div class="text-3xl font-bold text-gray-900">{{ pending_invoices }}</div>
    <div class="flex items-center mt-4 text-sm">
        <svg class="w-4 h-4 text-yellow-500 mr-2" fill="none" stroke="currentColor" viewBox="0 0 24 24">
            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"/>
        </svg>
        <span class="text-gray-600">À traiter</span>
    </div>
</div>