<?php
require_once 'config/db.php';
$settings = getAllSettings($pdo);
$activePage = 'product';
$cat = $_GET['cat'] ?? 'all';

$catRow = null;
if ($cat !== 'all') {
    $stmt = $pdo->prepare("SELECT * FROM product_categories WHERE slug=?");
    $stmt->execute([$cat]);
    $catRow = $stmt->fetch();
}
$categories = $pdo->query("SELECT * FROM product_categories ORDER BY sort_order")->fetchAll();

if ($cat !== 'all' && $catRow) {
    $stmt = $pdo->prepare("SELECT p.*, pc.name as cat_name FROM products p JOIN product_categories pc ON p.category_id=pc.id WHERE pc.slug=? AND p.is_active=1 ORDER BY p.sort_order");
    $stmt->execute([$cat]);
    $products = $stmt->fetchAll();
} else {
    $products = $pdo->query("SELECT p.*, pc.name as cat_name, pc.slug as cat_slug FROM products p JOIN product_categories pc ON p.category_id=pc.id WHERE p.is_active=1 ORDER BY p.category_id, p.sort_order")->fetchAll();
}

$pageTitle = ($catRow ? $catRow['name'].' - ' : 'Product - ').($settings['site_name']??'');
include 'partials/header.php';
?>

<div class="page-hero">
    <div class="container">
        <nav aria-label="breadcrumb"><ol class="breadcrumb mb-2"><li class="breadcrumb-item"><a href="index.php">Home</a></li><li class="breadcrumb-item active" data-en="Product" data-id="Produk">Product</li></ol></nav>
        <h1 class="fw-bold mb-1 fs-2"><?= $catRow ? htmlspecialchars($catRow['name']) : 'Product' ?></h1>
        <p class="mb-0" style="color:rgba(255,255,255,.6);"><?= $catRow ? htmlspecialchars($catRow['description']) : 'Semua kategori produk kami' ?></p>
    </div>
</div>

<section class="py-5 py-lg-6">
    <div class="container">
        <!-- Filter Tabs -->
        <div class="filter-tabs fade-up">
            <a href="product.php" class="filter-tab <?= $cat==='all'?'active':'' ?>" data-en="All" data-id="Semua">Semua</a>
            <?php foreach ($categories as $c): ?>
                <a href="product.php?cat=<?= $c['slug'] ?>" class="filter-tab <?= $cat===$c['slug']?'active':'' ?>"><?= htmlspecialchars($c['name']) ?></a>
            <?php endforeach; ?>
        </div>
        <!-- Product Grid -->
        <div class="row g-4">
            <?php foreach ($products as $p): ?>
            <div class="col-sm-6 col-md-4 col-lg-3 fade-up">
                <div class="product-card">
                    <div class="prod-img-wrap">
                        <img src="<?= htmlspecialchars($p['image']??'') ?>" class="prod-img" alt="<?= htmlspecialchars($p['name']) ?>"
                             onerror="this.src='https://placehold.co/400x200/e0e0e0/888?text=Product'">
                    </div>
                    <div class="prod-body">
                        <div class="badge-cat bg-dark text-white mb-2"><?= htmlspecialchars($p['cat_name']) ?></div>
                        <h6 class="fw-bold"><?= htmlspecialchars($p['name']) ?></h6>
                        <p class="small text-muted"><?= htmlspecialchars(substr($p['description']??'',0,90)).'...' ?></p>
                        <?php if ($p['specifications']): ?>
                            <div class="prod-spec"><i class="bi bi-list-check me-1"></i><?= htmlspecialchars($p['specifications']) ?></div>
                        <?php endif; ?>
                        <a href="contact.php" class="btn btn-outline-dark btn-sm mt-3 w-100" data-en="Inquire Now" data-id="Tanya Sekarang">Tanya Sekarang</a>
                    </div>
                </div>
            </div>
            <?php endforeach; ?>
            <?php if (empty($products)): ?>
                <div class="col-12 text-center py-5 text-muted"><i class="bi bi-box-seam display-4 mb-3 d-block"></i>Tidak ada produk ditemukan.</div>
            <?php endif; ?>
        </div>
    </div>
</section>

<!-- CTA -->
<section class="py-5 bg-section">
    <div class="container text-center">
        <h3 class="fw-bold mb-3" data-en="Interested in Our Products?" data-id="Tertarik dengan Produk Kami?">Tertarik dengan Produk Kami?</h3>
        <p class="text-muted mb-4" data-en="Contact us for custom orders and detailed consultations" data-id="Hubungi kami untuk pesanan custom dan konsultasi lebih lanjut">Hubungi kami untuk pesanan custom dan konsultasi lebih lanjut</p>
        <a href="contact.php" class="btn btn-dark px-4" data-en="Contact Us" data-id="Hubungi Kami">Hubungi Kami</a>
    </div>
</section>

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