<?php
use Livewire\Component;
use App\Models\Product;
use App\Models\ProductVariant;
use App\Services\CartManager;
?>

<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-12">
    <!-- Breadcrumbs -->
    <div class="mb-6 text-xs text-gray-500 flex items-center space-x-2">
        <a href="/" class="hover:text-indigo-650 transition-colors">Home</a>
        <span>/</span>
        <a href="/shop" class="hover:text-indigo-650 transition-colors">Shop</a>
        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->category): ?>
            <span>/</span>
            <a href="/shop?categorySlug=<?php echo e($product->category->slug); ?>" class="hover:text-indigo-650 transition-colors"><?php echo e($product->category->name); ?></a>
        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        <span>/</span>
        <span class="font-semibold text-gray-805 truncate max-w-xs"><?php echo e($product->name); ?></span>
    </div>

    <div class="grid grid-cols-1 md:grid-cols-2 gap-10">
        
        <!-- Left: Image Gallery -->
        <div class="space-y-4">
            <!-- Large Active Image -->
            <div class="aspect-square bg-white rounded-3xl overflow-hidden border border-gray-100 shadow-sm/5 relative group">
                <img 
                    src="<?php echo e($activeImage); ?>" 
                    alt="<?php echo e($product->name); ?>" 
                    class="w-full h-full object-cover hover:scale-110 transition-transform duration-500 cursor-zoom-in"
                    id="zoom-image"
                    loading="lazy"
                >
            </div>
            
            <!-- Thumbnail selection list -->
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(count($gallery) > 1): ?>
                <div class="flex items-center space-x-3 overflow-x-auto py-2">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = $gallery; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $imgUrl): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                        <button 
                            wire:click="setImage('<?php echo e($imgUrl); ?>')"
                            class="w-20 h-20 bg-white border rounded-2xl overflow-hidden flex-shrink-0 relative focus:outline-none transition-all <?php echo e($activeImage === $imgUrl ? 'border-indigo-600 ring-2 ring-indigo-50' : 'border-gray-200 hover:border-gray-400'); ?>"
                        >
                            <img src="<?php echo e($imgUrl); ?>" class="w-full h-full object-cover" alt="thumbnail">
                        </button>
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
        </div>

        <!-- Right: Metadata and Controls -->
        <div class="flex flex-col space-y-6">
            <!-- Tags category and brand -->
            <div class="space-y-1">
                <p class="text-xs font-bold text-indigo-600 uppercase tracking-widest">
                    <?php echo e($product->category?->name ?? 'Uncategorized'); ?>

                </p>
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->brand): ?>
                    <p class="text-sm font-semibold text-gray-500">
                        Brand: <span class="text-gray-900 font-bold"><?php echo e($product->brand->name); ?></span>
                    </p>
                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                <h1 class="text-2xl sm:text-3xl font-extrabold text-gray-900 tracking-tight mt-1">
                    <?php echo e($product->name); ?>

                </h1>
                <p class="text-xs text-gray-400 mt-1">SKU: <span class="font-mono"><?php echo e($activeSku); ?></span></p>
            </div>

            <!-- Price display -->
            <div class="p-5 bg-indigo-50/50 border border-indigo-100/50 rounded-2xl flex items-center justify-between">
                <div>
                    <span class="text-xs font-semibold text-gray-500 block">Total Price</span>
                    <div class="flex items-baseline space-x-2 mt-1">
                        <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($activeSalePrice): ?>
                            <span class="text-2xl sm:text-3xl font-black text-indigo-600">
                                ৳<?php echo e(number_format($activeSalePrice, 2)); ?>

                            </span>
                            <span class="text-sm sm:text-base text-gray-400 line-through">
                                ৳<?php echo e(number_format($activePrice, 2)); ?>

                            </span>
                        <?php else: ?>
                            <span class="text-2xl sm:text-3xl font-black text-indigo-600">
                                ৳<?php echo e(number_format($activePrice, 2)); ?>

                            </span>
                        <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                    </div>
                </div>

                <!-- Stock availability badge -->
                <div>
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($activeStock <= 0): ?>
                        <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-red-150 text-red-800">
                            Out of Stock
                        </span>
                    <?php elseif($activeStock <= 5): ?>
                        <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-yellow-100 text-yellow-800">
                            Only <?php echo e($activeStock); ?> items left
                        </span>
                    <?php else: ?>
                        <span class="inline-flex items-center px-3 py-1 rounded-full text-xs font-bold bg-emerald-100 text-emerald-800">
                            In Stock
                        </span>
                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </div>
            </div>

            <!-- Option Swatches for selection (Color, Size etc) -->
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(!empty($variantOptions)): ?>
                <div class="space-y-4 border-t border-b border-gray-100 py-6">
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = $variantOptions; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $key => $values): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                        <div class="space-y-2">
                            <span class="text-xs font-bold text-gray-700 uppercase tracking-wider block">
                                Select <?php echo e($key); ?>

                            </span>
                            <div class="flex flex-wrap gap-3">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = $values; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $val): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(strtolower($key) === 'color'): ?>
                                        <!-- Color Swatch Circle -->
                                        <button 
                                            wire:click="selectOption('<?php echo e($key); ?>', '<?php echo e($val); ?>')"
                                            class="w-10 h-10 rounded-full border-2 transition-all focus:outline-none relative <?php echo e($selectedOptions[$key] === $val ? 'border-indigo-600 ring-2 ring-indigo-50 scale-105 shadow-sm' : 'border-gray-200 hover:border-gray-400'); ?>"
                                            style="background-color: <?php echo e(strtolower($val)); ?>;"
                                            title="<?php echo e($val); ?>"
                                        >
                                            <span class="sr-only"><?php echo e($val); ?></span>
                                            <!-- Check icon inside color if selected -->
                                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($selectedOptions[$key] === $val): ?>
                                                <span class="absolute inset-0 flex items-center justify-center text-white mix-blend-difference">
                                                    <svg class="h-4 w-4" fill="none" viewBox="0 0 24 24" stroke="currentColor" stroke-width="3">
                                                        <path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />
                                                    </svg>
                                                </span>
                                            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                        </button>
                                    <?php else: ?>
                                        <!-- Bordered Pill (e.g. for Size) -->
                                        <button 
                                            wire:click="selectOption('<?php echo e($key); ?>', '<?php echo e($val); ?>')"
                                            class="px-4 py-2 border rounded-xl text-sm font-semibold transition-all focus:outline-none <?php echo e($selectedOptions[$key] === $val ? 'border-indigo-600 bg-indigo-50 text-indigo-700 font-bold' : 'border-gray-200 text-gray-700 hover:border-gray-450 hover:bg-gray-50'); ?>"
                                        >
                                            <?php echo e($val); ?>

                                        </button>
                                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
                            </div>
                        </div>
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
                    
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->variants->isNotEmpty() && !$selectedVariant): ?>
                        <p class="text-xs text-red-500 font-medium">Selected combination is not available.</p>
                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

            <!-- Description -->
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->short_description): ?>
                <div class="space-y-2 text-sm text-gray-650 leading-relaxed">
                    <h3 class="text-xs font-bold text-gray-900 uppercase tracking-wider">Short description</h3>
                    <p><?php echo e($product->short_description); ?></p>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

            <!-- Add to Cart controls -->
            <div class="flex flex-col sm:flex-row items-stretch sm:items-center gap-4 pt-4">
                <!-- Quantity selector spinner -->
                <div class="flex items-center justify-between border border-gray-250 rounded-xl bg-gray-50 p-1 min-w-32">
                    <button 
                        wire:click="decrementQty"
                        class="h-10 w-10 text-gray-650 hover:bg-white rounded-lg flex items-center justify-center font-bold"
                    >-</button>
                    <span class="text-sm font-bold text-gray-900 px-4"><?php echo e($quantity); ?></span>
                    <button 
                        wire:click="incrementQty"
                        class="h-10 w-10 text-gray-650 hover:bg-white rounded-lg flex items-center justify-center font-bold"
                    >+</button>
                </div>

                <!-- Action Add button -->
                <button 
                    wire:click="addToCart"
                    <?php if($activeStock <= 0 || ($product->variants->isNotEmpty() && !$selectedVariant)): ?> disabled <?php endif; ?>
                    class="flex-grow flex items-center justify-center px-6 py-3.5 bg-indigo-600 hover:bg-indigo-650 disabled:bg-gray-200 disabled:text-gray-400 text-white text-sm font-bold rounded-xl shadow-md transition-colors text-center"
                >
                    <svg class="h-5 w-5 mr-2" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M16 11V7a4 4 0 00-8 0v4M5 9h14l1 12H4L5 9z" />
                    </svg>
                    Add to Cart
                </button>

                <!-- Wishlist Toggle Button -->
                <button 
                    wire:click="toggleWishlist"
                    class="p-3.5 border border-gray-250 rounded-xl text-gray-600 hover:text-red-500 hover:border-red-500 bg-white flex items-center justify-center transition-colors shadow-sm"
                    title="Toggle Wishlist"
                >
                    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if(auth()->check() && auth()->user()->wishlistProducts->contains($product->id)): ?>
                        <svg class="h-6 w-6 text-red-500 fill-current" viewBox="0 0 24 24">
                            <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
                        </svg>
                    <?php else: ?>
                        <svg class="h-6 w-6 fill-none stroke-current stroke-2" viewBox="0 0 24 24">
                            <path d="M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z"/>
                        </svg>
                    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                </button>
            </div>
            
            <!-- Long Description Details tab -->
            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($product->description): ?>
                <div class="border-t border-gray-100 pt-6 space-y-3">
                    <h3 class="text-xs font-bold text-gray-900 uppercase tracking-wider">Product Specifications</h3>
                    <div class="text-sm text-gray-650 prose leading-relaxed max-w-none">
                        <?php echo nl2br(e($product->description)); ?>

                    </div>
                </div>
            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>

        </div>

    </div>

    <!-- Social Share buttons -->
    <div class="border-t border-gray-150 mt-10 pt-6 space-y-3">
        <span class="text-xs font-bold text-gray-400 uppercase tracking-wider block">Share Product</span>
        <div class="flex items-center space-x-2">
            <!-- Facebook -->
            <a 
                href="https://www.facebook.com/sharer/sharer.php?u=<?php echo e(urlencode(request()->url())); ?>" 
                target="_blank" 
                class="p-2 border border-gray-200 rounded-lg hover:bg-blue-50 text-blue-600 hover:border-blue-400 transition-colors flex items-center space-x-2 text-xs font-semibold"
            >
                <svg class="h-4.5 w-4.5 fill-current" viewBox="0 0 24 24">
                    <path d="M22 12c0-5.52-4.48-10-10-10S2 6.48 2 12c0 4.84 3.44 8.87 8 9.8V15H8v-3h2V9.5C10 7.57 11.57 6 13.5 6H16v3h-2c-.55 0-1 .45-1 1v2h3v3h-3v6.95c4.56-.93 8-4.96 8-9.75z"/>
                </svg>
                <span>Facebook</span>
            </a>
            
            <!-- WhatsApp -->
            <a 
                href="https://api.whatsapp.com/send?text=<?php echo e(urlencode($product->name . ' - ' . request()->url())); ?>" 
                target="_blank" 
                class="p-2 border border-gray-200 rounded-lg hover:bg-green-50 text-green-600 hover:border-green-400 transition-colors flex items-center space-x-2 text-xs font-semibold"
            >
                <svg class="h-4.5 w-4.5 fill-current" viewBox="0 0 24 24">
                    <path d="M12.01 2.01C6.48 2.01 2 6.48 2 12c0 2.13.67 4.1 1.82 5.72l-1.19 4.35 4.47-1.17c1.55.85 3.33 1.33 5.22 1.33 5.53 0 10.01-4.48 10.01-10s-4.48-9.99-10.01-9.99zM12 21.08c-1.74 0-3.37-.47-4.78-1.29l-.34-.2-2.65.69.71-2.58-.22-.35A8.04 8.04 0 0 1 4 12c0-4.45 3.63-8.08 8.08-8.08s8.08 3.63 8.08 8.08-3.63 8.08-8.08 8.08zm4.61-4.88c-.25-.13-1.47-.72-1.7-.8-.23-.08-.39-.13-.56.12-.17.25-.64.8-.78.96-.14.17-.29.19-.54.06-.25-.13-1.07-.39-2.03-1.25-.74-.66-1.25-1.48-1.39-1.73-.14-.25-.02-.38.11-.5.12-.11.25-.29.37-.43.12-.14.17-.24.25-.4.08-.17.04-.31-.02-.43-.06-.13-.56-1.35-.77-1.85-.2-.5-.4-.43-.56-.44h-.48c-.17 0-.44.06-.67.31-.23.25-.88.86-.88 2.1s.9 2.43 1.02 2.6c.12.17 1.77 2.7 4.29 3.8 2.52 1.1 2.52.73 2.97.69.45-.04 1.47-.6 1.68-1.18.21-.58.21-1.08.15-1.18-.07-.1-.23-.18-.48-.31z"/>
                </svg>
                <span>WhatsApp</span>
            </a>

            <!-- Copy Link -->
            <button 
                x-data="{ copied: false }"
                @click="navigator.clipboard.writeText('<?php echo e(request()->url()); ?>'); copied = true; setTimeout(() => copied = false, 2000)"
                class="p-2 border border-gray-200 rounded-lg hover:bg-gray-50 text-gray-650 hover:border-gray-400 transition-colors flex items-center space-x-2 text-xs font-semibold"
            >
                <svg class="h-4.5 w-4.5 fill-none stroke-current stroke-2" viewBox="0 0 24 24">
                    <path d="M8 16H6a2 2 0 01-2-2V6a2 2 0 012-2h8a2 2 0 012 2v2m-6 12h8a2 2 0 002-2v-8a2 2 0 00-2-2h-8a2 2 0 00-2 2v8a2 2 0 002 2z"/>
                </svg>
                <span x-text="copied ? 'Copied!' : 'Copy Link'">Copy Link</span>
            </button>
        </div>
    </div>

    <!-- Related Products -->
    <?php $related = $this->getRelatedProducts(); ?>
    <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($related->isNotEmpty()): ?>
        <div class="border-t border-gray-150 mt-16 pt-12">
            <h2 class="text-xl sm:text-2xl font-black text-gray-900 mb-8">Related Products</h2>
            <div class="grid grid-cols-1 sm:grid-cols-2 md:grid-cols-4 gap-6">
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::openLoop(); ?><?php endif; ?><?php $__currentLoopData = $related; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $relProduct): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::startLoopIteration(); ?><?php endif; ?>
                    <div class="bg-white rounded-2xl border border-gray-100 shadow-sm/5 overflow-hidden group flex flex-col hover:shadow-md transition-shadow relative">
                        <a href="/products/<?php echo e($relProduct->id); ?>" class="block relative aspect-square overflow-hidden bg-gray-50 flex-shrink-0">
                            <img 
                                src="<?php echo e($relProduct->getFirstMediaUrl('images', 'webp') ?: ($relProduct->getFirstMediaUrl('images') ?: '/images/placeholder.jpg')); ?>" 
                                alt="<?php echo e($relProduct->name); ?>" 
                                class="w-full h-full object-cover group-hover:scale-105 transition-transform duration-300"
                                loading="lazy"
                            >
                            <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($relProduct->sale_price): ?>
                                <span class="absolute top-3 left-3 bg-red-500 text-white text-xs font-bold px-2 py-1 rounded-lg">
                                    Sale
                                </span>
                            <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                        </a>
                        <div class="p-4 flex-grow flex flex-col">
                            <p class="text-xs font-semibold text-gray-400 uppercase tracking-wider">
                                <?php echo e($relProduct->category?->name ?? 'Uncategorized'); ?>

                            </p>
                            <h3 class="text-sm font-bold text-gray-900 line-clamp-1 mt-1 hover:text-indigo-650">
                                <a href="/products/<?php echo e($relProduct->id); ?>"><?php echo e($relProduct->name); ?></a>
                            </h3>
                            <div class="flex items-center space-x-2 mt-2">
                                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if BLOCK]><![endif]--><?php endif; ?><?php if($relProduct->sale_price): ?>
                                    <span class="text-sm font-extrabold text-indigo-600">
                                        ৳<?php echo e(number_format($relProduct->sale_price, 2)); ?>

                                    </span>
                                    <span class="text-xs text-gray-400 line-through">
                                        ৳<?php echo e(number_format($relProduct->price, 2)); ?>

                                    </span>
                                <?php else: ?>
                                    <span class="text-sm font-extrabold text-indigo-600">
                                        ৳<?php echo e(number_format($relProduct->price, 2)); ?>

                                    </span>
                                <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
                            </div>
                        </div>
                    </div>
                <?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::endLoop(); ?><?php endif; ?><?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php \Livewire\Features\SupportCompiledWireKeys\SupportCompiledWireKeys::closeLoop(); ?><?php endif; ?>
            </div>
        </div>
    <?php endif; ?><?php if(\Livewire\Mechanisms\ExtendBlade\ExtendBlade::isRenderingLivewireComponent()): ?><!--[if ENDBLOCK]><![endif]--><?php endif; ?>
</div><?php /**PATH C:\laragon\www\Sawdabazar\storage\framework\views-testing/livewire/views/87f18cfa.blade.php ENDPATH**/ ?>