@if ($paginator->hasPages())
    @php
        $current = $paginator->currentPage();
        $last = $paginator->lastPage();

        // 🔥 ambil onEachSide dari paginator
        $onEachSide = method_exists($paginator, 'onEachSide')
            ? $paginator->onEachSide
            : 2;

        $start = max(1, $current - $onEachSide);
        $end   = min($last, $current + $onEachSide);
    @endphp

    <div class="fluent-pagination">

        {{-- PREVIOUS --}}
        @if ($paginator->onFirstPage())
            <span class="fluent-page disabled">
                <x-fluent-icon
                    name="chevron_left"
                    size="sm"
                />
            </span>
        @else
            <a href="{{ $paginator->previousPageUrl() }}" class="fluent-page">
                <x-fluent-icon
                    name="chevron_left"
                    size="sm"
                />
            </a>
        @endif

        {{-- FIRST PAGE --}}
        @if ($start > 1)
            <a href="{{ $paginator->url(1) }}" class="fluent-page">1</a>

            @if ($start > 2)
                <span class="fluent-page dots">...</span>
            @endif
        @endif

        {{-- MIDDLE PAGES --}}
        @for ($i = $start; $i <= $end; $i++)
            @if ($i == $current)
                <span class="fluent-page active">{{ $i }}</span>
            @else
                <a href="{{ $paginator->url($i) }}" class="fluent-page">{{ $i }}</a>
            @endif
        @endfor

        {{-- LAST PAGE --}}
        @if ($end < $last)
            @if ($end < $last - 1)
                <span class="fluent-page dots">...</span>
            @endif

            <a href="{{ $paginator->url($last) }}" class="fluent-page">{{ $last }}</a>
        @endif

        {{-- NEXT --}}
        @if ($paginator->hasMorePages())
            <a href="{{ $paginator->nextPageUrl() }}" class="fluent-page">
                <x-fluent-icon
                    name="chevron_right"
                    size="sm"
                />
            </a>
        @else
            <span class="fluent-page disabled">
                <x-fluent-icon
                    name="chevron_right"
                    size="sm"
                />
            </span>
        @endif

    </div>
@endif