{% if processing_delay_value and processing_delay_trend_delay is not none %}
<div class="card border-0 shadow-sm bg-light-subtle rounded-4 h-100">
    <div class="card-body ">
        <div class="d-flex align-items-center mb-3">
            {% if performanceType == 'fill' %}
                <i class="fas fa-keyboard text-info fs-4 me-2"></i>
            {% elseif performanceType == 'approve' %}
                <i class="fas fa-check-circle text-success fs-4 me-2"></i>
            {% elseif performanceType == 'validate' %}
                <i class="fas fa-clipboard-check text-warning fs-4 me-2"></i>
            {% endif %}
            <div>
                {% if performanceType == 'fill' %}
                    <h4 class="header-title ">Saisie</h4>
                {% elseif performanceType == 'approve' %}
                    <h4 class="header-title ">Approbation</h4>
                {% elseif performanceType == 'validate' %}
                    <h4 class="header-title ">Validation</h4>
                {% endif %}
                <div class="d-flex align-items-baseline mt-2">
                    <h2 class="mb-0 fw-bold">{{ (processing_delay_value ?? 0 ) |number_format(1, '.', ' ') }}</h2>
                    <span class="ms-2 text-muted">jour(s)</span>
                </div>
            </div>
        </div>
        {% set trend = processing_delay_trend_delay ?? 0 %}
        {% set trend_display = (trend == 100) ? '+' ~ trend : trend |abs %}
        <div class="d-flex align-items-center text-success small">
            <span class="text-{{ trend > 0 ? 'danger' : 'success' }}">
                <i class="fas fa-arrow-{{ trend > 0 ? 'up' : 'down' }} me-1"></i>
                {{ trend_display }}% vs mois précédent
            </span>
        </div>
    </div>
</div>
{% else %}
    <div class="card border-0 shadow-sm bg-light-subtle rounded-4 h-100">
        <div class="card-body">
            <p class="text-muted text-center mb-0">Stats non disponible</p>
        </div>
    </div>
{% endif %}