<?php session_start();
include_once('includes/config.php');
include_once('includes/settings.php');
error_reporting(E_ALL);
ini_set('display_errors', 1);
?>
<!DOCTYPE html>
<html lang="en">
<?php include('includes/head.php'); ?>

<body class="cnt-home">

    <!-- Header -->
    <header class="header-style-1">
        <?php include('includes/top-header.php'); ?>
        <?php include('includes/main-header.php'); ?>
        <?php include('includes/menu-bar.php'); ?>
    </header>

    <!-- Breadcrumb -->
    <div class="breadcrumb mt-2">
        <div class="container">
            <nav aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item"><a href="index.php">Home</a></li>
                    <li class="breadcrumb-item active">Shop Categories</li>
                </ol>
            </nav>
        </div>
    </div>

    <!-- Body Content -->
    <div class="body-content outer-top-xs">
        <div class="container">
            <!-- Page Header -->
            <div class="white-box mb-4">
                <div class="section-header-plain">
                    <span><i class="fa fa-th mr-2"></i>All Categories</span>
                </div>
                <div class="p-3">
                    <div class="row">
                        <?php
                        $query = mysqli_query($con, "select category.id as catid,category.categoryName from category ");
                        $cnt = 1;
                        while ($row = mysqli_fetch_array($query)) {
                            // Icon mapping logic
                            $icon = "fa-tag";
                            $name = strtolower($row['categoryName']);
                            if (strpos($name, 'phone') !== false || strpos($name, 'mobile') !== false)
                                $icon = "fa-mobile";
                            elseif (strpos($name, 'laptop') !== false || strpos($name, 'computer') !== false)
                                $icon = "fa-laptop";
                            elseif (strpos($name, 'tv') !== false || strpos($name, 'television') !== false)
                                $icon = "fa-television";
                            elseif (strpos($name, 'fashion') !== false || strpos($name, 'cloth') !== false)
                                $icon = "fa-shopping-bag";
                            elseif (strpos($name, 'home') !== false || strpos($name, 'appliance') !== false)
                                $icon = "fa-home";
                            elseif (strpos($name, 'beauty') !== false || strpos($name, 'health') !== false)
                                $icon = "fa-heart";
                            elseif (strpos($name, 'electronics') !== false)
                                $icon = "fa-plug";
                            elseif (strpos($name, 'sport') !== false)
                                $icon = "fa-futbol-o";
                            elseif (strpos($name, 'baby') !== false || strpos($name, 'kid') !== false)
                                $icon = "fa-child";
                            elseif (strpos($name, 'gaming') !== false)
                                $icon = "fa-gamepad";
                            ?>
                            <div class="col-6 col-md-4 col-lg-3 mb-4">
                                <a href="category.php?cid=<?php echo htmlentities($row['catid']); ?>"
                                    class="text-decoration-none">
                                    <div
                                        class="am-card h-100 text-center p-4 d-flex flex-column align-items-center justify-content-center transition-transform hover-shadow">
                                        <div class="category-icon-wrapper mb-3"
                                            style="width: 80px; height: 80px; background: rgba(0,0,0,0.03); border-radius: 50%; display: flex; align-items: center; justify-content: center;">
                                            <i class="fa <?php echo $icon; ?> fa-3x text-primary"></i>
                                        </div>
                                        <h5 class="fw-bold text-dark mb-0"><?php echo htmlentities($row['categoryName']); ?>
                                        </h5>
                                        <div class="mt-3 text-muted small">
                                            <span class="btn btn-sm btn-outline-primary rounded-pill px-3">Browse
                                                Category</span>
                                        </div>
                                    </div>
                                </a>
                            </div>
                        <?php } ?>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Footer -->
    <?php include_once('includes/footer.php'); ?>
    <?php include_once('includes/foot.php'); ?>
</body>

</html>
