@props(['product'])

@php
    $startingPrice = $product->startingPrice();
    $onSale = $product->variants->contains(fn ($variant) => $variant->is_active && $variant->isOnSale());
@endphp

<article {{ $attributes->class('group') }}>
    <a href="{{ route('shop.product', [$product->category, $product]) }}" class="block">
        <div class="relative">
            <x-photo :src="$product->image ? Storage::disk('public')->url($product->image) : null" :alt="$product->name" class="aspect-[4/5]" />
            <div class="absolute top-4 left-4 flex flex-col items-start gap-2">
                @if ($onSale)
                    <span class="kicker bg-rouge px-3 py-1.5 text-[0.58rem] text-ivoire">Prix doux</span>
                @endif
                @if ($product->pickup_only)
                    <span class="kicker bg-encre px-3 py-1.5 text-[0.58rem] text-ivoire">Au magasin</span>
                @endif
            </div>
        </div>
        <div class="mt-6 flex items-start justify-between gap-4">
            <div>
                <h3 class="font-serif text-2xl leading-tight transition-colors group-hover:text-rouge">{{ $product->name }}</h3>
                @if ($product->variants->count() > 1)
                    <p class="mt-2 text-sm text-gris">{{ $product->variants->count() }} choix · {{ Str::lower($product->variant_label ?? 'déclinaisons') }}</p>
                @elseif ($product->short_description)
                    <p class="mt-2 line-clamp-2 text-sm text-gris">{{ $product->short_description }}</p>
                @endif
            </div>
            @if ($startingPrice !== null)
                <p class="shrink-0 text-right tabular-nums">
                    <span class="kicker block text-[0.58rem] text-gris">{{ $product->variants->count() > 1 ? 'Dès' : 'Prix' }}</span>
                    {{ App\Support\Money::format($startingPrice) }}
                </p>
            @endif
        </div>
    </a>
</article>