<?php
// /elms/student/studentlayout_top.php
declare(strict_types=1);

if (session_status() === PHP_SESSION_NONE) session_start();

if (empty($_SESSION['student_id'])) {
  $next = $_SERVER['REQUEST_URI'] ?? '/elms/student/index.php';
  header('Location: /elms/student/login.php?next=' . rawurlencode($next));
  exit;
}

$student_name = $_SESSION['student_name'] ?? 'Student';
$student_email = $_SESSION['academic_email'] ?? '';
$center_reg_no = $_SESSION['center_reg_no'] ?? '';

$PAGE_TITLE  = $PAGE_TITLE ?? 'Dashboard';
$ACTIVE_MENU = $ACTIVE_MENU ?? 'dashboard';

function s_h($s) {
  return htmlspecialchars((string)$s, ENT_QUOTES | ENT_SUBSTITUTE, 'UTF-8');
}

function active_menu($key, $active) {
  return $key === $active ? 'active' : '';
}
?>
<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title><?= s_h($PAGE_TITLE) ?> — Eden LMS</title>
  <meta name="viewport" content="width=device-width, initial-scale=1">

  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
  <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">

  <style>
    :root{
      --blue:#2563eb;
      --deep:#1e3a8a;
      --red:#e31e24;
      --bg:#f6f8fb;
      --ink:#0f172a;
      --muted:#64748b;
      --sidebar:#0f172a;
      --sidebar2:#111827;
      --card:#ffffff;
      --line:rgba(15,23,42,.08);
    }

    *{box-sizing:border-box}

    body{
      margin:0;
      background:var(--bg);
      color:var(--ink);
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    }

    .lms-shell{
      min-height:100vh;
      display:flex;
    }

    .lms-sidebar{
      width:270px;
      background:linear-gradient(180deg,var(--sidebar),var(--sidebar2));
      color:#fff;
      position:fixed;
      inset:0 auto 0 0;
      z-index:1000;
      display:flex;
      flex-direction:column;
      box-shadow:14px 0 35px rgba(15,23,42,.18);
    }

    .lms-brand{
      padding:22px 20px;
      display:flex;
      align-items:center;
      gap:12px;
      border-bottom:1px solid rgba(255,255,255,.08);
    }

    .lms-brand-logo{
      width:42px;
      height:42px;
      border-radius:14px;
      background:#fff;
      display:grid;
      place-items:center;
      color:var(--blue);
      font-size:22px;
    }

    .lms-brand-text{
      line-height:1.15;
    }

    .lms-brand-title{
      font-weight:900;
      letter-spacing:.2px;
    }

    .lms-brand-sub{
      font-size:12px;
      color:rgba(255,255,255,.65);
    }

    .student-mini{
      margin:16px;
      padding:14px;
      border-radius:18px;
      background:rgba(255,255,255,.07);
      border:1px solid rgba(255,255,255,.08);
    }

    .student-mini .name{
      font-weight:800;
      font-size:14px;
      margin-bottom:3px;
    }

    .student-mini .meta{
      color:rgba(255,255,255,.65);
      font-size:12px;
      word-break:break-word;
    }

    .lms-menu{
      padding:8px 12px 16px;
      overflow:auto;
      flex:1;
    }

    .lms-menu a{
      display:flex;
      align-items:center;
      gap:11px;
      color:rgba(255,255,255,.74);
      text-decoration:none;
      padding:11px 12px;
      border-radius:14px;
      margin-bottom:5px;
      font-weight:650;
      font-size:14px;
      transition:.15s ease;
    }

    .lms-menu a:hover{
      background:rgba(255,255,255,.08);
      color:#fff;
    }

    .lms-menu a.active{
      background:#fff;
      color:#0f172a;
      box-shadow:0 10px 25px rgba(0,0,0,.16);
    }

    .lms-menu i{
      font-size:18px;
      width:22px;
      text-align:center;
    }

    .sidebar-footer{
      padding:14px 16px;
      border-top:1px solid rgba(255,255,255,.08);
    }

    .logout-btn{
      width:100%;
      border-radius:14px;
      font-weight:800;
    }

    .lms-main{
      margin-left:270px;
      width:calc(100% - 270px);
      min-height:100vh;
      display:flex;
      flex-direction:column;
    }

    .lms-topbar{
      height:72px;
      background:#fff;
      border-bottom:1px solid var(--line);
      display:flex;
      align-items:center;
      justify-content:space-between;
      padding:0 26px;
      position:sticky;
      top:0;
      z-index:900;
      box-shadow:0 10px 28px rgba(15,23,42,.04);
    }

    .page-title{
      font-size:20px;
      font-weight:900;
      margin:0;
    }

    .page-subtitle{
      font-size:13px;
      color:var(--muted);
    }

    .top-actions{
      display:flex;
      align-items:center;
      gap:10px;
    }

    .mobile-menu-btn{
      display:none;
    }

    .lms-content{
      padding:26px;
      flex:1;
    }

    .stat-card{
      border:0;
      border-radius:20px;
      background:#fff;
      box-shadow:0 14px 35px rgba(15,23,42,.07);
      height:100%;
    }

    .stat-icon{
      width:48px;
      height:48px;
      border-radius:16px;
      display:grid;
      place-items:center;
      background:#eef4ff;
      color:var(--blue);
      font-size:23px;
    }

    .stat-label{
      color:var(--muted);
      font-size:13px;
      font-weight:700;
    }

    .stat-value{
      font-size:22px;
      font-weight:900;
      margin-top:2px;
    }

    .soft-card{
      border:0;
      border-radius:20px;
      background:#fff;
      box-shadow:0 14px 35px rgba(15,23,42,.07);
    }

    .section-title{
      font-weight:900;
      font-size:17px;
      margin:0;
    }

    .badge-soft-blue{
      background:#eef4ff;
      color:#1d4ed8;
    }

    .badge-soft-green{
      background:#ecfdf5;
      color:#047857;
    }

    .badge-soft-red{
      background:#fef2f2;
      color:#b91c1c;
    }

    .badge-soft-yellow{
      background:#fffbeb;
      color:#b45309;
    }

    @media(max-width: 992px){
      .lms-sidebar{
        transform:translateX(-100%);
        transition:.2s ease;
      }

      body.sidebar-open .lms-sidebar{
        transform:translateX(0);
      }

      .lms-main{
        margin-left:0;
        width:100%;
      }

      .mobile-menu-btn{
        display:inline-flex;
      }

      .lms-topbar{
        padding:0 16px;
      }

      .lms-content{
        padding:18px;
      }
    }
  </style>
