<!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 ?? 'Admin Dashboard'; ?> - <?php echo $siteSettings['institute_name'] ?? 'Smart Tuitions'; ?></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'); ?>">
 
 <?php
 // Global Auth User
 $authUser = \App\Core\Auth::user();
 
 // Dynamic Theme Configuration
 $role = $authUser['role'] ?? 'admin';
 $theme = [
    'accent' => $role === 'admin' ? 'blue' : 'purple',
    'color-hex' => $role === 'admin' ? '#2563eb' : '#9333ea',
    'bg' => $role === 'admin' ? 'bg-blue-600' : 'bg-purple-600',
    'bg-light' => $role === 'admin' ? 'bg-blue-50' : 'bg-purple-50',
    'border' => $role === 'admin' ? 'border-blue-100' : 'border-purple-100',
    'text' => $role === 'admin' ? 'text-blue-600' : 'text-purple-600',
    'hover-bg' => $role === 'admin' ? 'hover:bg-blue-700' : 'hover:bg-purple-700'
 ];
 ?>

 <style>
    :root {
        --primary-accent: <?php echo $theme['color-hex']; ?>;
    }
 </style>
</head>
<body class="admin-portal font-sans antialiased bg-slate-50 overflow-hidden" x-data="{ sidebarOpen: true, mobileSidebar: false, logoutModalOpen: false }">
 
 <?php require_once 'toast.php'; ?>

 <div class="h-screen flex overflow-hidden">
 <!-- Desktop Sidebar Wrapper -->
 <div :class="sidebarOpen ? 'w-64' : 'w-20'" class="hidden lg:flex flex-col flex-none transition-all duration-300 ease-in-out border-r border-gray-200 bg-white h-full">
 <?php include 'sidebar.php'; ?>
 </div>

 <!-- Mobile Sidebar (Overlay) -->
 <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-gray-600 bg-opacity-75" @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-white h-full">
 <?php include 'sidebar.php'; ?>
 </div>
 </div>
