{{--
    Sidebar Single Link
--}}
@php
$route = $item['route'] ?? '';
$routeParams = $item['route_params'] ?? [];
$activePattern = $item['active'] ?? (str_ends_with($route, '.index') ? substr($route, 0, -6) . '.*' : $route);
$active = request()->routeIs($route) || ($activePattern && request()->routeIs($activePattern));
$base = 'group relative flex cursor-pointer select-none items-center gap-3 rounded-lg px-3 py-2.5 text-[13.5px] font-medium transition-all duration-200';
$inactive = 'text-sidebar-foreground hover:bg-sidebar-accent hover:text-sidebar-accent-foreground';
$act = "bg-sidebar-primary font-semibold text-sidebar-primary-foreground before:pointer-events-none before:absolute before:bottom-1.5 before:start-0 before:top-1.5 before:w-1 before:rounded-r before:bg-sidebar-ring before:content-[''] dark:bg-sidebar-active";
$navLabel = $item['label'] ?? '';
@endphp
<a
    href="{{ isset($item['route']) && (!empty($item['route']) && $item['route'] !== 'javascript:void(0)' && $item['route'] !== '#') ? route($item['route'], $routeParams) : ($item['url'] ?? '#') }}"
    @class([$base, $inactive=> !$active, $act => $active])
    title="{{ __($item['label']) }}"
    >
    @if(!empty($item['icon']))
    <span
        @class([ 'h-5 w-5 flex-shrink-0 transition-opacity' , 'opacity-100'=> $active,
        'opacity-75 group-hover:opacity-100' => !$active,
        ])
        aria-hidden="true"
        >
        <x-dynamic-component :component="$item['icon']" class="h-5 w-5" />
    </span>
    @endif

    <span
        data-sidebar-label
        x-show="!$store.sidebar.collapsed"
        class="flex-1 truncate"
        x-transition:enter="transition-opacity duration-200 delay-100"
        x-transition:enter-start="opacity-0"
        x-transition:enter-end="opacity-100">
        {{ __($item['label']) }}
    </span>

    @if(isset($item['badge']))
    <span
        data-sidebar-badge
        x-show="!$store.sidebar.collapsed"
        class="rounded-full bg-primary-100 px-1.5 py-0.5 text-[10px] font-medium text-primary-700 dark:bg-primary-950 dark:text-primary-300">{{ $item['badge'] }}</span>
    @endif
</a>