@props(['coupon', 'claimed' => false, 'compact' => false])

@auth
<form method="POST" action="{{ route('vouchers.claim', $coupon->code) }}" data-voucher-claim-form data-voucher-code="{{ $coupon->code }}">
    @csrf
    <button
        type="submit"
        data-voucher-claim-button
        @disabled($claimed)
        class="inline-flex items-center justify-center rounded-xl font-extrabold transition {{ $compact ? 'min-w-16 px-3 py-2 text-[9px]' : 'h-11 min-w-28 px-5 text-xs' }} {{ $claimed ? 'cursor-default bg-mint-50 text-mint-600' : 'bg-ocean-800 text-white shadow-sm hover:bg-ocean-700' }}"
    >{{ $claimed ? 'Diklaim' : 'Klaim' }}</button>
</form>
@else
<a href="{{ route('login') }}" class="inline-flex items-center justify-center rounded-xl bg-ocean-800 font-extrabold text-white shadow-sm {{ $compact ? 'min-w-16 px-3 py-2 text-[9px]' : 'h-11 min-w-28 px-5 text-xs' }}">Klaim</a>
@endauth