<?php
session_start();
if(!isset($_SESSION['admin_id'])){
  header("Location: index.php");
  exit;
}


/* LOGIN CHECK */
if(!isset($_SESSION['admin_name'])){
  header("Location: login.php");
  exit;
}
$adminName = $_SESSION['admin_name'];

/* ALLOWED PAGES */
$allowedPages = [
  'add_product'       => 'add_product.php',
  'manage_products'   => 'manage_products.php',
  'add_category'      => 'add_category.php',
  'manage_categories' => 'manage_categories.php',
  'manage_reviews'    => 'manage_reviews.php',
];

$pageKey  = $_GET['page'] ?? 'add_product';
$pageFile = $allowedPages[$pageKey] ?? 'add_product.php';
?>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Panel</title>

<style>
:root{
  --dark:#0f172a;
  --darker:#020617;
  --bg:#f1f5f9;
  --primary:#16a34a;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui;background:var(--bg)}

/* TOP BAR */
.topbar{
  height:56px;
  background:var(--dark);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  position:fixed;
  top:0;left:0;right:0;
  z-index:1000;
}
.menu-btn{
  font-size:22px;
  cursor:pointer;
  display:none;
}
.admin{
  display:flex;
  align-items:center;
  gap:8px;
}
.admin img{
  width:32px;
  height:32px;
  border-radius:50%;
  background:#fff;
}

/* LAYOUT */
.wrapper{
  display:flex;
  margin-top:56px;
}

/* SIDEBAR */
.sidebar{
  width:240px;
  background:var(--darker);
  min-height:calc(100vh - 56px);
  padding:14px;
  transition:.3s;
}
.sidebar a{
  display:block;
  padding:12px;
  border-radius:10px;
  color:#cbd5e1;
  text-decoration:none;
  margin-bottom:6px;
  font-size:15px;
}
.sidebar a:hover,
.sidebar a.active{
  background:var(--primary);
  color:#fff;
}

/* CONTENT */
.content{
  flex:1;
  padding:16px;
}

/* MOBILE */
@media(max-width:768px){
  .menu-btn{display:block}
  .sidebar{
    position:fixed;
    left:-260px;
    top:56px;
    height:calc(100vh - 56px);
    z-index:999;
  }
  .sidebar.show{left:0}
}
</style>
</head>
<body>

<!-- TOP BAR -->
<div class="topbar">
  <span class="menu-btn" onclick="toggleMenu()">☰</span>
  <strong>Admin Panel</strong>

  <div class="admin">
    <img src="/assets/icons/admin.png" alt="admin">
    <span><?= htmlspecialchars($adminName) ?></span>
  </div>
</div>

<div class="wrapper">

  <!-- SIDEBAR -->
  <div class="sidebar" id="sidebar">
    <a href="?page=add_product" class="<?= $pageKey=='add_product'?'active':'' ?>">➕ Add Product</a>
    <a href="?page=manage_products" class="<?= $pageKey=='manage_products'?'active':'' ?>">🛒 Manage Products</a>

    <a href="?page=add_category" class="<?= $pageKey=='add_category'?'active':'' ?>">➕ Add Category</a>
    <a href="?page=manage_categories" class="<?= $pageKey=='manage_categories'?'active':'' ?>">📂 Manage Categories</a>

    <a href="?page=manage_reviews" class="<?= $pageKey=='manage_reviews'?'active':'' ?>">⭐ Manage Reviews</a>

    <a href="logout.php">🚪 Logout</a>
  </div>

  <!-- CONTENT -->
  <div class="content">
    <?php
      if(file_exists($pageFile)){
        include $pageFile;
      }else{
        echo "<h3>Page not found</h3>";
      }
    ?>
  </div>

</div>

<script>
function toggleMenu(){
  document.getElementById('sidebar').classList.toggle('show');
}
</script>

</body>
</html>
