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

    <!-- Bootstrap 5 -->
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css" rel="stylesheet">

    <!-- Font -->
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">

    <style>
        body {
            font-family: 'Inter', sans-serif;
            background-color: #f4f6f8;
        }

        .navbar {
            background-color: #0f5132;
        }

        .navbar-brand, .navbar-text, .nav-link {
            color: #fff !important;
            font-weight: 500;
        }

        .sidebar {
            min-height: 100vh;
            background-color: #ffffff;
            border-right: 1px solid #dee2e6;
        }

        .sidebar a {
            color: #333;
            text-decoration: none;
            display: block;
            padding: 10px 15px;
            border-radius: 6px;
            margin-bottom: 4px;
        }

        .sidebar a:hover,
        .sidebar a.active {
            background-color: #e9f5ef;
            color: #0f5132;
            font-weight: 500;
        }

        .content-wrapper {
            padding: 24px;
        }

        .card {
            border-radius: 10px;
        }
    </style>
</head>
<body>

<!-- HEADER -->
<nav class="navbar navbar-expand-lg shadow-sm">
    <div class="container-fluid">
        <span class="navbar-brand">PPDB Sekolah Acropolis</span>

        <div class="ms-auto navbar-text">
            <?= session('ppdb_nama') ?>
            <a href="<?= site_url('ppdb/logout') ?>" class="ms-3 text-white text-decoration-none">
                Logout
            </a>
        </div>
    </div>
</nav>

<div class="container-fluid">
    <div class="row">

        <!-- SIDEBAR -->
        <div class="col-md-2 sidebar p-3">
            <a href="<?= site_url('ppdb/dashboard') ?>" class="active">Dashboard</a>
            <a href="#">Profil Siswa</a>
            <a href="#">Dokumen</a>
            <a href="#">Jadwal Seleksi</a>
            <a href="#">Pengumuman</a>
        </div>

        <!-- CONTENT -->
        <div class="col-md-10 content-wrapper">
            <?= $this->renderSection('content') ?>
        </div>

    </div>
</div>

</body>
</html>
