<aside id="sidebar">
    <div class="sidebar-content flex-grow-1">
        <div class="d-flex justify-content-center align-items-center p-3">
            <img src="../public/favicon.ico" alt="Logo" class="img-fluid" style="max-width: 120px;">
        </div>
        <ul class="nav flex-column p-2 ms-3">
            <li class="nav-item">
                <a href="?page=dashboard" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-house me-2"></i>
                    <span class="fw-bold">DASHBOARD</span>
                </a>
            </li>
            <li class="nav-item mt-3">
                <a href="?page=users" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-user me-2"></i>
                    <span class="fw-bold">USUARIOS</span>
                </a>
            </li>
            <li class="nav-item mt-3">
                <a href="?page=galleries" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-images me-2"></i>
                    <span class="fw-bold">GALERÍA</span>
                </a>
            </li>
            <li class="nav-item mt-3">
                <a href="?page=events" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-calendar me-2"></i>
                    <span class="fw-bold">EVENTOS</span>
                </a>
            </li>
            <li class="nav-item mt-3">
                <a href="?page=videos" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-circle-play me-2"></i>
                    <span class="fw-bold">VIDEOS</span>
                </a>
            </li>
            <li class="nav-item mt-3">
                <a href="?page=blogs" class="nav-link text-white d-flex align-items-center">
                    <i class="fa-solid fa-newspaper me-2"></i>
                    <span class="fw-bold">BLOGS</span>
                </a>
            </li>
        </ul>
    </div>

    <div class="sidebar-footer p-3 border-top border-secondary">
        <button id="logout" class="btn text-white w-100 d-flex align-items-center justify-content-center">
            <i class="fa-solid fa-right-from-bracket me-2"></i>
            <span>Cerrar Sesión</span>
        </button>
    </div>
</aside>
<header class="text-white p-3">
    <div class="d-flex justify-content-between align-items-center">
        <button class="menu-toggle btn btn-dark d-lg-none me-2" id="menu-toggle" type="button">
            <i class="fa fa-bars"></i>
        </button>
        <h1 class="h4 m-0">Sistema</h1>
    </div>
</header>
<main class="bg-light d-flex flex-column flex-grow-1">
    <?php
    $page = $_GET['page'] ?? 'dashboard';
    $path = __DIR__ . "/../pages/{$page}/{$page}.php";
    if (file_exists($path)) {
        require_once $path;
    } else {
        require_once __DIR__ . "/../pages/not-found/not-found.php";
    }
    ?>
</main>