<?php
require_once 'config/database.php';
require_once 'config/settings.php';
require_once 'includes/auth.php';
require_once 'includes/functions.php';

$pageTitle = 'کیف‌لند | فروشگاه تخصصی کیف و ساک';
$settings  = SiteSettings::getInstance();
$db        = Database::getInstance()->getConnection();
Auth::trackVisit('home');

try {
    $stmt = $db->prepare("SELECT p.*, c.name as category_name, c.slug as category_slug FROM products p LEFT JOIN categories c ON p.category_id = c.id WHERE p.is_featured = 1 AND p.is_active = 1 ORDER BY p.created_at DESC LIMIT 10");
    $stmt->execute(); $featuredProducts = $stmt->fetchAll();
} catch (Exception $e) { $featuredProducts = []; }

try {
    $categories = $db->query("SELECT * FROM categories WHERE is_active = 1 ORDER BY sort_order ASC LIMIT 8")->fetchAll();
} catch (Exception $e) { $categories = []; }

try {
    $stmt = $db->prepare("SELECT p.*, c.name as category_name, c.slug as category_slug FROM products p LEFT JOIN categories c ON p.category_id = c.id WHERE p.is_active = 1 ORDER BY p.created_at DESC LIMIT 10");
    $stmt->execute(); $newProducts = $stmt->fetchAll();
} catch (Exception $e) { $newProducts = []; }

try {
    $stmt = $db->prepare("SELECT p.*, c.name as category_name FROM products p LEFT JOIN categories c ON p.category_id = c.id WHERE p.is_active = 1 ORDER BY p.sales_count DESC LIMIT 10");
    $stmt->execute(); $topProducts = $stmt->fetchAll();
} catch (Exception $e) { $topProducts = []; }

try {
    $stmt = $db->prepare("SELECT p.*, c.name as category_name FROM products p LEFT JOIN categories c ON p.category_id = c.id WHERE p.is_active = 1 AND p.discount_price IS NOT NULL AND p.discount_price > 0 ORDER BY (p.price - p.discount_price) DESC LIMIT 10");
    $stmt->execute(); $saleProducts = $stmt->fetchAll();
} catch (Exception $e) { $saleProducts = []; }

// محصولات بر اساس هر دسته‌بندی (برای ردیف‌های جداگانه)
$categoryRows = [];
try {
    $cats = $db->query("SELECT * FROM categories WHERE is_active=1 ORDER BY sort_order ASC LIMIT 6")->fetchAll();
    foreach($cats as $cat) {
        $s = $db->prepare("SELECT p.*, c.name as category_name, c.slug as category_slug FROM products p LEFT JOIN categories c ON p.category_id=c.id WHERE p.is_active=1 AND p.category_id=? ORDER BY p.sales_count DESC, p.created_at DESC LIMIT 10");
        $s->execute([$cat['id']]);
        $prods = $s->fetchAll();
        if(count($prods) >= 2) {
            $categoryRows[] = ['cat' => $cat, 'products' => $prods];
        }
    }
} catch(Exception $e) { $categoryRows = []; }

include 'includes/header.php';
?>

<!-- نوار اعلان -->
<div class="announce-bar">
    <div class="announce-inner">
        <span>🎁 اولین خرید با کد <strong>WELCOME10</strong> — ۱۰٪ تخفیف</span>
        <span class="adiv">|</span>
        <span>🚚 ارسال رایگان بالای <?= number_format($settings->get('free_shipping_threshold',2000000)/1000) ?>K تومان</span>
        <span class="adiv">|</span>
        <span>⭐ گارانتی اصالت کالا</span>
        <span class="adiv">|</span>
        <span>🎁 اولین خرید با کد <strong>WELCOME10</strong> — ۱۰٪ تخفیف</span>
        <span class="adiv">|</span>
        <span>🚚 ارسال رایگان بالای <?= number_format($settings->get('free_shipping_threshold',2000000)/1000) ?>K تومان</span>
    </div>
