@if ($paginator->hasPages())

<div class="d-flex justify-content-center justify-content-sm-between align-items-center text-center flex-wrap gap-2 showing-wrap">
    <span class="fs-13 fw-medium">Items per pages: {{ $paginator->perPage() }}</span>

    <div class="d-flex align-items-center">
        <span class="fs-13 fw-medium me-2">            
            <span class="fw-semibold">{{ $paginator->firstItem() }}</span>
            {!! __('-') !!}
            <span class="fw-semibold">{{ $paginator->lastItem() }}</span>
            {!! __('of') !!}
            <span class="fw-semibold">{{ $paginator->total() }}</span>
        </span>
        <nav aria-label="Page navigation example">
            <ul class="pagination mb-0 justify-content-center">
                {{-- Previous Page Link --}}
                @if ($paginator->onFirstPage())
                    <li class="page-item disabled" aria-disabled="true">
                        <span class="page-link"><i class="material-symbols-outlined">keyboard_arrow_left</i></span>
                    </li>
                @else
                    <li class="page-item">
                        <a class="page-link" href="{{ $paginator->previousPageUrl() }}" rel="prev"><i class="material-symbols-outlined">keyboard_arrow_left</i></a>
                    </li>
                @endif

                {{-- Next Page Link --}}
                @if ($paginator->hasMorePages())
                    <li class="page-item">
                        <a class="page-link" href="{{ $paginator->nextPageUrl() }}" rel="next"><i class="material-symbols-outlined">keyboard_arrow_right</i></a>
                    </li>
                @else
                    <li class="page-item disabled" aria-disabled="true">
                        <span class="page-link"><i class="material-symbols-outlined">keyboard_arrow_right</i></span>
                    </li>
                @endif                
            </ul>
        </nav>
    </div>
</div>
@endif