<?
/**
 * blog.php
 * Halaman Blog - daftar artikel + filter kategori (?cat=...) + sidebar
 */
require_once 'functions.php';

// ------------------------------------------------------------
// Kategori blog
// ------------------------------------------------------------
$blog_categories = [
    'tips-gaya'      => 'Tips Gaya',
    'tren-fashion'   => 'Tren Fashion',
    'perawatan'      => 'Perawatan Pakaian',
    'sustainability' => 'Sustainability',
    'event-promo'    => 'Event & Promo',
];

$cat = isset($_GET['cat']) ? $_GET['cat'] : '';
$active_category = isset($blog_categories[$cat]) ? $blog_categories[$cat] : null;

$page_title = $active_category ? $active_category : 'Blog';
include 'header.php';

// ------------------------------------------------------------
// Dummy data - semua artikel (terbaru di atas)
// ------------------------------------------------------------
$semua_artikel = [
    ['id'=>1, 'title'=>'5 Cara Memadukan Outfit Kasual untuk Kerja Tanpa Terlihat Berlebihan', 'excerpt'=>'Tampil rapi di kantor tanpa harus mengorbankan kenyamanan. Berikut beberapa kombinasi yang mudah ditiru untuk gaya kerja sehari-hari.', 'category'=>'Tips Gaya', 'category_slug'=>'tips-gaya', 'date'=>'12 Juni 2026', 'author'=>'Tim FORMA', 'read_time'=>'4 menit baca', 'image'=>'https://placehold.co/800x533/f4f4f5/0d0d0d?text=Artikel+1'],
    ['id'=>2, 'title'=>'Tren Warna Earth Tone yang Masih Relevan di 2026', 'excerpt'=>'Palet warna natural seperti cokelat, krem, dan olive masih jadi favorit. Simak alasan dan cara memadukannya dengan koleksi yang sudah kamu punya.', 'category'=>'Tren Fashion', 'category_slug'=>'tren-fashion', 'date'=>'8 Juni 2026', 'author'=>'Tim FORMA', 'read_time'=>'5 menit baca', 'image'=>'https://placehold.co/800x533/e4e4e7/0d0d0d?text=Artikel+2'],
    ['id'=>3, 'title'=>'Cara Merawat Kemeja Linen Agar Tetap Awet dan Rapi', 'excerpt'=>'Linen memang mudah kusut, tapi dengan perawatan yang tepat, kemeja linen favoritmu bisa terlihat rapi lebih lama.', 'category'=>'Perawatan Pakaian', 'category_slug'=>'perawatan', 'date'=>'5 Juni 2026', 'author'=>'Tim FORMA', 'read_time'=>'3 menit baca', 'image'=>'https://placehold.co/800x533/f4f4f5/0d0d0d?text=Artikel+3'],
    ['id'=>4, 'title'=>'Mengenal Slow Fashion dan Cara Mulai Menerapkannya', 'excerpt'=>'Slow fashion bukan sekadar tren, tapi cara berpakaian yang lebih sadar terhadap kualitas, daya tahan, dan dampak lingkungan.', 'category'=>'Sustainability', 'category_slug'=>'sustainability', 'date'=>'2 Juni 2026', 'author'=>'Tim FORMA', 'read_time'=>'6 menit baca', 'image'=>'https://placehold.co/800x533/e4e4e7/0d0d0d?text=Artikel+4'],
    ['id'=>5, 'title'=>'FORMA Mid Year Sale: Diskon hingga 50% untuk Koleksi Pilihan', 'excerpt'=>'Periode terbatas! Dapatkan potongan harga untuk ratusan produk pilihan dari kategori pakaian, sepatu, hingga tas.', 'category'=>'Event & Promo', 'category_slug'=>'event-promo', 'date'=>'30 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'2 menit baca', 'image'=>'https://placehold.co/800x533/0d0d0d/ffffff?text=Artikel+5'],
    ['id'=>6, 'title'=>'Panduan Memilih Sepatu yang Cocok untuk Berbagai Aktivitas', 'excerpt'=>'Dari sneakers harian hingga loafer untuk acara formal, kenali jenis sepatu yang sesuai dengan kebutuhanmu.', 'category'=>'Tips Gaya', 'category_slug'=>'tips-gaya', 'date'=>'27 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'4 menit baca', 'image'=>'https://placehold.co/800x533/f4f4f5/0d0d0d?text=Artikel+6'],
    ['id'=>7, 'title'=>'Kembalinya Gaya Y2K dalam Koleksi Streetwear Modern', 'excerpt'=>'Potongan baggy, warna mencolok, dan aksesori retro kembali populer. Begini cara mengaplikasikannya tanpa terlihat norak.', 'category'=>'Tren Fashion', 'category_slug'=>'tren-fashion', 'date'=>'24 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'5 menit baca', 'image'=>'https://placehold.co/800x533/e4e4e7/0d0d0d?text=Artikel+7'],
    ['id'=>8, 'title'=>'Trik Menghilangkan Bau Apek pada Pakaian yang Disimpan Lama', 'excerpt'=>'Pakaian yang lama tersimpan di lemari sering berbau apek. Berikut beberapa cara sederhana untuk mengatasinya di rumah.', 'category'=>'Perawatan Pakaian', 'category_slug'=>'perawatan', 'date'=>'20 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'3 menit baca', 'image'=>'https://placehold.co/800x533/f4f4f5/0d0d0d?text=Artikel+8'],
    ['id'=>9, 'title'=>'Apa Itu Material Daur Ulang dan Mengapa Penting bagi Industri Fashion', 'excerpt'=>'Penggunaan material daur ulang jadi salah satu langkah nyata industri fashion untuk mengurangi limbah tekstil.', 'category'=>'Sustainability', 'category_slug'=>'sustainability', 'date'=>'17 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'5 menit baca', 'image'=>'https://placehold.co/800x533/e4e4e7/0d0d0d?text=Artikel+9'],
    ['id'=>10,'title'=>'Padu Padan Aksesoris untuk Tampilan Sehari-hari yang Lebih Stylish', 'excerpt'=>'Aksesoris sederhana seperti tas, ikat pinggang, dan topi bisa mengubah keseluruhan tampilan outfit harianmu.', 'category'=>'Tips Gaya', 'category_slug'=>'tips-gaya', 'date'=>'13 Mei 2026', 'author'=>'Tim FORMA', 'read_time'=>'4 menit baca', 'image'=>'https://placehold.co/800x533/f4f4f5/0d0d0d?text=Artikel+10'],
];

// ------------------------------------------------------------
// Filter berdasarkan kategori aktif
// ------------------------------------------------------------
if ($active_category) {
    $artikel_grid = array_values(array_filter($semua_artikel, function ($a) use ($active_category) {
        return $a['category'] === $active_category;
    }));
} else {
    $artikel_grid = $semua_artikel;
}

// ------------------------------------------------------------
// Sidebar - artikel terbaru & tag populer
// ------------------------------------------------------------
$artikel_terbaru = array_slice($semua_artikel, 0, 4);
$tag_populer = ['OOTD', 'Sustainable Fashion', 'Tips Belanja', 'Tren 2026', 'Perawatan Kain', 'Minimalis', 'Aksesoris', 'Promo'];
?>

<div class="forma-blog max-w-7xl mx-auto px-4 py-8 md:py-14">

    <!-- Breadcrumb -->
    <nav class="forma-breadcrumb font-mono text-[11px] uppercase tracking-widest text-mute mb-4">
        <a href="home.php" class="hover:text-ink">Beranda</a>
        <span class="mx-2">/</span>
        <? if ($active_category): ?>
            <a href="blog.php" class="hover:text-ink">Blog</a>
            <span class="mx-2">/</span>
            <span class="text-ink"></span>
        <? else: ?>
            <span class="text-ink">Blog</span>
        <? endif; ?>
    </nav>

    <h1 class="font-display text-3xl md:text-4xl mb-2">Blog</h1>
    <p class="text-mute text-sm mb-10 max-w-2xl">
        <? if ($active_category): ?>
            Kumpulan artikel seputar  dari tim FORMA.
        <? else: ?>
            Inspirasi gaya, tips perawatan pakaian, tren terbaru, dan kabar promo &mdash; semuanya ada di sini.
        <? endif; ?>
    </p>

    <div class="forma-blog__layout flex flex-col md:flex-row gap-4">

        <!-- ============================================
             GRID ARTIKEL
             ============================================ -->
        <div class="forma-blog__main flex-1">

            <? if ($active_category): ?>
                <div class="forma-blog__toolbar flex flex-wrap items-center justify-between gap-3 mb-6 font-mono text-[11px] uppercase tracking-widest text-mute">
                    <p>