</div>

<!-- اسلایدر اصلی -->
<div class="hero-slider" id="heroSlider">
    <div class="hs-track" id="hsTrack">
        <div class="hs-slide" style="background:linear-gradient(135deg,#13072e,#2e1065);">
            <div class="hs-content">
                <span class="hs-tag">کلکسیون جدید ۱۴۰۴</span>
                <h2>کیف‌های لوکس<br>و باکیفیت</h2>
                <p>مستقیم از کارخانه، با بهترین قیمت</p>
                <a href="products.php" class="hs-btn">مشاهده محصولات <i class="fas fa-arrow-left"></i></a>
            </div>
            <div class="hs-emoji">👜</div>
        </div>
        <div class="hs-slide" style="background:linear-gradient(135deg,#1a0d2e,#2e1069);">
            <div class="hs-content">
                <span class="hs-tag" style="background:rgba(239,68,68,0.2);color:#f87171;">تخفیف ویژه</span>
                <h2>تا ۵۰٪<br>تخفیف روی کیف‌ها</h2>
                <p>فقط برای مدت محدود</p>
                <a href="products.php?sort=price_asc" class="hs-btn" style="background:#ef4444;">خرید کنید <i class="fas fa-tag"></i></a>
            </div>
            <div class="hs-emoji">🎒</div>
        </div>
        <div class="hs-slide" style="background:linear-gradient(135deg,#0d0720,#1a1040);">
            <div class="hs-content">
                <span class="hs-tag" style="background:rgba(245,158,11,0.2);color:#fbbf24;">کیف اداری</span>
                <h2>استایل حرفه‌ای<br>در محیط کار</h2>
                <p>کیف‌های اداری و لپ‌تاپ</p>
                <a href="products.php" class="hs-btn" style="background:#f59e0b;color:#000;">مشاهده <i class="fas fa-briefcase"></i></a>
            </div>
            <div class="hs-emoji">💼</div>
        </div>
    </div>
    <div class="hs-dots">
        <span class="hs-dot active" onclick="sliderGoTo(0)"></span>
        <span class="hs-dot" onclick="sliderGoTo(1)"></span>
        <span class="hs-dot" onclick="sliderGoTo(2)"></span>
    </div>
</div>

<!-- دسته‌بندی‌های افقی -->
<section class="home-sec">
    <div class="sec-head"><h2>دسته‌بندی‌ها</h2><a href="products.php">همه <i class="fas fa-chevron-left"></i></a></div>
    <div class="scroll-row">
        <a href="products.php" class="cat-chip active"><span>🛍️</span> همه</a>
        <?php foreach($categories as $cat): ?>
        <a href="products.php?category=<?= htmlspecialchars($cat['slug']) ?>" class="cat-chip">
            <i class="fas <?= htmlspecialchars($cat['icon']??'fa-box') ?>"></i>
            <?= htmlspecialchars($cat['name']) ?>
        </a>
        <?php endforeach; ?>
    </div>
</section>

