{{--
Primary Button — semantic brand tokens (no legacy CSS classes).
--}}
@props([
'type' => 'button',
'size' => 'md',
'href' => null,
'icon' => null,
'loading' => false,
])
@php
$size = in_array($size, ['sm', 'md', 'lg'], true) ? $size : 'md';
$base = 'inline-flex cursor-pointer select-none items-center justify-center font-medium transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background disabled:pointer-events-none disabled:opacity-60';
$sizeClass = match ($size) {
'sm' => 'gap-1.5 rounded-md px-2.5 py-1.5 text-2xs [&_svg]:size-3.5 sm:gap-2 sm:px-3 sm:py-1.5 sm:text-xs sm:[&_svg]:size-4',
'lg' => 'gap-2 rounded-lg px-4 py-2.5 text-sm [&_svg]:size-4 sm:gap-2.5 sm:rounded-xl sm:px-5 sm:py-3 sm:text-base sm:[&_svg]:size-5 md:px-6 md:py-3.5',
default => 'gap-2 rounded-lg px-3.5 py-2 text-xs [&_svg]:size-4 sm:px-4 sm:py-2 sm:text-sm',
};
$tone = 'bg-brand text-brand-foreground shadow-sm hover:bg-brand/90 active:bg-brand/80 dark:focus:ring-offset-background';
$classes = trim("$base $sizeClass $tone");
@endphp
@if($href)
merge(['class' => $classes]) }}>
@if($icon && !$loading)
{!! $icon !!}
@endif
@if($loading)
@endif
{{ $slot }}
@else
@endif