{{ paginate }}
    {{ if prev_page || next_page }}
        <div class="flex flex-wrap justify-center items-center my-8 space-x-4">
            {{ if prev_page }}
                <a href="{{ prev_page }}" class="text-primary-900 underline hover:no-underline">{{ trans key="Previous page" }}</a>
            {{ else }}
                <span class="text-gray-500">{{ trans key="Previous page" }}</span>
            {{ /if }}

            <ul class="flex flex-wrap justify-center items-center space-x-3">
                {{ links:segments }}
                    {{ first }}
                        {{ if page == current_page }}
                            <li class="active text-primary-900"><span>{{ page }}</span></li>
                        {{ else }}
                            <li><a href="{{ url }}" class="text-primary-900 underline hover:no-underline">{{ page }}</a></li>
                        {{ /if }}
                    {{ /first }}

                    {{ if slider }}
                        <li class="text-gray-500"><span>...</span></li>
                    {{ /if }}

                    {{ slider }}
                        {{ if page == current_page }}
                            <li class="active text-primary-900"><span>{{ page }}</span></li>
                        {{ else }}
                            <li><a href="{{ url }}" class="text-primary-900 underline hover:no-underline">{{ page }}</a></li>
                        {{ /if }}
                    {{ /slider }}

                    {{ if slider || (!slider && last) }}
                        <li class="text-gray-500"><span>...</span></li>
                    {{ /if }}

                    {{ last }}
                        {{ if page == current_page }}
                            <li class="active text-primary-900"><span>{{ page }}</span></li>
                        {{ else }}
                            <li><a href="{{ url }}" class="text-primary-900 underline hover:no-underline">{{ page }}</a></li>
                        {{ /if }}
                    {{ /last }}
                {{ /links:segments }}
            </ul>

            {{ if next_page }}
                <a href="{{ next_page }}" class="text-primary-900 underline hover:no-underline">{{ trans key="Next page" }}</a>
            {{ else }}
                <span class="text-gray-500">{{ trans key="Next page" }}</span>
            {{ /if }}
        </div>
    {{ /if }}
{{ /paginate }}