{% if pages > 0 %}
    {# Limiter à 5 pages #}
    {% set startPage = currentPage - 2 %}
    {% set endPage = currentPage + 2 %}
    {% if startPage < 1 %}
        {% set startPage = 1 %}
    {% endif %}

    {% if endPage > pages %}
        {% set endPage = pages %}
    {% endif %}

    {% set path = 'order_load' %}
    {% if pagination is defined and pagination == 'products' %}
        {% set path = 'inventory_load_list' %}
    {% endif %}

    <div id="pagination" class="flex justify-center items-center my-4 pb-4">
        {# Page précédente #}
        <a href="{{ path(path, {
            'page': currentPage - 1 <= 0 ? currentPage : currentPage - 1, 
            'criteria': criteria is defined ? criteria|json_encode : null 
        }) }}">{{ ux_icon('iconamoon:arrow-left-2', {'class': 'w-5'}) }}</a>
        {# Ajouter "..." s'il y a encore des pages à afficher #}
        {% if startPage > 1 %}
            <span>...</span>
        {% endif %}
        {# Pages #}
        {% for page in startPage..endPage %}
            <a href="{{ path(path, {
                'page': page,
                'criteria': criteria is defined ? criteria|json_encode : null
            }) }}" class="mx-1 p-1 {{ page == currentPage ? 'font-bold underline' : '' }} hover:underline">{{ page }}</a>
        {% endfor %}
        {# Ajouter "..." s'il y a encore des pages à afficher #}
        {% if endPage < pages %}
            <span>...</span>
        {% endif %}
        {# Page suivante #}
        <a href="{{ path(path, {
            'page': currentPage == endPage ? currentPage : currentPage + 1,
            'criteria': criteria is defined ? criteria|json_encode : null
        }) }}">{{ ux_icon('iconamoon:arrow-right-2', {'class': 'w-5'}) }}</a>
    </div>
{% endif %}