@props(['href', 'icon', 'label', 'active' => false])

<a href="{{ $href }}" 
   {{ $attributes->merge(['class' => 'flex items-center gap-4 px-5 py-3.5 rounded-xl transition-all group']) }}
   @class([
       'nav-active font-bold text-royal-blue' => $active,
       'text-gray-600 hover:bg-gray-50 hover:text-gray-900' => !$active,
   ])>
    <i {{ $attributes->merge(['class' => $icon])->class('w-5 text-center group-hover:scale-110 transition-transform') }}></i>
    <span class="text-sm">{{ $label }}</span>
</a>