bildirchin/views/pages/product_detail.php

<?php
$pageTitle = $product['name'];
require __DIR__ . '/../layout/header.php';
require __DIR__ . '/../layout/navbar.php';
?>

<div class="bg-stone-100/50 py-4 border-b border-stone-200 text-xs text-stone-500">
    <div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 flex items-center gap-2">
        <a href="/" class="hover:text-amber-600">خانه</a>
        <span>/</span>
        <a href="/products" class="hover:text-amber-600">محصولات</a>
        <span>/</span>
        <a href="/products?cat=<?= $product['category_id'] ?>" class="hover:text-amber-600"><?= htmlspecialchars($product['category_name']) ?></a>
        <span>/</span>
        <span class="text-stone-800 font-bold"><?= htmlspecialchars($product['name']) ?></span>
    </div>
</div>

<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-10">
    <div class="bg-white rounded-3xl border border-stone-200 overflow-hidden shadow-sm p-6 sm:p-10 mb-12">
        <div class="grid grid-cols-1 lg:grid-cols-12 gap-10">
            <!-- Product Image -->
            <div class="lg:col-span-5 flex flex-col items-center justify-center bg-stone-50 rounded-2xl p-6 border border-stone-100">
                <img src="<?= $product['image'] ?>" alt="<?= htmlspecialchars($product['name']) ?>" class="max-h-80 w-auto object-contain">
                <div class="mt-4 flex items-center gap-2 text-xs text-emerald-700 bg-emerald-50 px-3 py-1.5 rounded-full font-bold">
                    <i class="fas fa-check-circle"></i>
                    <span>موجودی در انبار مزرعه: <?= \Bildirchin\Helpers::toPersianDigits($product['stock']) ?> <?= $product['unit'] ?></span>
                </div>
            </div>

            <!-- Product Specs & Purchase -->
            <div class="lg:col-span-7 space-y-6">
                <div>
                    <span class="text-xs font-bold text-amber-600 uppercase tracking-wider block mb-1"><?= htmlspecialchars($product['category_name']) ?></span>
                    <h1 class="text-2xl sm:text-3xl font-extrabold text-stone-900"><?= htmlspecialchars($product['name']) ?></h1>
                    <p class="text-sm text-stone-500 mt-2 leading-relaxed"><?= htmlspecialchars($product['short_desc']) ?></p>
                </div>

                <!-- Price & Wholesale Tiers Table -->
                <div class="bg-stone-50 rounded-2xl p-5 border border-stone-200 space-y-4">
                    <div class="flex items-baseline justify-between">
                        <span class="text-sm text-stone-600 font-medium">قیمت پایه (تکی):</span>
                        <span class="text-2xl font-black text-stone-900"><?= \Bildirchin\Helpers::formatPrice($product['price']) ?> <span class="text-xs font-normal text-stone-500">/ هر <?= $product['unit'] ?></span></span>
                    </div>

                    <?php if ((int)$product['is_wholesale_available'] === 1): ?>
                        <div class="pt-3 border-t border-stone-200">
                            <span class="text-xs font-extrabold text-amber-800 flex items-center gap-1.5 mb-2.5">
                                <i class="fas fa-tags text-amber-600"></i> جدول تخفیف پلکانی عمده‌فروشی:
                            </span>
                            <div class="grid grid-cols-1 sm:grid-cols-2 gap-3 text-xs">
                                <?php if ($product['wholesale_min_qty'] > 0 && $product['wholesale_price'] > 0): ?>
                                    <div class="bg-white p-3 rounded-xl border border-amber-200 flex justify-between items-center shadow-sm">
                                        <div>
                                            <span class="font-bold text-stone-800 block">پله اول (از <?= \Bildirchin\Helpers::toPersianDigits($product['wholesale_min_qty']) ?> <?= $product['unit'] ?>)</span>
                                            <span class="text-[11px] text-emerald-600">سود شما: <?= \Bildirchin\Helpers::formatPrice($product['price'] - $product['wholesale_price']) ?> در هر واحد</span>
                                        </div>
                                        <span class="font-black text-amber-800 text-sm"><?= \Bildirchin\Helpers::formatPrice($product['wholesale_price']) ?></span>
                                    </div>
                                <?php endif; ?>

                                <?php if ($product['wholesale_tier2_qty'] > 0 && $product['wholesale_tier2_price'] > 0): ?>
                                    <div class="bg-white p-3 rounded-xl border border-amber-300 flex justify-between items-center shadow-sm bg-amber-50/40">
                                        <div>
                                            <span class="font-bold text-stone-800 block">پله دوم (از <?= \Bildirchin\Helpers::toPersianDigits($product['wholesale_tier2_qty']) ?> <?= $product['unit'] ?>)</span>
                                            <span class="text-[11px] text-emerald-600">سود شما: <?= \Bildirchin\Helpers::formatPrice($product['price'] - $product['wholesale_tier2_price']) ?> در هر واحد</span>
                                        </div>
                                        <span class="font-black text-amber-900 text-sm"><?= \Bildirchin\Helpers::formatPrice($product['wholesale_tier2_price']) ?></span>
                                    </div>
                                <?php endif; ?>
                            </div>
                        </div>
                    <?php endif; ?>
                </div>

                <!-- Add to Cart Form -->
                <form action="/cart/add" method="POST" class="space-y-4">
                    <input type="hidden" name="product_id" value="<?= $product['id'] ?>">
                    
                    <div class="flex flex-col sm:flex-row items-center gap-4">
                        <div class="flex items-center border border-stone-300 rounded-xl bg-white p-1 w-full sm:w-auto">
                            <button type="button" onclick="changeQty(-1)" class="w-10 h-10 rounded-lg bg-stone-100 hover:bg-stone-200 text-stone-700 flex items-center justify-center font-bold text-lg">-</button>
                            <input type="number" name="quantity" id="prod-quantity" value="1" min="1" max="<?= $product['stock'] ?>" class="w-20 text-center font-bold text-base focus:outline-none">
                            <button type="button" onclick="changeQty(1)" class="w-10 h-10 rounded-lg bg-stone-100 hover:bg-stone-200 text-stone-700 flex items-center justify-center font-bold text-lg">+</button>
                        </div>

                        <button type="submit" class="flex-1 w-full py-3.5 px-6 rounded-xl bg-amber-500 hover:bg-amber-600 text-stone-950 font-extrabold text-sm transition flex items-center justify-center gap-2 shadow-md">
                            <i class="fas fa-shopping-basket"></i>
                            <span>افزودن به سبد خرید</span>
                        </button>
                    </div>
                </form>

                <!-- Features list -->
                <div class="grid grid-cols-2 gap-3 pt-4 border-t border-stone-100 text-xs text-stone-600">
                    <div class="flex items-center gap-2"><i class="fas fa-truck text-amber-500"></i> ارسال فوری از سالن تولید</div>
                    <div class="flex items-center gap-2"><i class="fas fa-shield-alt text-emerald-500"></i> ضمانت کیفیت و سلامت کالا</div>
                    <div class="flex items-center gap-2"><i class="fas fa-receipt text-sky-500"></i> صدور فاکتور معتبر و رسمی</div>
                    <div class="flex items-center gap-2"><i class="fas fa-phone-volume text-rose-500"></i> مشاوره تخصصی قبل از خرید</div>
                </div>
            </div>
        </div>

        <!-- Full Description & Tabs -->
        <div class="mt-12 pt-8 border-t border-stone-200">
            <h3 class="text-xl font-bold text-stone-900 mb-4 flex items-center gap-2">
                <i class="fas fa-circle-info text-amber-600"></i> توضیحات و مشخصات فنی محصول
            </h3>
            <div class="prose max-w-none text-sm text-stone-600 leading-loose space-y-4">
                <?= nl2br(htmlspecialchars($product['full_desc'] ?: $product['short_desc'])) ?>
            </div>
        </div>
    </div>
</div>

<script>
    function changeQty(delta) {
        const input = document.getElementById('prod-quantity');
        let val = parseInt(input.value) || 1;
        val += delta;
        if (val < 1) val = 1;
        input.value = val;
    }
</script>

<?php
require __DIR__ . '/../layout/footer.php';
?>