<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <meta name="viewport" content="width=device-width, initial-scale=1.0">
 <?php 
 $db = \App\Core\Database::getInstance();
 $settingsStmt = $db->query(" SELECT * FROM settings");
 $allSettings = $settingsStmt->fetchAll();
 $siteSettings = [];
 foreach ($allSettings as $s) {
 $siteSettings[$s['key_name']] = $s['key_value'];
 }
 ?>
 <title><?php echo $title ?? 'Dashboard'; ?> - <?php echo $siteSettings['institute_name'] ?? 'TMS'; ?></title>
 
 <?php if(!empty($siteSettings['institute_logo'])): ?>
 <link rel="icon" type="image/x-icon" href="<?php echo url($siteSettings['institute_logo']); ?>">
 <?php endif; ?>

 <script defer src="<?php echo url('assets/vendor/alpinejs/alpine.min.js'); ?>"></script>
 <link rel="stylesheet" href="<?php echo url('assets/vendor/fontawesome/css/all.min.css'); ?>">
 <link rel="stylesheet" href="<?php echo url('assets/css/style.css'); ?>">
</head>
<body class="font-sans antialiased bg-slate-50 overflow-hidden" x-data="{ sidebarOpen: true, mobileSidebar: false }">
 <div class="h-screen flex overflow-hidden">
 <!-- Desktop Sidebar -->
 <div :class="sidebarOpen ? 'w-60' : 'w-0'" class="hidden lg:flex flex-col flex-none transition-all duration-300 ease-in-out border-r border-emerald-800 bg-emerald-700 h-full overflow-hidden">
 <?php include 'sidebar.php'; ?>
 </div>

 <!-- Mobile Sidebar -->
 <div x-show="mobileSidebar" class="fixed inset-0 z-50 lg:hidden" x-cloak>
 <div x-show="mobileSidebar" x-transition:enter="transition-opacity ease-linear duration-300" x-transition:enter-start="opacity-0" x-transition:enter-end="opacity-100" x-transition:leave="transition-opacity ease-linear duration-300" x-transition:leave-start="opacity-100" x-transition:leave-end="opacity-0" class="fixed inset-0 bg-emerald-900/40 backdrop-blur-sm" @click="mobileSidebar = false"></div>
 <div x-show="mobileSidebar" x-transition:enter="transition ease-in-out duration-300 transform" x-transition:enter-start="-translate-x-full" x-transition:enter-end="translate-x-0" x-transition:leave="transition ease-in-out duration-300 transform" x-transition:leave-start="translate-x-0" x-transition:leave-end="-translate-x-full" class="relative flex-1 flex flex-col max-w-xs w-full bg-emerald-700 h-full">
 <?php include 'sidebar.php'; ?>
 </div>
 </div>

 <div class="flex-1 flex flex-col min-w-0 h-full overflow-hidden relative">
 <?php require_once 'topbar.php'; ?>
 <div class="flex-1 relative overflow-y-auto bg-[#F8FAFC] custom-scrollbar">
