<?php
require_once 'config/db.php';
$settings = getAllSettings($pdo);
$activePage = 'product';

$brandId = (int)($_GET['brand'] ?? 0);
if (!$brandId) { header('Location: brand.php'); exit; }

$stmt = $pdo->prepare("SELECT * FROM brands WHERE id=? AND is_active=1");
$stmt->execute([$brandId]);
$brand = $stmt->fetch();
if (!$brand) { header('Location: brand.php'); exit; }

$stmt = $pdo->prepare("SELECT * FROM brand_products WHERE brand_id=? AND is_active=1 ORDER BY sort_order");
$stmt->execute([$brandId]);
$products = $stmt->fetchAll();

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

<style>
.bp-hero { background: #f8f8f8; padding: 30px 0 20px; border-bottom: 1px solid #eee; }
.bp-hero .breadcrumb a { color: var(--accent); text-decoration: none; }
.bp-hero .breadcrumb a:hover { text-decoration: underline; }
.bp-hero h1 { font-family: 'Playfair Display', serif; font-weight: 700; letter-spacing: 2px; text-transform: uppercase; color: #333; }
.bp-grid { padding: 40px 0 60px; }
.bp-card { display: block; background: #000; border-radius: 6px; overflow: hidden; aspect-ratio: 1; position: relative; transition: transform .3s, box-shadow .3s; }
.bp-card:hover { transform: translateY(-4px); box-shadow: 0 8px 30px rgba(0,0,0,.25); }
.bp-card img { width: 100%; height: 100%; object-fit: contain; padding: 20px; transition: transform .3s; }
.bp-card:hover img { transform: scale(1.05); }
.bp-card .bp-overlay { position: absolute; bottom: 0; left: 0; right: 0; background: linear-gradient(transparent, rgba(0,0,0,.8)); padding: 15px; opacity: 0; transition: opacity .3s; }
.bp-card:hover .bp-overlay { opacity: 1; }
.bp-card .bp-overlay span { color: #fff; font-size: .85rem; font-weight: 600; }
</style>

<div class="bp-hero">
    <div class="container">
        <nav aria-label="breadcrumb">
            <ol class="breadcrumb mb-2" style="font-size:.85rem;">
                <li class="breadcrumb-item"><a href="index.php">Home</a></li>
                <li class="breadcrumb-item active">Product <?= htmlspecialchars($brand['name']) ?></li>
            </ol>
        </nav>
        <h1 class="mb-0 fs-3">Product Of <?= htmlspecialchars($brand['name']) ?></h1>
    </div>
</div>

<section class="bp-grid">
    <div class="container">
        <div class="row g-4 justify-content-center">
            <?php foreach ($products as $p): ?>
            <div class="col-6 col-sm-4 col-md-3">
                <a href="brand-product-detail.php?slug=<?= urlencode($p['slug']) ?>" class="bp-card">
                    <?php if ($p['logo_image']): ?>
                        <img src="<?= htmlspecialchars($p['logo_image']) ?>" alt="<?= htmlspecialchars($p['name']) ?>"
                             onerror="this.parentElement.innerHTML='<div style=\'display:flex;align-items:center;justify-content:center;height:100%;color:#c9a84c;font-size:1.2rem;font-weight:700;\'><?= htmlspecialchars($p['name']) ?></div>'">
                    <?php else: ?>
                        <div style="display:flex;align-items:center;justify-content:center;height:100%;color:#c9a84c;font-size:1.4rem;font-weight:700;font-style:italic;">
                            <?= htmlspecialchars($p['name']) ?>
                        </div>
                    <?php endif; ?>
                    <div class="bp-overlay">
                        <span><?= htmlspecialchars($brand['name']) ?> <?= htmlspecialchars($p['name']) ?></span>
                    </div>
                </a>
            </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 d-block mb-3"></i>
                    Belum ada produk untuk brand ini.
                </div>
            <?php endif; ?>
        </div>
    </div>
</section>

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