</head>

<body>
<div class="lms-shell">

  <aside class="lms-sidebar">
    <div class="lms-brand">
      <div class="lms-brand-logo">
        <i class="bi bi-mortarboard-fill"></i>
      </div>
      <div class="lms-brand-text">
        <div class="lms-brand-title">Eden LMS</div>
        <div class="lms-brand-sub">Student Portal</div>
      </div>
    </div>

    <div class="student-mini">
      <div class="name"><?= s_h($student_name) ?></div>
      <?php if ($center_reg_no): ?>
        <div class="meta"><?= s_h($center_reg_no) ?></div>
      <?php endif; ?>
      <?php if ($student_email): ?>
        <div class="meta"><?= s_h($student_email) ?></div>
      <?php endif; ?>
    </div>

    <nav class="lms-menu">
      <a class="<?= active_menu('dashboard', $ACTIVE_MENU) ?>" href="/elms/student/index.php">
        <i class="bi bi-speedometer2"></i> Dashboard
      </a>

      <a class="<?= active_menu('modules', $ACTIVE_MENU) ?>" href="/elms/student/modules.php">
        <i class="bi bi-journal-bookmark"></i> My Modules
      </a>

      <a class="<?= active_menu('lessons', $ACTIVE_MENU) ?>" href="/elms/student/modules.php">
        <i class="bi bi-play-circle"></i> Lessons
      </a>

      <a class="<?= active_menu('assessments', $ACTIVE_MENU) ?>" href="/elms/student/assessments/index.php">
        <i class="bi bi-clipboard-check"></i> Assessments
      </a>

      <a class="<?= active_menu('submissions', $ACTIVE_MENU) ?>" href="/elms/student/assessments/submissions.php">
        <i class="bi bi-upload"></i> My Submissions
      </a>

      <a class="<?= active_menu('attendance', $ACTIVE_MENU) ?>" href="/elms/student/attendance.php">
        <i class="bi bi-calendar-check"></i> Attendance
      </a>

      <a class="<?= active_menu('payments', $ACTIVE_MENU) ?>" href="/elms/student/payments.php">
        <i class="bi bi-credit-card"></i> Payments
      </a>

      <a class="<?= active_menu('notices', $ACTIVE_MENU) ?>" href="/elms/student/notices.php">
        <i class="bi bi-megaphone"></i> Notices
      </a>

      <a class="<?= active_menu('results', $ACTIVE_MENU) ?>" href="/elms/student/results.php">
        <i class="bi bi-award"></i> Results
      </a>

      <a class="<?= active_menu('profile', $ACTIVE_MENU) ?>" href="/elms/student/profile.php">
        <i class="bi bi-person-circle"></i> Profile
      </a>
    </nav>

    <div class="sidebar-footer">
      <a href="/elms/student/logout.php" class="btn btn-outline-light logout-btn">
        <i class="bi bi-box-arrow-right me-1"></i> Logout
      </a>
    </div>
  </aside>

  <main class="lms-main">
    <header class="lms-topbar">
      <div class="d-flex align-items-center gap-3">
        <button class="btn btn-outline-secondary mobile-menu-btn" type="button" id="mobileMenuBtn">
          <i class="bi bi-list"></i>
        </button>
        <div>
          <h1 class="page-title"><?= s_h($PAGE_TITLE) ?></h1>
          <div class="page-subtitle">Welcome back, <?= s_h($student_name) ?></div>
        </div>
      </div>

      <div class="top-actions">
        <span class="badge rounded-pill text-bg-light border">
          <i class="bi bi-shield-check text-success me-1"></i> Active
        </span>
      </div>
    </header>

    <section class="lms-content">