@props([
    'items' => [],        // ['Label' => url|null, ...] — a null url marks the current page
    'tone' => 'dark',     // dark = sits on photography, light = sits on a light surface
])

@php
    $trail = collect(['Home' => route('home')])->merge($items);
    $muted = $tone === 'dark' ? 'text-white/70' : 'text-text-muted';
    $current = $tone === 'dark' ? 'text-white' : 'text-text';
    $hover = $tone === 'dark' ? 'hover:text-white' : 'hover:text-primary';
@endphp

<nav aria-label="{{ __('Breadcrumb') }}" {{ $attributes }}>
    <ol class="flex flex-wrap items-center gap-x-2 gap-y-1 text-xs {{ $muted }}">
        @foreach ($trail as $label => $url)
            @if (! $loop->first)
                <li aria-hidden="true" class="opacity-50">/</li>
            @endif

            <li @class(['min-w-0'])>
                @if (filled($url) && ! $loop->last)
                    <a href="{{ $url }}" class="transition {{ $hover }}">{{ __($label) }}</a>
                @else
                    <span class="{{ $current }}" @if ($loop->last) aria-current="page" @endif>{{ __($label) }}</span>
                @endif
            </li>
        @endforeach
    </ol>
</nav>

{{-- Breadcrumb structured data, so deep pages surface their trail in search results. --}}
@push('structured-data')
    <script type="application/ld+json">
        {!! ld_json([
            '@context' => 'https://schema.org',
            '@type' => 'BreadcrumbList',
            'itemListElement' => $trail->values()->map(fn ($url, $index) => array_filter([
                '@type' => 'ListItem',
                'position' => $index + 1,
                'name' => $trail->keys()[$index],
                'item' => $url ?: url()->current(),
            ]))->all(),
        ]) !!}
    </script>
@endpush