<?php
// Memuat file konfigurasi dan fungsi utama
require_once $_SERVER['DOCUMENT_ROOT'] . '/yoga/includes/config.php';
require_once $_SERVER['DOCUMENT_ROOT'] . '/yoga/includes/functions.php';

// Menjalankan pengecekan login di setiap halaman
cek_login();

// Mengambil data user dan pengaturan untuk ditampilkan di header
$user = get_current_user_data();
$pengaturan = get_pengaturan();
?>
<!DOCTYPE html>
<html lang="id">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?php echo isset($page_title) ? htmlspecialchars($page_title) . ' - ' . htmlspecialchars($pengaturan['nama_perusahaan']) : htmlspecialchars($pengaturan['nama_perusahaan']); ?></title>
    
    <!-- Google Fonts: Inter -->
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap" rel="stylesheet">
    
    <!-- Tailwind CSS v3 -->
    <script src="https://cdn.tailwindcss.com"></script>
    
    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.1/css/all.min.css">

    <!-- jQuery (dikembalikan dari file asli Anda) -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.0/jquery.min.js"></script>
    
    <!-- HTML5 QR Scanner (dikembalikan dari file asli Anda) -->
    <script src="https://unpkg.com/html5-qrcode@2.0.9/dist/html5-qrcode.min.js"></script>
    
    <!-- Custom CSS for Modern UI -->
    <style>
        body { font-family: 'Inter', sans-serif; background-color: #1E293B; /* slate-800 */ color: #CBD5E1; /* slate-300 */ }
        .glass-effect { background-color: rgba(30, 41, 59, 0.6); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border: 1px solid rgba(255, 255, 255, 0.1); }
        .sidebar-link.active { background-color: rgba(59, 130, 246, 0.2); color: #F8FAFC; border-left-color: #3B82F6; }
        .sidebar-link.active i { color: #3B82F6; }
        .dropdown-menu.hidden { opacity: 0; transform: scale(0.95) translateY(-10px); pointer-events: none; }
    </style>
</head>
<body class="antialiased">
    <!-- Wrapper Utama -->
    <div id="app-wrapper" class="relative min-h-screen">
        <!-- Sidebar akan di-include di sini -->
        <?php include_once 'sidebar.php'; ?>

        <!-- Kontainer Utama (Header + Konten) -->
        <div id="main-container" class="flex-1 flex flex-col transition-all duration-300 ease-in-out">
            <!-- Header Atas (Top Bar) -->
            <header class="sticky top-0 h-20 z-30 glass-effect">
                <div class="flex items-center justify-between h-full px-4 sm:px-6">
                    <div class="flex items-center">
                        <!-- Tombol Hamburger yang selalu terlihat -->
                        <button id="sidebarToggle" class="text-slate-300 hover:text-white focus:outline-none">
                            <i class="fas fa-bars fa-lg"></i>
                        </button>
                        <h1 id="page-title" class="text-xl font-semibold text-slate-200 hidden sm:block ml-4">Dashboard</h1>
                    </div>
                    <div class="flex items-center space-x-4">
                        <div class="relative">
                            <button id="userMenuButton" class="flex items-center space-x-3 focus:outline-none">
                                <span class="hidden sm:inline font-medium text-slate-300"><?php echo htmlspecialchars($user['nama']); ?></span>
                                <div class="w-10 h-10 rounded-full bg-sky-500 flex items-center justify-center text-white font-bold">
                                    <?php echo strtoupper(substr($user['nama'], 0, 1)); ?>
                                </div>
                            </button>
                            <div id="userDropdown" class="dropdown-menu hidden absolute right-0 mt-3 w-56 rounded-lg shadow-lg glass-effect p-1 transition-all">
                                <div class="px-3 py-2">
                                    <p class="text-sm font-semibold text-white"><?php echo htmlspecialchars($user['nama']); ?></p>
                                    <p class="text-xs text-slate-400 truncate"><?php echo htmlspecialchars($user['email'] ?? 'Tidak ada email'); ?></p>
                                </div>
                                <div class="border-t border-slate-600/50 my-1"></div>
                                <a href="<?php echo BASE_URL; ?>/modules/auth/ganti_password.php" class="flex items-center px-3 py-2 text-sm text-slate-300 hover:bg-slate-700 rounded-md transition-colors"><i class="fas fa-key w-6 text-slate-400"></i><span>Ganti Password</span></a>
                                <div class="border-t border-slate-600/50 my-1"></div>
                                <a href="<?php echo BASE_URL; ?>/modules/auth/logout.php" class="flex items-center px-3 py-2 text-sm text-red-400 hover:bg-red-500/20 rounded-md transition-colors"><i class="fas fa-sign-out-alt w-6"></i><span>Logout</span></a>
                            </div>
                        </div>
                    </div>
                </div>
            </header>
            <!-- Area Konten Dinamis -->
            <main class="p-4 sm:p-6 lg:p-8 flex-1">
                <!-- Konten halaman akan dimulai di sini -->
