{{-- Enhanced Navigation Link Component --}}
@props([
    'active' => false,
    'icon' => null,
    'badge' => null,
    'badgeColor' => 'gray'
])

@php
$classes = $active
    ? 'nav-link-enhanced active'
    : 'nav-link-enhanced';

$badgeColors = [
    'gray' => 'bg-gray-100 text-gray-600',
    'blue' => 'bg-blue-100 text-blue-600',
    'red' => 'bg-red-100 text-red-600',
    'green' => 'bg-green-100 text-green-600',
    'yellow' => 'bg-yellow-100 text-yellow-600',
];
@endphp

<a {{ $attributes->merge(['class' => $classes]) }}>
    @if($icon)
        <span class="icon w-5 h-5 mr-2 flex-shrink-0">
            {!! $icon !!}
        </span>
    @endif

    <span class="flex-1">{{ $slot }}</span>

    @if($badge)
        <span class="ml-2 px-2 py-1 text-xs font-medium rounded-full {{ $badgeColors[$badgeColor] ?? $badgeColors['gray'] }}">
            {{ $badge }}
        </span>
    @endif
</a>































{{-- @props(['active'])

@php
$classes = ($active ?? false)
            ? 'inline-flex items-center px-1 pt-1 border-b-2 border-indigo-400 text-sm font-medium leading-5 text-gray-900 focus:outline-none focus:border-indigo-700 transition duration-150 ease-in-out'
            : 'inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out';
@endphp

<a {{ $attributes->merge(['class' => $classes]) }}>
    {{ $slot }}
</a> --}}