{{--
    Petit "Précédent / Page X sur Y / Suivant", pas le rendu par défaut de
    Laravel (`$paginator->links()`) — celui-ci suppose une palette Tailwind
    générique sans rapport avec le reskin Able Pro du reste de cette page,
    et une seule page de résultats sur un espace de taille normale rend de
    toute façon un jeu de liens numérotés disproportionné.

    @param \Illuminate\Contracts\Pagination\LengthAwarePaginator $paginator
    @param string $pageName
--}}
@if ($paginator->hasPages())
    <div class="flex items-center justify-between pt-2">
        <button
            type="button"
            wire:click="previousPage('{{ $pageName }}')"
            @disabled($paginator->onFirstPage())
            class="rounded-lg border border-gray-200 px-2.5 py-1 text-xs font-semibold text-gray-600 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-40 dark:border-white/10 dark:text-gray-300 dark:hover:bg-white/5"
        >
            Précédent
        </button>

        <span class="text-xs text-gray-400 dark:text-gray-500">
            Page {{ $paginator->currentPage() }} sur {{ $paginator->lastPage() }}
        </span>

        <button
            type="button"
            wire:click="nextPage('{{ $pageName }}')"
            @disabled(! $paginator->hasMorePages())
            class="rounded-lg border border-gray-200 px-2.5 py-1 text-xs font-semibold text-gray-600 hover:bg-gray-50 disabled:cursor-not-allowed disabled:opacity-40 dark:border-white/10 dark:text-gray-300 dark:hover:bg-white/5"
        >
            Suivant
        </button>
    </div>
@endif