{{--
    Dropdown Item Component - TailServer Theme
--}}

@props([
    'href' => null,
    'icon' => null,
    'variant' => 'default',
    'disabled' => false,
])

@php
    $tag = $href ? 'a' : 'button';
    
    $variantClasses = [
        'default' => 'text-base/70 hover:bg-gradient-to-r hover:from-neutral/10 hover:to-transparent hover:text-base',
        'danger' => 'text-danger hover:bg-gradient-to-r hover:from-danger/10 hover:to-transparent',
        'success' => 'text-success hover:bg-gradient-to-r hover:from-success/10 hover:to-transparent',
    ];
    
    $variantClass = $variantClasses[$variant] ?? $variantClasses['default'];
@endphp

<{{ $tag }}
    @if($href) href="{{ $href }}" @endif
    @if($tag === 'button') type="button" @endif
    @if($disabled) disabled @endif
    {{ $attributes->class([
        'group flex w-full items-center gap-2.5 px-4 py-2.5 text-sm font-medium transition-all duration-150',
        $variantClass,
        'opacity-50 cursor-not-allowed' => $disabled,
    ]) }}
>
    @if($icon)
        <x-dynamic-component :component="$icon" class="size-4 opacity-50 group-hover:opacity-80 transition-opacity" />
    @endif
    <span class="flex-1 text-left">{{ $slot }}</span>
</{{ $tag }}>