@props([
    'type' => 'button',
    'variant' => 'primary',
    'size' => 'md',
    'icon' => null,
    'iconPosition' => 'left',
    'iconClass' => null,
    'loading' => false,
    'disabled' => false,
    'fullWidth' => false,
    'href' => null,
    'outline' => false,
    'rounded' => 'lg',
])

@php
    // AdminLTE button base class
    $baseClasses = 'lte-btn';
    
    // Size classes - AdminLTE style
    $sizeClasses = match($size) {
        'xs' => 'lte-btn-sm',
        'sm' => 'lte-btn-sm',
        'md' => '',
        'lg' => 'lte-btn-lg',
        'xl' => 'lte-btn-lg',
        default => '',
    };
    
    // Icon size classes
    $iconSizeClasses = $iconClass ?? match($size) {
        'xs' => 'size-3',
        'sm' => 'size-3.5',
        'md' => 'size-4',
        'lg' => 'size-5',
        'xl' => 'size-5',
        default => 'size-4',
    };
    
    // Variant classes - AdminLTE style
    $variantClasses = match($variant) {
        'primary' => $outline ? 'lte-btn-outline-primary' : 'lte-btn-primary',
        'secondary' => $outline ? 'lte-btn-outline-secondary' : 'lte-btn-secondary',
        'success' => $outline ? 'lte-btn-outline-success' : 'lte-btn-success',
        'danger' => $outline ? 'lte-btn-outline-danger' : 'lte-btn-danger',
        'warning' => 'lte-btn-warning',
        'info' => 'lte-btn-info',
        'ghost' => 'lte-btn-outline-secondary',
        'link' => 'lte-text-primary',
        'neutral' => $outline ? 'lte-btn-outline-secondary' : 'lte-btn-secondary',
        default => $outline ? 'lte-btn-outline-primary' : 'lte-btn-primary',
    };
    
    // Full width
    $widthClasses = $fullWidth ? 'w-full' : '';
    
    // Combined classes
    $classes = trim("$baseClasses $sizeClasses $variantClasses $widthClasses");
    
    // Determine tag
    $tag = $href ? 'a' : 'button';
@endphp

@if($href)
    <a href="{{ $href }}" {{ $attributes->merge(['class' => $classes]) }} style="border-radius: 0.375rem;">
@else
    <button 
        type="{{ $type }}" 
        {{ $disabled || $loading ? 'disabled' : '' }}
        {{ $attributes->merge(['class' => $classes]) }}
        style="border-radius: 0.375rem;"
    >
@endif

    @if($loading)
        <span class="lte-spinner lte-spinner-sm" style="margin-right: 0.5rem;"></span>
    @elseif($icon && $iconPosition === 'left')
        <x-dynamic-component :component="$icon" class="{{ $iconSizeClasses }}" />
    @endif

    @if($slot->isNotEmpty())
        <span>{{ $slot }}</span>
    @endif

    @if($icon && $iconPosition === 'right' && !$loading)
        <x-dynamic-component :component="$icon" class="{{ $iconSizeClasses }}" />
    @endif

@if($href)
    </a>
@else
    </button>
@endif