@props(['product'])

<a href="{{ route('products.show', ['locale' => app()->getLocale(), 'category' => $product->category->slug, 'product' => $product->slug]) }}"
   data-reveal
   class="card group flex flex-col overflow-hidden transition-transform hover:-translate-y-1"
   {{ $attributes }}>
    <div class="relative flex h-52 items-center justify-center bg-brand-green-50 overflow-hidden">
        @if ($product->coverImageUrl())
            <img src="{{ $product->coverImageUrl() }}" alt="{{ $product->name }}" class="h-full w-full object-cover transition duration-500 group-hover:scale-105">
        @else
            <div class="flex flex-col items-center gap-2 text-brand-green-800/40">
                <img src="{{ asset('images/logo-footer.png') }}" alt="" class="h-10 w-auto opacity-40">
                <span class="text-xs font-semibold uppercase tracking-wide">{{ config('site.brand.product_line') }}</span>
            </div>
        @endif
        @if ($product->isOnOffer())
            <span class="absolute left-3 top-3 rounded-full bg-accent-liver px-3 py-1 text-xs font-bold text-white shadow">
                OFFER
            </span>
        @endif
    </div>
    <div class="flex flex-1 flex-col p-5">
        <span class="text-xs font-bold uppercase tracking-wide text-brand-green-700">{{ $product->category->name }}</span>
        <h3 class="mt-1 text-base font-bold text-brand-ink group-hover:text-brand-green-800">{{ $product->name }}</h3>
        @if ($product->short_description)
            <p class="mt-1.5 line-clamp-2 text-sm text-brand-ink/60">{{ $product->short_description }}</p>
        @endif
        <div class="mt-4 flex items-center justify-between">
            <span class="text-sm font-bold text-brand-green-800">
                @if ($product->hasPrice())
                    ₹{{ number_format((float) $product->price, 2) }}
                    @if ($product->isOnOffer())
                        <span class="ml-1 text-xs font-normal text-brand-ink/40 line-through">₹{{ number_format((float) $product->mrp, 2) }}</span>
                    @endif
                @else
                    {{ __('site.product_price_on_request') }}
                @endif
            </span>
            @if ($product->unit_label)
                <span class="text-xs text-brand-ink/50">{{ $product->unit_label }}</span>
            @endif
        </div>
    </div>
</a>