@props(['items' => []])

{{-- $items: array of ['label' => ..., 'url' => null] — last item is the current page --}}
<nav aria-label="Breadcrumb" class="border-b border-cream-200 bg-cream-50">
    <ol class="container-shop flex flex-wrap items-center gap-1.5 py-3.5 text-xs text-ink-500">
        <li><a href="{{ route('home') }}" class="transition-colors hover:text-moss-600">Home</a></li>
        @foreach ($items as $item)
            <li aria-hidden="true"><x-icon name="chevron-right" class="h-3 w-3 text-ink-400" /></li>
            <li>
                @if (!empty($item['url']) && !$loop->last)
                    <a href="{{ $item['url'] }}" class="transition-colors hover:text-moss-600">{{ $item['label'] }}</a>
                @else
                    <span class="font-medium text-ink-900" @if($loop->last) aria-current="page" @endif>{{ $item['label'] }}</span>
                @endif
            </li>
        @endforeach
    </ol>
</nav>