@props([
    'paginator' => null,
])

@if ($paginator && $paginator->hasPages())
    @php
        $start = max(1, $paginator->currentPage() - 2);
        $end = min($paginator->lastPage(), $paginator->currentPage() + 2);
    @endphp
    <nav class="mt-8 flex items-center justify-center gap-1.5" aria-label="{{ __('web.search.pagination') }}">
        @if ($paginator->onFirstPage())
            <span class="inline-flex items-center justify-center w-9 h-9 border border-bg-rule text-ink-4 opacity-40 cursor-not-allowed" aria-hidden="true">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="none"><path d="M15 19l-7-7 7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
            </span>
        @else
            <a href="{{ $paginator->previousPageUrl() }}" rel="prev"
                class="inline-flex items-center justify-center w-9 h-9 border border-bg-rule-strong text-ink hover:bg-bg-elev transition-colors"
                aria-label="{{ __('web.search.previous_page') }}">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="none"><path d="M15 19l-7-7 7-7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
            </a>
        @endif

        @foreach ($paginator->getUrlRange($start, $end) as $page => $url)
            @if ($page === $paginator->currentPage())
                <span class="inline-flex items-center justify-center min-w-9 h-9 px-2 border border-brand bg-brand text-white text-[13px] font-mono" aria-current="page">{{ $page }}</span>
            @else
                <a href="{{ $url }}"
                    class="inline-flex items-center justify-center min-w-9 h-9 px-2 border border-bg-rule-strong text-ink hover:bg-bg-elev text-[13px] font-mono transition-colors">{{ $page }}</a>
            @endif
        @endforeach

        @if ($paginator->hasMorePages())
            <a href="{{ $paginator->nextPageUrl() }}" rel="next"
                class="inline-flex items-center justify-center w-9 h-9 border border-bg-rule-strong text-ink hover:bg-bg-elev transition-colors"
                aria-label="{{ __('web.search.next_page') }}">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="none"><path d="M9 5l7 7-7 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
            </a>
        @else
            <span class="inline-flex items-center justify-center w-9 h-9 border border-bg-rule text-ink-4 opacity-40 cursor-not-allowed" aria-hidden="true">
                <svg width="14" height="14" viewBox="0 0 24 24" fill="none"><path d="M9 5l7 7-7 7" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/></svg>
            </span>
        @endif
    </nav>
@endif