@props(['paginator'])

{{--
    Numbered pager (01 02 03 …) matching the site's underline-slide convention,
    plus a trailing arrow to the next page. Real pagination — takes any
    Illuminate\Contracts\Pagination\LengthAwarePaginator.

    Usage: <x-ui.pagination :paginator="$products" />
--}}

@if($paginator->hasPages())
    <nav aria-label="{{ __('storefront.pagination.nav_label') }}" {{ $attributes->merge(['class' => 'flex items-center gap-6 font-display font-bold']) }}>
        <ol class="flex items-center gap-6">
            @foreach($paginator->getUrlRange(1, $paginator->lastPage()) as $page => $url)
                <li>
                    @if($page === $paginator->currentPage())
                        <span class="underline-slide is-active" aria-current="page">{{ str_pad((string) $page, 2, '0', STR_PAD_LEFT) }}</span>
                    @else
                        <a href="{{ $url }}" class="underline-slide" aria-label="{{ __('storefront.pagination.page', ['page' => $page]) }}">{{ str_pad((string) $page, 2, '0', STR_PAD_LEFT) }}</a>
                    @endif
                </li>
            @endforeach
        </ol>

        @if($paginator->hasMorePages())
            <a href="{{ $paginator->nextPageUrl() }}" aria-label="{{ __('storefront.pagination.next') }}">
                <x-ui.icon name="arrow-right" :size="24" />
            </a>
        @endif
    </nav>
@endif