@props([
    'type' => 'button',
    'variant' => 'primary',
])

@php
    $baseClasses = 'inline-flex items-center justify-center rounded-2xl px-4 py-3 text-base font-semibold transition focus:outline-none focus:ring-4';
    $variantClasses = match ($variant) {
        'secondary' => 'border border-slate-200 bg-white text-slate-700 shadow-theme-xs hover:bg-slate-50 focus:ring-slate-200',
        default => 'bg-brand-500 text-white shadow-theme-xs hover:bg-brand-600 focus:ring-brand-500/20',
    };
@endphp

<button type="{{ $type }}" {{ $attributes->merge(['class' => $baseClasses.' '.$variantClasses]) }}>
    {{ $slot }}
</button>