<?php
// تابع render ردیف محصولات
function renderProductRow($products, $title, $link = 'products.php', $tagColor = '') {
    if(empty($products)) return;
    echo '<section class="home-sec">';
    echo '<div class="sec-head"><h2>' . $title . '</h2><a href="' . $link . '">مشاهده همه <i class="fas fa-chevron-left"></i></a></div>';
    echo '<div class="prod-scroll">';
    foreach($products as $p) {
        $fp   = $p['discount_price'] ?: $p['price'];
        $disc = $p['discount_price'] ? round((($p['price']-$p['discount_price'])/$p['price'])*100) : 0;
        $img  = 'uploads/products/' . htmlspecialchars($p['image']??'');
        echo '<div class="pc">';
        if($disc) echo '<span class="pc-tag" style="' . ($tagColor ? "background:$tagColor;" : '') . '">-' . $disc . '٪</span>';
        echo '<a href="product-detail.php?id=' . $p['id'] . '" class="pc-img">';
        echo '<img src="' . $img . '" alt="' . htmlspecialchars($p['name']) . '" onerror="this.src=\'assets/images/no-image.svg\'" loading="lazy">';
        echo '</a>';
        echo '<div class="pc-body">';
        echo '<a href="product-detail.php?id=' . $p['id'] . '" class="pc-name">' . htmlspecialchars($p['name']) . '</a>';
        if(!empty($p['rating_avg']) && $p['rating_avg'] > 0) echo '<div class="pc-stars">⭐ ' . number_format($p['rating_avg'],1) . '</div>';
        echo '<div class="pc-foot">';
        echo '<div>';
        if($p['discount_price']) echo '<span class="pc-old">' . number_format($p['price']) . '</span>';
        echo '<span class="pc-price">' . number_format($fp) . ' ت</span>';
        echo '</div>';
        echo '<button class="pc-add" onclick="addToCart(' . $p['id'] . ')"><i class="fas fa-plus"></i></button>';
        echo '</div></div></div>';
    }
    echo '</div></section>';
}
?>

<?php renderProductRow($featuredProducts, '✨ محصولات <span style="color:var(--primary)">ویژه</span>', 'products.php?featured=1'); ?>

<!-- بنر میانی -->
<div class="mid-ban">
    <div class="mb-body">
        <div>
            <div class="mb-tag">پیشنهاد ویژه</div>
            <h3>ارسال رایگان<br>به سراسر ایران</h3>
            <p>بالای <?= number_format($settings->get('free_shipping_threshold',2000000)/1000) ?>K تومان</p>
            <a href="products.php" class="mb-btn">خرید کنید</a>
        </div>
        <div style="font-size:4rem;filter:drop-shadow(0 4px 8px rgba(0,0,0,0.3))">🚚</div>
    </div>
</div>

<?php renderProductRow($newProducts, '🆕 جدیدترین <span style="color:var(--primary)">محصولات</span>', 'products.php?sort=newest'); ?>

<?php if(!empty($saleProducts)): ?>
<!-- بنر تخفیف -->
<div class="sale-ban">
    <span style="font-size:1.8rem">🔥</span>
    <div><strong>تخفیف‌های ویژه</strong><small>تا پایان هفته</small></div>
    <a href="products.php" class="sb-lnk">مشاهده</a>
</div>
<?php renderProductRow($saleProducts, '🔥 تخفیف <span style="color:#ef4444">ویژه</span>', 'products.php', '#ef4444'); ?>
<?php endif; ?>

<?php renderProductRow($topProducts, '📦 پرفروش‌ترین <span style="color:var(--primary)">محصولات</span>', 'products.php?sort=popular'); ?>

