<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= e($pageTitle ?? 'Dashboard') ?> — <?= APP_NAME ?></title>
<!-- Bootstrap 5.3 -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">
<!-- Bootstrap Icons -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css" rel="stylesheet">
<!-- Google Fonts -->
<link href="https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=Playfair+Display:wght@600&display=swap" rel="stylesheet">
<!-- Custom CSS -->
<link href="<?= BASE_URL ?>/assets/css/app.css" rel="stylesheet">
</head>
<body class="sb-nav-fixed">

<!-- TOP NAVBAR -->
<nav class="sb-topnav navbar navbar-expand navbar-dark">
  <a class="navbar-brand ps-3 d-flex align-items-center gap-2" href="<?= BASE_URL ?>/modules/dashboard/index.php">
    <div class="brand-icon"><i class="bi bi-mortarboard-fill"></i></div>
    <div>
      <span class="brand-name"><?= APP_NAME ?></span>
      <span class="brand-sub d-none d-md-block">Kab. Malang</span>
    </div>
  </a>

  <!-- Toggle sidebar mobile -->
  <button class="btn btn-link btn-sm order-1 order-lg-0 me-4 me-lg-0" id="sidebarToggle">
    <i class="bi bi-list fs-5 text-white"></i>
  </button>

  <div class="ms-auto me-3 d-flex align-items-center gap-3">
    <!-- Notif badge -->
    <div class="dropdown d-none d-sm-flex">
      <button class="btn btn-link text-white position-relative" data-bs-toggle="dropdown">
        <i class="bi bi-bell-fill"></i>
        <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-warning" style="font-size:.6rem;">3</span>
      </button>
      <ul class="dropdown-menu dropdown-menu-end shadow-lg border-0" style="min-width:280px">
        <li><h6 class="dropdown-header">Notifikasi</h6></li>
        <li><a class="dropdown-item small py-2" href="#">Agenda hari ini: Monitoring SMPN 1 Malang</a></li>
        <li><a class="dropdown-item small py-2" href="#">Laporan minggu ini belum diisi</a></li>
        <li><hr class="dropdown-divider"></li>
        <li><a class="dropdown-item text-center small text-primary" href="#">Lihat semua</a></li>
      </ul>
    </div>

    <!-- User menu -->
    <div class="dropdown">
      <button class="btn btn-link d-flex align-items-center gap-2 text-decoration-none text-white" data-bs-toggle="dropdown">
        <div class="avatar-sm">
          <?= strtoupper(substr($_SESSION['nama'] ?? 'A', 0, 1)) ?>
        </div>
        <div class="d-none d-md-block text-start lh-1">
          <div class="small fw-semibold"><?= e($_SESSION['nama'] ?? '') ?></div>
          <div style="font-size:.68rem;opacity:.75"><?= ucfirst($_SESSION['role'] ?? '') ?></div>
        </div>
        <i class="bi bi-chevron-down small ms-1"></i>
      </button>
      <ul class="dropdown-menu dropdown-menu-end shadow border-0">
        <li><a class="dropdown-item" href="<?= BASE_URL ?>/modules/profil/index.php"><i class="bi bi-person me-2"></i>Profil</a></li>
        <?php if(isAdmin()): ?>
        <li><a class="dropdown-item" href="<?= BASE_URL ?>/modules/users/index.php"><i class="bi bi-people me-2"></i>Kelola User</a></li>
        <?php endif; ?>
        <li><hr class="dropdown-divider"></li>
        <li><a class="dropdown-item text-danger" href="<?= BASE_URL ?>/modules/auth/logout.php"><i class="bi bi-box-arrow-right me-2"></i>Logout</a></li>
      </ul>
    </div>
  </div>
</nav>

<div id="layoutSidenav">
  <!-- SIDEBAR -->
  <div id="layoutSidenav_nav">
    <nav class="sb-sidenav" id="sidenavAccordion">
      <div class="sb-sidenav-menu">
        <div class="nav">

          <!-- Info user di sidebar (mobile) -->
          <div class="sb-sidenav-menu-heading d-lg-none">Selamat datang</div>

          <!-- Dashboard -->
          <div class="sb-sidenav-menu-heading">Utama</div>
          <a class="nav-link <?= ($activePage ?? '') === 'dashboard' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/dashboard/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-speedometer2"></i></div>
            Dashboard
          </a>

          <!-- Profil -->
          <a class="nav-link <?= ($activePage ?? '') === 'profil' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/profil/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-person-badge"></i></div>
            Profil Pendamping
          </a>

          <!-- Data Referensi -->
          <div class="sb-sidenav-menu-heading">Data Referensi</div>

          <a class="nav-link <?= ($activePage ?? '') === 'sekolah' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/sekolah/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-building"></i></div>
            Data Sekolah
          </a>

          <a class="nav-link <?= ($activePage ?? '') === 'program_kerja' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/program_kerja/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-clipboard2-check"></i></div>
            Program Kerja
          </a>

          <!-- Kegiatan -->
          <div class="sb-sidenav-menu-heading">Kegiatan</div>

          <a class="nav-link <?= ($activePage ?? '') === 'agenda' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/agenda/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-calendar3"></i></div>
            Agenda Kegiatan
          </a>

          <a class="nav-link <?= ($activePage ?? '') === 'kegiatan' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/kegiatan/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-journal-text"></i></div>
            Kegiatan Pendampingan
          </a>

          <!-- Dokumen -->
          <div class="sb-sidenav-menu-heading">Dokumentasi</div>

          <a class="nav-link <?= ($activePage ?? '') === 'dokumen' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/dokumen/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-folder2-open"></i></div>
            Dokumen
          </a>

          <a class="nav-link <?= ($activePage ?? '') === 'pengembangan' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/pengembangan_diri/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-award"></i></div>
            Pengembangan Diri
          </a>

          <!-- Laporan -->
          <div class="sb-sidenav-menu-heading">Laporan</div>
          <a class="nav-link <?= ($activePage ?? '') === 'laporan' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/exports/laporan.php">
            <div class="sb-nav-link-icon"><i class="bi bi-printer"></i></div>
            Cetak Laporan
          </a>

          <?php if(isAdmin()): ?>
          <div class="sb-sidenav-menu-heading">Admin</div>
          <a class="nav-link <?= ($activePage ?? '') === 'users' ? 'active' : '' ?>"
             href="<?= BASE_URL ?>/modules/users/index.php">
            <div class="sb-nav-link-icon"><i class="bi bi-people-fill"></i></div>
            Manajemen User
          </a>
          <?php endif; ?>

        </div>
      </div>

      <!-- Footer sidebar -->
      <div class="sb-sidenav-footer">
        <div class="small">Versi <?= APP_VERSION ?> &copy; <?= APP_YEAR ?></div>
        <div class="small text-truncate opacity-75"><?= APP_INSTANSI ?></div>
      </div>
    </nav>
  </div>

  <!-- MAIN CONTENT -->
  <div id="layoutSidenav_content">
    <main class="main-content">
      <!-- Flash Messages -->
      <?php if($msg = getFlash('success')): ?>
      <div class="alert alert-success alert-dismissible fade show mx-4 mt-3 mb-0 border-0 shadow-sm" role="alert">
        <i class="bi bi-check-circle-fill me-2"></i><?= e($msg) ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      </div>
      <?php endif; ?>
      <?php if($msg = getFlash('error')): ?>
      <div class="alert alert-danger alert-dismissible fade show mx-4 mt-3 mb-0 border-0 shadow-sm" role="alert">
        <i class="bi bi-exclamation-triangle-fill me-2"></i><?= e($msg) ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
      </div>
      <?php endif; ?>
