@if ($paginator->hasPages())
<nav class="flex justify-center">
    <ul class="flex items-center space-x-1">
        {{-- Previous Page Link --}}
        @if ($paginator->onFirstPage())
            <li class="px-3 py-2 text-gray-300 cursor-not-allowed rounded-lg">&laquo;</li>
        @else
            <li>
                <a href="{{ $paginator->previousPageUrl() }}" class="px-3 py-2 text-gray-600 hover:outline hover:outline-2 hover:outline-indigo-300 hover:text-indigo-600 rounded-lg">&laquo;</a>
            </li>
        @endif

        {{-- Pagination Elements --}}
        @foreach ($elements as $element)
            @if (is_string($element))
                <li class="px-3 py-2 text-gray-400">{{ $element }}</li>
            @endif

            @if (is_array($element))
                @foreach ($element as $page => $url)
                    @if ($page == $paginator->currentPage())
                        <li>
                            <span class="px-3 py-2 bg-indigo-600 text-white rounded-lg font-medium">{{ $page }}</span>
                        </li>
                    @else
                        <li>
                            <a href="{{ $url }}" class="px-3 py-2 text-gray-600 hover:outline hover:outline-2 hover:outline-indigo-300 hover:text-indigo-600 rounded-lg">{{ $page }}</a>
                        </li>
                    @endif
                @endforeach
            @endif
        @endforeach

        {{-- Next Page Link --}}
        @if ($paginator->hasMorePages())
            <li>
                <a href="{{ $paginator->nextPageUrl() }}" class="px-3 py-2 text-gray-600 hover:outline hover:outline-2 hover:outline-indigo-300 hover:text-indigo-600 rounded-lg">&raquo;</a>
            </li>
        @else
            <li class="px-3 py-2 text-gray-300 cursor-not-allowed rounded-lg">&raquo;</li>
        @endif
    </ul>
</nav>
@endif