<!-- ردیف‌های محصول بر اساس دسته‌بندی -->
<?php foreach($categoryRows as $row): ?>
<section class="home-sec">
    <div class="sec-head">
        <h2>
            <?php if(!empty($row['cat']['icon'])): ?>
            <i class="fas <?= htmlspecialchars($row['cat']['icon']) ?>" style="color:var(--primary);margin-left:6px;"></i>
            <?php endif; ?>
            <?= htmlspecialchars($row['cat']['name']) ?>
        </h2>
        <a href="products.php?category=<?= htmlspecialchars($row['cat']['slug']) ?>">
            نمایش همه <i class="fas fa-chevron-left"></i>
        </a>
    </div>
    <div class="prod-scroll">
        <?php foreach($row['products'] as $p):
            $fp   = $p['discount_price'] ?: $p['price'];
            $disc = $p['discount_price'] ? round((($p['price']-$p['discount_price'])/$p['price'])*100) : 0;
        ?>
        <div class="pc">
            <?php if($disc): ?><span class="pc-tag">-<?= $disc ?>٪</span><?php endif; ?>
            <?php if(!$disc && ($p['stock']??0) < 5 && ($p['stock']??0) > 0): ?>
            <span class="pc-tag" style="background:#f97316;">کم</span>
            <?php endif; ?>
            <?php if(($p['stock']??1) == 0): ?>
            <span class="pc-tag" style="background:#6b7280;">ناموجود</span>
            <?php endif; ?>
            <a href="product-detail.php?id=<?= $p['id'] ?>" class="pc-img">
                <img src="uploads/products/<?= htmlspecialchars($p['image']??'') ?>"
                     alt="<?= htmlspecialchars($p['name']) ?>"
                     onerror="this.src='assets/images/no-image.svg'" loading="lazy">
            </a>
            <div class="pc-body">
                <a href="product-detail.php?id=<?= $p['id'] ?>" class="pc-name">
                    <?= htmlspecialchars($p['name']) ?>
                </a>
                <?php if(!empty($p['rating_avg']) && $p['rating_avg'] > 0): ?>
                <div class="pc-stars">⭐ <?= number_format($p['rating_avg'],1) ?> <span style="font-size:0.6rem;color:var(--text-secondary);">(<?= $p['rating_count']??0 ?>)</span></div>
                <?php endif; ?>
                <div class="pc-foot">
                    <div>
                        <?php if($p['discount_price']): ?>
                        <span class="pc-old"><?= number_format($p['price']) ?></span>
                        <?php endif; ?>
                        <span class="pc-price"><?= number_format($fp) ?> ت</span>
                    </div>
                    <?php if(($p['stock']??1) > 0): ?>
                    <button class="pc-add" onclick="addToCart(<?= $p['id'] ?>)" title="افزودن به سبد">
                        <i class="fas fa-plus"></i>
                    </button>
                    <?php else: ?>
                    <button class="pc-add" style="opacity:0.4;cursor:not-allowed;" disabled>
                        <i class="fas fa-times"></i>
                    </button>
                    <?php endif; ?>
                </div>
            </div>
        </div>
        <?php endforeach; ?>

        <!-- دکمه مشاهده همه آخر ردیف -->
        <a href="products.php?category=<?= htmlspecialchars($row['cat']['slug']) ?>" class="pc-see-all">
            <div class="psa-inner">
                <i class="fas fa-arrow-left"></i>
                <span>مشاهده<br>همه</span>
            </div>
        </a>
    </div>
</section>
<?php endforeach; ?>

<!-- مزایا -->
<div class="benefits">
    <div class="bn"><span>🚚</span><strong>ارسال رایگان</strong><small>بالای <?= number_format($settings->get('free_shipping_threshold',2000000)/1000) ?>K</small></div>
    <div class="bn"><span>✅</span><strong>ضمانت اصالت</strong><small>گارانتی کالا</small></div>
    <div class="bn"><span>↩️</span><strong>بازگشت ۷ روزه</strong><small>بدون دردسر</small></div>
    <div class="bn"><span>💬</span><strong>پشتیبانی</strong><small>۷ روز هفته</small></div>
</div>

