@props(['variant' => 'primary', 'size' => 'md', 'type' => 'button', 'href' => null])

@php
$classes = [
    'primary' => 'bg-primary text-white hover:bg-primary-600 focus:ring-primary-500',
    'secondary' => 'bg-gray-200 text-gray-900 hover:bg-gray-300 focus:ring-gray-500 dark:bg-gray-600 dark:text-white dark:hover:bg-gray-700',
    'danger' => 'bg-red-600 text-white hover:bg-red-700 focus:ring-red-500',
    'link' => 'text-red-600 hover:text-red-800 dark:text-red-400'
][$variant];

$sizes = [
    'sm' => 'px-4 py-2 text-sm',
    'md' => 'px-4 py-2 text-sm',
    'lg' => 'px-4 py-2',
    'none' => ''
][$size];

$baseClasses = "inline-flex items-center justify-center rounded-md font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-offset-2 disabled:opacity-50 disabled:cursor-not-allowed disabled:bg-gray-300 disabled:text-gray-500 dark:disabled:bg-gray-700 dark:disabled:text-gray-400 $classes $sizes";
@endphp

@if($href)
    <a href="{{ $href }}" {{ $attributes->merge(['class' => $baseClasses]) }}>
        {{ $slot }}
    </a>
@else
    <button type="{{ $type }}" {{ $attributes->merge(['class' => $baseClasses]) }}>
        {{ $slot }}
    </button>
@endif