{% if pageCount > 1 %}
<nav class="flex items-center justify-center gap-1">
    {% if previous is defined and previous %}
        <a href="{{ path(route, query|merge({(pageParameterName): previous})) }}" class="glass px-3 py-2 text-xs font-bold text-gray-600 hover:bg-white/80 transition-all" rel="prev">&laquo;</a>
    {% else %}
        <span class="glass px-3 py-2 text-xs font-bold text-gray-300 cursor-default">&laquo;</span>
    {% endif %}

    {% for page in pagesInRange %}
        {% if page != current %}
            <a href="{{ path(route, query|merge({(pageParameterName): page})) }}" class="glass px-3 py-2 text-xs font-bold text-gray-600 hover:bg-white/80 transition-all">{{ page }}</a>
        {% else %}
            <span class="glass-gold px-3 py-2 text-xs font-bold text-gray-900">{{ page }}</span>
        {% endif %}
    {% endfor %}

    {% if next is defined and next %}
        <a href="{{ path(route, query|merge({(pageParameterName): next})) }}" class="glass px-3 py-2 text-xs font-bold text-gray-600 hover:bg-white/80 transition-all" rel="next">&raquo;</a>
    {% else %}
        <span class="glass px-3 py-2 text-xs font-bold text-gray-300 cursor-default">&raquo;</span>
    {% endif %}
</nav>
{% endif %}
