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

@php
    // Roadmap 2.4: Unter-Navigation über der Headline von Preisseite und den
    // vier Transparenzseiten — damit die Antworten auf „Was kostet das?",
    // „Geht das ohne Abo?" und „Wie werde ich es wieder los?" neben den
    // Tarifen stehen. `current` = Routenname der aktuellen Seite.
    $items = [
        'preise' => __('pricing.transparency_nav.pricing'),
        'was-kostet-eine-pressemitteilung' => __('pricing.transparency_nav.cost'),
        'pressemitteilung-veroeffentlichen-ohne-abo' => __('pricing.transparency_nav.no_subscription'),
        'pressemitteilung-loeschen-oder-aendern-lassen' => __('pricing.transparency_nav.change_delete'),
        'pressemitteilung-kostenlos-veroeffentlichen' => __('pricing.transparency_nav.free'),
    ];
@endphp

<nav {{ $attributes->merge(['class' => 'flex items-center gap-x-4 gap-y-2 flex-wrap']) }} aria-label="{{ __('pricing.transparency_nav.label') }}">
    <span class="eyebrow muted text-[10px]">{{ __('pricing.transparency_nav.label') }}</span>
    <ul class="m-0 p-0 list-none flex flex-wrap gap-1.5">
        @foreach ($items as $routeName => $label)
            <li>
                @if ($routeName === $current)
                    <span class="inline-flex items-center px-3 py-1.5 text-[12.5px] font-semibold border border-brand bg-brand text-white" aria-current="page">{{ $label }}</span>
                @else
                    <a href="{{ \App\Support\StaticPageCanonical::publicUrlFor($routeName) }}" class="inline-flex items-center px-3 py-1.5 text-[12.5px] font-semibold border border-bg-rule-strong bg-white text-ink hover:bg-bg-elev transition-colors">{{ $label }} →</a>
                @endif
            </li>
        @endforeach
    </ul>
</nav>