@props(['localeParams'])

@php($l = $localeParams)
<div {{ $attributes->merge(['class' => 'flex flex-wrap items-center justify-center gap-1 text-sm font-medium rtl:gap-reverse']) }} role="navigation">
    <a class="{{ request()->routeIs('site.home') ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.home', $l) }}">{{ __('site.nav_home') }}</a>
    @if (site_shows_products())
        <a class="{{ site_nav_products_active() ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.products.index', $l) }}">{{ __('site.nav_products') }}</a>
    @endif
    @if (site_shows_services())
        <a class="{{ request()->routeIs('site.services.*') ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.services.index', $l) }}">{{ __('site.nav_services') }}</a>
    @endif
    @feature('articles_blog')
        <a class="{{ request()->routeIs('site.blog.*') ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.blog.index', $l) }}">{{ __('site.nav_blog') }}</a>
    @endfeature
    @feature('news')
        <a class="{{ request()->routeIs('site.news.*') ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.news.index', $l) }}">{{ __('site.nav_news') }}</a>
    @endfeature
    <a class="{{ request()->routeIs('site.faq') ? 'rounded-lg bg-blue-50 px-3 py-2 font-semibold text-blue-900' : 'rounded-lg px-3 py-2 text-brand-slate transition hover:bg-slate-100' }}" href="{{ route('site.faq', $l) }}">{{ __('site.nav_faq') }}</a>
</div>