<style>
/* نوار اعلان */
.announce-bar{background:linear-gradient(90deg,#3b0764,#4c1d95,#5b21b6);color:#fff;padding:9px 0;overflow:hidden;white-space:nowrap;font-size:0.78rem;letter-spacing:0.2px;}
.announce-inner{display:inline-flex;gap:24px;animation:marquee 30s linear infinite;padding:0 24px;align-items:center;}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.adiv{opacity:0.3;}

/* اسلایدر */
.hero-slider{position:relative;overflow:hidden;border-radius:0;}
.hs-track{display:flex;transition:transform 0.5s cubic-bezier(0.4,0,0.2,1);}
.hs-slide{min-width:100%;padding:36px 5% 44px;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:220px;position:relative;}
.hs-slide::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(0,0,0,0.4));pointer-events:none;}
.hs-content{flex:1;position:relative;z-index:1;}
.hs-tag{display:inline-block;background:rgba(255,255,255,0.12);color:rgba(255,255,255,0.9);border:1px solid rgba(255,255,255,0.2);padding:5px 14px;border-radius:20px;font-size:0.72rem;font-weight:600;margin-bottom:12px;backdrop-filter:blur(8px);letter-spacing:0.5px;}
.hs-content h2{font-size:1.7rem;font-weight:900;color:#fff;line-height:1.25;margin-bottom:10px;text-shadow:0 2px 12px rgba(0,0,0,0.4);}
.hs-content p{color:rgba(255,255,255,0.65);font-size:0.82rem;margin-bottom:18px;line-height:1.6;}
.hs-btn{display:inline-flex;align-items:center;gap:8px;background:rgba(255,255,255,0.15);backdrop-filter:blur(12px);color:#fff;padding:10px 22px;border-radius:12px;font-size:0.85rem;font-weight:700;text-decoration:none;border:1px solid rgba(255,255,255,0.25);transition:all 0.2s;letter-spacing:0.3px;}
.hs-btn:hover{background:rgba(255,255,255,0.25);color:#fff;transform:translateY(-1px);}
.hs-emoji{font-size:5.5rem;flex-shrink:0;position:relative;z-index:1;animation:floatEmoji 5s ease-in-out infinite;filter:drop-shadow(0 12px 24px rgba(0,0,0,0.4));}
@keyframes floatEmoji{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-14px) rotate(2deg)}}
.hs-dots{display:flex;justify-content:center;gap:5px;padding:10px 0;position:absolute;bottom:12px;left:0;right:0;z-index:2;}
.hs-dot{width:5px;height:5px;border-radius:50%;background:rgba(255,255,255,0.3);cursor:pointer;transition:all 0.3s;}
.hs-dot.active{background:#fff;width:22px;border-radius:3px;}

/* section */
.home-sec{padding:22px 4% 10px;}
.sec-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px;}
.sec-head h2{font-size:1.05rem;font-weight:800;margin:0;color:var(--text-primary);}
.sec-head a{font-size:0.75rem;color:var(--primary);text-decoration:none;font-weight:600;display:flex;align-items:center;gap:4px;opacity:0.85;transition:opacity 0.2s;}
.sec-head a:hover{opacity:1;}

/* دسته‌بندی */
.scroll-row{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;scrollbar-width:none;-webkit-overflow-scrolling:touch;}
.scroll-row::-webkit-scrollbar{display:none;}
.cat-chip{flex-shrink:0;display:flex;align-items:center;gap:6px;padding:8px 16px;border-radius:12px;border:1px solid var(--glass-border);background:var(--glass-bg);color:var(--text-secondary);font-size:0.78rem;font-weight:600;text-decoration:none;white-space:nowrap;transition:all 0.2s;}
.cat-chip.active,.cat-chip:hover{background:rgba(139,92,246,0.1);border-color:rgba(139,92,246,0.4);color:var(--primary);}

/* ردیف محصولات */
.prod-scroll{display:flex;gap:12px;overflow-x:auto;padding-bottom:10px;scrollbar-width:none;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;}
.prod-scroll::-webkit-scrollbar{display:none;}

/* کارت محصول — طراحی جدید */
.pc{flex-shrink:0;width:160px;background:var(--glass-bg-light);border:1px solid var(--glass-border);border-radius:18px;overflow:hidden;position:relative;scroll-snap-align:start;transition:all 0.3s cubic-bezier(0.4,0,0.2,1);}
[data-theme="light"] .pc{background:rgba(255,255,255,0.7);border-color:rgba(255,255,255,0.8);box-shadow:0 2px 12px rgba(100,130,200,0.08);}
.pc:active{transform:scale(0.97);}
.pc-tag{position:absolute;top:9px;right:9px;background:var(--danger);color:#fff;font-size:0.65rem;font-weight:800;padding:3px 8px;border-radius:8px;z-index:2;letter-spacing:0.3px;box-shadow:0 2px 8px rgba(239,68,68,0.4);}
.pc-img{display:block;aspect-ratio:1;overflow:hidden;background:var(--glass-bg);}
.pc-img img{width:100%;height:100%;object-fit:cover;transition:transform 0.5s cubic-bezier(0.4,0,0.2,1);}
.pc:hover .pc-img img{transform:scale(1.08);}
.pc-body{padding:10px 10px 12px;}
.pc-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:0.76rem;font-weight:600;color:var(--text-primary);text-decoration:none;line-height:1.45;margin-bottom:7px;display:block;}
.pc-stars{font-size:0.68rem;color:#f59e0b;margin-bottom:6px;display:flex;align-items:center;gap:3px;}
.pc-foot{display:flex;justify-content:space-between;align-items:center;gap:6px;}
.pc-old{display:block;font-size:0.62rem;text-decoration:line-through;color:var(--text-secondary);opacity:0.7;}
.pc-price{font-size:0.82rem;font-weight:800;color:var(--primary);white-space:nowrap;}
.pc-add{width:30px;height:30px;border-radius:9px;background:var(--primary);border:none;color:#fff;display:flex;align-items:center;justify-content:center;font-size:0.8rem;cursor:pointer;transition:all 0.2s;flex-shrink:0;box-shadow:0 3px 10px var(--primary-glow);}
.pc-add:hover{transform:scale(1.12) rotate(90deg);box-shadow:0 4px 16px var(--primary-glow);}
.pc-add:disabled{background:var(--glass-border);box-shadow:none;transform:none;}

/* کارت مشاهده همه */
.pc-see-all{flex-shrink:0;width:90px;background:rgba(139,92,246,0.05);border:1.5px dashed rgba(139,92,246,0.3);border-radius:18px;display:flex;align-items:center;justify-content:center;text-decoration:none;color:var(--primary);transition:all 0.2s;scroll-snap-align:start;min-height:200px;}
.pc-see-all:hover{background:rgba(139,92,246,0.1);border-color:var(--primary);}
.psa-inner{display:flex;flex-direction:column;align-items:center;gap:10px;font-size:0.75rem;font-weight:700;line-height:1.4;text-align:center;}
.psa-inner i{font-size:1.5rem;background:rgba(139,92,246,0.12);width:40px;height:40px;border-radius:12px;display:flex;align-items:center;justify-content:center;}

/* بنر میانی */
.mid-ban{margin:10px 4%;border-radius:18px;overflow:hidden;position:relative;}
.mid-ban::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,#2e1065,#3b0764,#4c1d95);z-index:0;}
.mid-ban::after{content:'';position:absolute;top:-40px;right:-40px;width:160px;height:160px;background:rgba(139,92,246,0.15);border-radius:50%;z-index:0;}
[data-theme="light"] .mid-ban::before{background:linear-gradient(135deg,#f3f0ff,#ede9fe,#ddd6fe);}
.mb-body{display:flex;align-items:center;justify-content:space-between;padding:22px 20px;position:relative;z-index:1;}
.mb-tag{display:inline-block;background:rgba(139,92,246,0.25);color:#c4b5fd;padding:4px 12px;border-radius:20px;font-size:0.7rem;font-weight:700;margin-bottom:10px;border:1px solid rgba(139,92,246,0.3);}
[data-theme="light"] .mb-tag{color:#4c1d95;background:rgba(139,92,246,0.15);}
.mb-body h3{font-size:1.1rem;font-weight:900;color:#fff;margin-bottom:6px;line-height:1.3;}
[data-theme="light"] .mb-body h3{color:#3b0764;}
.mb-body p{font-size:0.75rem;color:rgba(255,255,255,0.55);margin-bottom:14px;}
[data-theme="light"] .mb-body p{color:#4c1d95;opacity:0.8;}
.mb-btn{display:inline-block;background:var(--primary);color:#fff;padding:9px 20px;border-radius:11px;font-size:0.82rem;font-weight:700;text-decoration:none;box-shadow:0 4px 14px rgba(139,92,246,0.35);}

/* بنر تخفیف */
.sale-ban{margin:10px 4%;background:linear-gradient(135deg,#450a0a,#7f1d1d);border-radius:16px;padding:16px 20px;display:flex;align-items:center;gap:14px;border:1px solid rgba(239,68,68,0.2);}
.sale-ban strong{display:block;color:#fff;font-size:1rem;font-weight:800;}
.sale-ban small{color:rgba(255,255,255,0.55);font-size:0.72rem;}
.sb-lnk{margin-right:auto;background:rgba(255,255,255,0.12);backdrop-filter:blur(8px);color:#fff;padding:8px 18px;border-radius:10px;font-size:0.82rem;font-weight:700;text-decoration:none;border:1px solid rgba(255,255,255,0.2);white-space:nowrap;transition:all 0.2s;}
.sb-lnk:hover{background:rgba(255,255,255,0.22);}

/* مزایا */
.benefits{display:flex;border-top:1px solid var(--glass-border);margin-top:20px;padding-bottom:80px;}
.bn{flex:1;display:flex;flex-direction:column;align-items:center;gap:5px;padding:18px 6px;text-align:center;border-right:1px solid var(--glass-border);}
.bn:last-child{border-right:none;}
.bn span{font-size:1.5rem;display:block;}
.bn strong{display:block;font-size:0.7rem;font-weight:700;color:var(--text-primary);}
.bn small{display:block;font-size:0.62rem;color:var(--text-secondary);}

/* دسکتاپ */
</style>

<script>
// اسلایدر
let sliderCur = 0;
const sliderTrack = document.getElementById('hsTrack');
const sliderDots  = document.querySelectorAll('.hs-dot');
const sliderCount = 3;
let sliderTimer;

function sliderGoTo(i) {
    sliderCur = ((i % sliderCount) + sliderCount) % sliderCount;
    sliderTrack.style.transform = 'translateX(' + (sliderCur * 100) + '%)';
    sliderDots.forEach((d,j) => d.classList.toggle('active', j === sliderCur));
}
function sliderNext() { sliderGoTo(sliderCur + 1); }
function sliderStart() { sliderTimer = setInterval(sliderNext, 4000); }
function sliderStop()  { clearInterval(sliderTimer); }

// swipe
const hs = document.getElementById('heroSlider');
let swX = 0;
hs.addEventListener('touchstart', e => { swX = e.touches[0].clientX; sliderStop(); }, {passive:true});
hs.addEventListener('touchend',   e => {
    const diff = swX - e.changedTouches[0].clientX;
    if (Math.abs(diff) > 40) sliderGoTo(sliderCur + (diff > 0 ? 1 : -1));
    sliderStart();
});

sliderStart();

// drag روی دسکتاپ برای ردیف‌های محصول
document.querySelectorAll('.prod-scroll,.scroll-row').forEach(el => {
    let down = false, sx, sl;
    el.addEventListener('mousedown',  e => { down=true; sx=e.pageX-el.offsetLeft; sl=el.scrollLeft; el.style.cursor='grabbing'; });
    el.addEventListener('mouseleave', () => { down=false; el.style.cursor=''; });
    el.addEventListener('mouseup',    () => { down=false; el.style.cursor=''; });
    el.addEventListener('mousemove',  e => {
        if (!down) return;
        e.preventDefault();
        el.scrollLeft = sl - (e.pageX - el.offsetLeft - sx);
    });
});
</script>

<?php include 'includes/footer.php'; ?>