{{--
    Paginación de una lista dentro de un formulario por pasos.

    **Los rótulos dicen «página» a propósito.** Decían «Anterior» y «Siguiente» a
    secas, y este paginador se usa dentro de asistentes que tienen sus propios
    «Atrás» y «Siguiente» de paso: en la misma pantalla había tres «Siguiente» con
    dos significados, y el de pasar de página estaba pegado al de avanzar de paso.
--}}
@if ($paginator->hasPages())
    <div class="flex items-center justify-between mt-4">
        {{-- Botón Anterior --}}
        <div>
            @if ($paginator->onFirstPage())
                <span class="px-4 py-2 text-gray-400 border border-gray-200 rounded-lg cursor-not-allowed">
                    Página anterior
                </span>
            @else
                <button wire:click="previousPage('{{ $paginator->getPageName() }}')" wire:loading.attr="disabled"
                    class="px-4 py-2 text-gray-700 border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50">
                    Página anterior
                </button>
            @endif
        </div>

        {{-- Información de página --}}
        <div class="text-sm text-gray-600">
            Página {{ $paginator->currentPage() }} de {{ $paginator->lastPage() }}
        </div>

        {{-- Botón Siguiente --}}
        <div>
            @if ($paginator->hasMorePages())
                <button wire:click="nextPage('{{ $paginator->getPageName() }}')" wire:loading.attr="disabled"
                    class="px-4 py-2 text-gray-700 border border-gray-300 rounded-lg hover:bg-gray-50 disabled:opacity-50">
                    Página siguiente
                </button>
            @else
                <span class="px-4 py-2 text-gray-400 border border-gray-200 rounded-lg cursor-not-allowed">
                    Página siguiente
                </span>
            @endif
        </div>
    </div>
@endif