<?php
include "../include/config.php"; // Your DB connection

// Optional: check if admin is logged in
if (!isset($_SESSION['email'])) {
    header("location:../index.php");
    exit();
}

// Fetch counts from database
$assignments = $conn->query("SELECT COUNT(*) AS total FROM assignments")->fetch_assoc()['total'];
$programs    = $conn->query("SELECT COUNT(*) AS total FROM programs")->fetch_assoc()['total'];
$courses     = $conn->query("SELECT COUNT(*) AS total FROM course")->fetch_assoc()['total'];
?>

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Admin Dashboard</title>

<!-- Fonts & Icons -->
<link href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@400;600&family=Signika+Negative:wght@500&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">

<style>
body{
    margin:0;
    padding:0;
    background:white;
    font-size:16px;
}

.header{
    padding:10px;
    margin-bottom:20px;
    background: #fff;
    height: 120px;
    text-align: center;
    box-shadow: 0px 3px 8px rgba(0,0,0,0.1);
}

.co{
    padding:10px;
}

.cards-container {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.card {
    flex: 1 1 300px;
    max-width: 45%;
    background: #fff;
    border-radius: 5px;
    padding: 15px;
    margin: 4px 0;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
}

.card h4 {
    margin: 0;
    font-size: 16px;
    color: var(--primary);
}

.card p {
    font-size: 14px;
    margin-top: 5px;
}

@media (max-width: 768px) {
    .card {
        flex: 1 1 100%;
        max-width: 100%;
    }
}
</style>

</head>
<body>

<div class="co">
    
    <!-- Greeting + Date -->
    <div style="padding:15px; background:var(--primary); border-radius:10px; margin:10px 0; box-shadow:0 2px 5px rgba(0,0,0,0.1);">
      <h3 style="margin:0; font-size:18px; color:white;">Academic Menu</h3>
      <p id="todayDate" style="margin:5px 0 0; font-size:14px; color:white;">Quick and Fast</p>
    </div>

    <!-- Dashboard Cards -->
    <div class="cards-container">

      <!-- Assignments -->
      <div class="card" tyle="background:#f0aa12; color:white">
        <h4><i class="fa fa-book"></i> Assignments</h4>
        <p>Total Assignments: <b><?php echo $assignments; ?></b></p>
      </div>

      <!-- Programs -->
      <div class="card" tyle=" background:#12f093; color:white">
        <h4><i class="fa fa-layer-group"></i> Programs</h4>
        <p>Total Programs: <b><?php echo $programs; ?></b></p>
      </div>

      <!-- Courses -->
      <div class="card" tyle=" background:#1263f0;">
        <h4><i class="fa fa-chalkboard-teacher"></i> Courses</h4>
        <p>Total Courses: <b><?php echo $courses; ?></b></p>
      </div>

    </div>

</div>

<script>
  const today = new Date();
  const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
  document.getElementById("todayDate").innerText = "Today is " + today.toLocaleDateString('en-US', options);
</script>

</body>
</html>
