@php

    $layout        = $layout ?? 'grid';

    $showRating    = $showRating ?? false;

    $currentPrice  = $product->sale_price ?? $product->price;

    $originalPrice = $product->price;

    $hasDiscount   = $product->sale_price && $product->sale_price < $product->price;

    $discountPct   = $hasDiscount ? round((($originalPrice - $currentPrice) / $originalPrice) * 100) : 0;

    $avgRating     = $product->avg_rating ?? 0;

    $reviewCount   = (int) ($product->reviews_count ?? 0);

    $gridContext   = $gridContext ?? 'home';
    $gridColClass  = \App\Services\ProductItemSettingsService::gridColClass($gridContext);
    $imageFitClass = \App\Services\ProductItemSettingsService::imageFitClass($gridContext);
    $showCartIcon  = \App\Services\ProductItemSettingsService::showAddToCartIcon();

@endphp

@if($layout === 'carousel')

<div class="prod-carousel-item d-flex">

@else

<div class="{{ $gridColClass }} d-flex">

@endif

    <div class="prod-card prod-card--neemba">

        <div class="prod-card-img {{ $imageFitClass }}" data-prod-zoom>

            <a href="{{ route('frontend.product', $product->slug) }}">

                @if($product->thumbnail)

                    <img src="{{ asset($product->thumbnail) }}" alt="{{ $product->thumbnailAlt() }}" title="{{ $product->thumbnailTitle() }}" loading="lazy" decoding="async" fetchpriority="low">

                @else

                    <div class="prod-card-img-empty">

                        <i class="fas fa-image fa-3x text-muted opacity-50"></i>

                    </div>

                @endif

            </a>

            <span class="prod-zoom-tap-hint" aria-hidden="true"><i class="fas fa-search-plus"></i></span>

            @if($hasDiscount)

            <span class="prod-badge prod-badge--neemba">{{ $discountPct }} % Off</span>

            @endif

            @if($product->is_new_arrival ?? false)

            <span class="prod-badge-new prod-badge-new--neemba">NEW</span>

            @endif

            <button type="button" class="prod-wishlist prod-wishlist--neemba" onclick="addWishlist({{ $product->id }}, this)" data-name="{{ e($product->name) }}" data-price="{{ $product->effective_price }}" title="Wishlist" aria-label="Add to wishlist">

                <i class="far fa-heart"></i>

            </button>

        </div>



        <div class="prod-card-body prod-card-body--neemba">

            @if($showRating && $avgRating > 0)

            <div class="prod-rating">

                @for($i = 1; $i <= 5; $i++)

                <i class="fas fa-star{{ $i > round($avgRating) ? '-o' : '' }}"></i>

                @endfor

                <span>({{ $reviewCount }})</span>

            </div>

            @endif



            <a href="{{ route('frontend.product', $product->slug) }}" class="prod-name prod-name--neemba d-block text-decoration-none">

                {{ $product->name }}

            </a>



            <div class="prod-price-row prod-price-row--neemba">

                @if($hasDiscount)

                <span class="prod-old-price">৳{{ number_format($originalPrice) }}</span>

                @endif

                <span class="prod-price">৳{{ number_format($currentPrice) }}</span>

            </div>



            <div class="prod-card-actions prod-card-actions--neemba d-flex gap-2{{ $showCartIcon ? '' : ' prod-card-actions--full' }}">

                <button type="button" class="btn-buy {{ $showCartIcon ? 'flex-grow-1' : 'w-100' }}" onclick="buyNow({{ $product->id }}, '{{ addslashes($product->name) }}', this, { hasVariants: @json($product->hasActiveVariants()) })">

                    <i class="fas fa-bag-shopping me-1"></i>Buy Now

                </button>

                @if($showCartIcon)
                <button type="button" class="btn-buy btn-buy-icon"

                    onclick="@if($product->hasActiveVariants())window.location.href='{{ route('frontend.product', $product->slug) }}'@else addToCart({{ $product->id }}, '{{ addslashes($product->name) }}', this)@endif"

                    title="Add to Cart" aria-label="Add to cart">

                    <i class="fas fa-cart-shopping"></i>

                </button>
                @endif

            </div>

        </div>

    </div>

</div>