@props(['route','icon','label','badge' => null])

<a href="{{ route($route) }}"
   class="flex items-center gap-3 px-4 py-3 rounded-xl
          {{ request()->routeIs($route)
                ? 'bg-primary/10 text-primary font-semibold'
                : 'text-gray-600 dark:text-gray-300 hover:bg-gray-100 dark:hover:bg-slate-800' }}
          transition">
    <i class="bi {{ $icon }}"></i>
    <span class="flex-1">{{ $label }}</span>

    @if($badge)
        <span class="text-[10px] px-2 py-0.5 rounded-full bg-primary text-white">
            {{ $badge }}
        </span>
    @endif
</a>