{{-- Visual Breadcrumbs with Schema.org Markup --}}
@php
    use App\Helpers\SeoHelper;
    $items = $items ?? [];
@endphp

@if(count($items) > 0)
@php $compact = $compact ?? false; @endphp
{{-- Schema.org Breadcrumb --}}
<script type="application/ld+json">
{!! SeoHelper::generateBreadcrumbSchema($items) !!}
</script>

{{-- Visual Breadcrumb Navigation --}}
<nav aria-label="{{ __('messages.accessibility.breadcrumb') }}" class="{{ $compact ? 'mb-1' : 'mb-6' }}">
    <ol class="flex items-center flex-wrap gap-x-2 gap-y-0 {{ $compact ? 'text-xs' : 'text-sm' }}" itemscope itemtype="https://schema.org/BreadcrumbList">
        @foreach($items as $index => $item)
        <li itemprop="itemListElement" itemscope itemtype="https://schema.org/ListItem" class="flex items-center">
            @if($loop->last)
                <span itemprop="name" class="text-neutral-600" aria-current="page">{{ $item['name'] }}</span>
                <meta itemprop="position" content="{{ $index + 1 }}">
            @else
                <a href="{{ $item['url'] }}" 
                   itemprop="item" 
                   class="text-neutral-500 hover:text-criazo-primary smooth-transition"
                   title="{{ __('messages.accessibility.navigate_to', ['page' => $item['name']]) }}">
                    <span itemprop="name">{{ $item['name'] }}</span>
                </a>
                <meta itemprop="position" content="{{ $index + 1 }}">
                <svg class="{{ $compact ? 'w-3 h-3 mx-1.5' : 'w-4 h-4 mx-2' }} text-neutral-300 flex-shrink-0" fill="none" stroke="currentColor" viewBox="0 0 24 24" aria-hidden="true">
                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5l7 7-7 7"/>
                </svg>
            @endif
        </li>
        @endforeach
    </ol>
</nav>
@endif