<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><?= e($pageTitle ?? 'Dashboard') ?> - <?= e(Auth::tenant()['business_name']) ?> | TellerPro</title>
    <meta name="csrf-token" content="<?= Security::generateCsrfToken() ?>">
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/app.css">
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/purchases')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/purchases.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/dashboard')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/dashboard.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/sales/pos')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/pos.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/products')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/products.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/sales')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/sales.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/inventory')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/inventory.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/reports') || str_contains($_SERVER['REQUEST_URI'] ?? '', '/stock-takings')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/reports.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/users') || str_contains($_SERVER['REQUEST_URI'] ?? '', '/roles')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/users.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/billing')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/billing.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/notifications')): ?>
    <link rel="stylesheet" href="<?= APP_URL ?>/assets/css/notifications.css">
    <?php endif; ?>
    <?php if (str_contains($_SERVER['REQUEST_URI'] ?? '', '/pos')): ?>
    <script src="<?= APP_URL ?>/assets/js/html5-qrcode.min.js"></script>
    <script>
        console.log('html5-qrcode local script loaded');
    </script>
    <?php endif; ?>
</head>
<body>
    <div class="app-wrapper">
        
        <!-- Sidebar -->
        <aside class="sidebar" id="sidebar">
            <div class="sidebar-logo">
                <button class="sidebar-collapse-btn" id="sidebarCollapseBtn" title="Collapse sidebar">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="15 18 9 12 15 6"></polyline></svg>
                </button>
                <?php if ($logo = Auth::tenant()['logo']): ?>
                    <img src="<?= APP_URL ?>/uploads/<?= Auth::tenantId() ?>/<?= e($logo) ?>" alt="Logo">
                <?php else: ?>
                    <div style="width:36px; height:36px; border-radius:6px; background:var(--primary); display:flex; align-items:center; justify-content:center; font-weight:bold; color:white;">
                        <?= strtoupper(substr(Auth::tenant()['business_name'], 0, 1)) ?>
                    </div>
                <?php endif; ?>
                <div class="sidebar-logo-content">
                    <div class="sidebar-logo-text truncate" style="max-width: 140px;"><?= e(Auth::tenant()['business_name']) ?></div>
                    <div class="sidebar-logo-sub">TellerPro Workspace</div>
                </div>
            </div>

            <div class="sidebar-section mt-4">
                <div class="sidebar-section-label">Overview</div>
                <?php if (Auth::can('dashboard.view')): ?>
                <a href="<?= APP_URL ?>/dashboard" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/dashboard') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="3" width="7" height="9"></rect><rect x="14" y="3" width="7" height="5"></rect><rect x="14" y="12" width="7" height="9"></rect><rect x="3" y="16" width="7" height="5"></rect></svg>
                    Dashboard
                </a>
                <?php endif; ?>
            </div>

            <div class="sidebar-section">
                <div class="sidebar-section-label">Transactions</div>
                <?php if (Auth::can('sales.view')): ?>
                <a href="<?= APP_URL ?>/sales" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/sales') && !str_contains($_SERVER['REQUEST_URI'], 'pos') && !str_contains($_SERVER['REQUEST_URI'], '/create') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="9" cy="21" r="1"></circle><circle cx="20" cy="21" r="1"></circle><path d="M1 1h4l2.68 13.39a2 2 0 0 0 2 1.61h9.72a2 2 0 0 0 2-1.61L23 6H6"></path></svg>
                    Sales & Invoices
                </a>
                <?php endif; ?>
                <?php if (Auth::can('sales.create') || Auth::can('sales.view')): ?>
                <div class="nav-sub-items">
                    <?php if (Auth::can('sales.create')): ?>
                    <a href="<?= APP_URL ?>/sales/create" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/create') ? 'active' : '' ?>">Create Sale</a>
                    <?php endif; ?>
                    <?php if (Auth::can('sales.view')): ?>
                    <a href="<?= APP_URL ?>/sales" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/sales') && !str_contains($_SERVER['REQUEST_URI'], '/create') ? 'active' : '' ?>">Sales History</a>
                    <?php endif; ?>
                </div>
                <?php endif; ?>
                <?php if (Auth::can('pos.access')): ?>
                <a href="<?= APP_URL ?>/sales/pos" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/sales/pos') || str_contains($_SERVER['REQUEST_URI'], '/pos') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="4" y="4" width="16" height="16" rx="2" ry="2"></rect><rect x="9" y="9" width="6" height="6"></rect><line x1="9" y1="1" x2="9" y2="4"></line><line x1="15" y1="1" x2="15" y2="4"></line><line x1="9" y1="20" x2="9" y2="23"></line><line x1="15" y1="20" x2="15" y2="23"></line><line x1="20" y1="9" x2="23" y2="9"></line><line x1="20" y1="14" x2="23" y2="14"></line><line x1="1" y1="9" x2="4" y2="9"></line><line x1="1" y1="14" x2="4" y2="14"></line></svg>
                    <span style="color:var(--accent);">POS Terminal</span>
                </a>
                <?php endif; ?>
                <?php if (Auth::can('purchases.view')): ?>
                <a href="<?= APP_URL ?>/purchases" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/purchases') && !str_contains($_SERVER['REQUEST_URI'], '/create') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
                    Purchases
                </a>
                <?php endif; ?>
                <?php if (Auth::can('purchases.view') || Auth::can('purchases.create')): ?>
                <div class="nav-sub-items">
                    <?php if (Auth::can('purchases.view')): ?>
                    <a href="<?= APP_URL ?>/purchases" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/purchases') && !str_contains($_SERVER['REQUEST_URI'], '/create') ? 'active' : '' ?>">Purchase List</a>
                    <?php endif; ?>
                    <?php if (Auth::can('purchases.create')): ?>
                    <a href="<?= APP_URL ?>/purchases/create" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/purchases/create') ? 'active' : '' ?>">Add Purchase</a>
                    <?php endif; ?>
                </div>
                <?php endif; ?>
            </div>

            <div class="sidebar-section">
                <div class="sidebar-section-label">Inventory</div>
                <?php if (Auth::can('products.view')): ?>
                <a href="<?= APP_URL ?>/products" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/products') && !str_contains($_SERVER['REQUEST_URI'], '/settings') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 16V8a2 2 0 0 0-1-1.73l-7-4a2 2 0 0 0-2 0l-7 4A2 2 0 0 0 3 8v8a2 2 0 0 0 1 1.73l7 4a2 2 0 0 0 2 0l7-4A2 2 0 0 0 21 16z"></path><polyline points="3.27 6.96 12 12.01 20.73 6.96"></polyline><line x1="12" y1="22.08" x2="12" y2="12"></line></svg>
                    Products
                </a>
                <?php endif; ?>
                <?php if (Auth::can('categories.manage') || Auth::can('units.manage')): ?>
                <div class="nav-sub-items">
                    <?php if (Auth::can('categories.manage')): ?>
                    <a href="<?= APP_URL ?>/settings/categories" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/settings/categories') ? 'active' : '' ?>">Categories</a>
                    <?php endif; ?>
                    <?php if (Auth::can('units.manage')): ?>
                    <a href="<?= APP_URL ?>/settings/units" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/settings/units') ? 'active' : '' ?>">Units</a>
                    <?php endif; ?>
                </div>
                <?php endif; ?>
                <?php if (Auth::can('stock.view')): ?>
                <a href="<?= APP_URL ?>/inventory" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/inventory') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M21 8V21H3V8"></path><path d="M23 3H1v5h22V3z"></path><path d="M10 12h4"></path></svg>
                    Stock Management
                </a>
                <?php endif; ?>
                <?php if (Auth::can('stock.adjust')): ?>
                <a href="<?= APP_URL ?>/stock-takings" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/stock-takings') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M9 11l3 3L22 4"></path><path d="M21 12v7a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h11"></path></svg>
                    Stock Taking
                </a>
                <?php endif; ?>
                <?php if (Auth::can('stock.adjust') || Auth::can('stock.transfer')): ?>
                <div class="nav-sub-items">
                    <?php if (Auth::can('stock.adjust')): ?>
                    <a href="<?= APP_URL ?>/inventory/adjust" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/adjust') && !str_contains($_SERVER['REQUEST_URI'], '/adjustment-list') && !str_contains($_SERVER['REQUEST_URI'], '/reconcile') ? 'active' : '' ?>">New Adjustment</a>
                    <a href="<?= APP_URL ?>/inventory/adjustment-list" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/adjustment-list') ? 'active' : '' ?>">Adjustment List</a>
                    <?php endif; ?>
                    <?php if (Auth::can('stock.adjust')): ?>
                    <a href="<?= APP_URL ?>/inventory/reconcile" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/reconcile') ? 'active' : '' ?>">Stock Reconciliation</a>
                    <?php endif; ?>
                    <?php if (Auth::can('stock.transfer')): ?>
                    <a href="<?= APP_URL ?>/inventory/transfer" class="nav-sub-item <?= str_contains($_SERVER['REQUEST_URI'], '/transfer') ? 'active' : '' ?>">Transfer Stock</a>
                    <?php endif; ?>
                </div>
                <?php endif; ?>
            </div>

            <div class="sidebar-section">
                <div class="sidebar-section-label">Contacts</div>
                <?php if (Auth::can('customers.view')): ?>
                <a href="<?= APP_URL ?>/customers" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/customers') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M17 21v-2a4 4 0 0 0-4-4H5a4 4 0 0 0-4 4v2"></path><circle cx="9" cy="7" r="4"></circle><path d="M23 21v-2a4 4 0 0 0-3-3.87"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path></svg>
                    Customers
                </a>
                <?php endif; ?>
                <?php if (Auth::can('suppliers.view')): ?>
                <a href="<?= APP_URL ?>/suppliers" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/suppliers') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="3" y="4" width="18" height="18" rx="2" ry="2"></rect><line x1="16" y1="2" x2="16" y2="6"></line><line x1="8" y1="2" x2="8" y2="6"></line><line x1="3" y1="10" x2="21" y2="10"></line></svg>
                    Suppliers
                </a>
                <?php endif; ?>
                <?php if (Auth::can('suppliers.view')): ?>
                <a href="<?= APP_URL ?>/supplier-ledger" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/supplier-ledger') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
                    Supplier Ledger
                </a>
                <?php endif; ?>
                <?php if (Auth::can('customers.view')): ?>
                <a href="<?= APP_URL ?>/customer-ledger" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/customer-ledger') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z"></path><polyline points="14 2 14 8 20 8"></polyline><line x1="16" y1="13" x2="8" y2="13"></line><line x1="16" y1="17" x2="8" y2="17"></line><polyline points="10 9 9 9 8 9"></polyline></svg>
                    Customer Ledger
                </a>
                <?php endif; ?>
            </div>

            <?php if (Auth::can('reports.view') || Auth::can('tax.manage') || Auth::can('users.manage') || Auth::can('roles.manage') || Auth::can('settings.view') || Auth::can('billing.view')): ?>
            <div class="sidebar-section">
                <div class="sidebar-section-label">Admin</div>
                <?php if (Auth::can('reports.view')): ?>
                <a href="<?= APP_URL ?>/reports" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/reports') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="18" y1="20" x2="18" y2="10"></line><line x1="12" y1="20" x2="12" y2="4"></line><line x1="6" y1="20" x2="6" y2="14"></line></svg>
                    Reports
                </a>
                <?php endif; ?>
                <?php if (Auth::can('tax.manage')): ?>
                <a href="<?= APP_URL ?>/tax" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/tax') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="4" y="4" width="16" height="16" rx="2"></rect><line x1="12" y1="8" x2="12" y2="16"></line><line x1="8" y1="12" x2="16" y2="12"></line></svg>
                    Tax Groups
                </a>
                <?php endif; ?>
                <?php if (Auth::can('users.manage') || Auth::can('roles.manage')): ?>
                <a href="<?= APP_URL ?>/users" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/users') && !str_contains($_SERVER['REQUEST_URI'], '/roles') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 20h9"></path><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path></svg>
                    Users
                </a>
                <?php endif; ?>
                <?php if (Auth::can('roles.manage')): ?>
                <a href="<?= APP_URL ?>/roles" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/roles') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M12 20h9"></path><path d="M16.5 3.5a2.121 2.121 0 0 1 3 3L7 19l-4 1 1-4L16.5 3.5z"></path></svg>
                    Roles & Permissions
                </a>
                <?php endif; ?>
                <?php if (Auth::can('settings.view')): ?>
                <a href="<?= APP_URL ?>/settings" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/settings') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"></circle><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 0 1 0 2.83 2 2 0 0 1-2.83 0l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 0 1-2 2 2 2 0 0 1-2-2v-.09A1.65 1.65 0 0 0 9 19.4a1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 0 1-2.83 0 2 2 0 0 1 0-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 0 1-2-2 2 2 0 0 1 2-2h.09A1.65 1.65 0 0 0 4.6 9a1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 0 1 0-2.83 2 2 0 0 1 2.83 0l.06.06a1.65 1.65 0 0 0 1.82.33H9a1.65 1.65 0 0 0 1-1.51V3a2 2 0 0 1 2-2 2 2 0 0 1 2 2v.09a1.65 1.65 0 0 0 1 1.51 1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 0 1 2.83 0 2 2 0 0 1 0 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82V9a1.65 1.65 0 0 0 1.51 1H21a2 2 0 0 1 2 2 2 2 0 0 1-2 2h-.09a1.65 1.65 0 0 0-1.51 1z"></path></svg>
                    Settings
                </a>
                <?php endif; ?>
                <?php if (Auth::can('billing.view')): ?>
                <a href="<?= APP_URL ?>/billing" class="nav-item <?= str_contains($_SERVER['REQUEST_URI'], '/billing') ? 'active' : '' ?>">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><rect x="1" y="4" width="22" height="16" rx="2" ry="2"></rect><line x1="1" y1="10" x2="23" y2="10"></line></svg>
                    Billing & Plan
                </a>
                <?php endif; ?>
            </div>
            <?php endif; ?>

            <div class="sidebar-footer">
                <a href="<?= APP_URL ?>/billing" class="sidebar-user" style="margin-bottom:10px; display:block; text-decoration:none;">
                    <div style="font-size:0.75rem; color:var(--text-muted); margin-bottom:4px;">Plan Usage</div>
                    <div class="usage-bar-wrap" style="margin:0;">
                        <?php 
                        $usageData = $usage ?? PlanGuard::getUsage(); 
                        $pct = $usageData['products']['limit'] > 0 ? min(100, ($usageData['products']['current'] / $usageData['products']['limit']) * 100) : 0;
                        ?>
                        <div class="usage-bar-track" style="height:4px;"><div class="usage-bar-fill" style="width:<?= $pct ?>%"></div></div>
                    </div>
                </a>
                <a href="<?= APP_URL ?>/logout" class="sidebar-user" style="text-decoration:none;cursor:pointer;">
                    <div class="user-avatar"><?= strtoupper(substr(Auth::user()['name'], 0, 1)) ?></div>
                    <div class="user-meta">
                        <div class="user-name"><?= e(Auth::user()['name']) ?></div>
                        <div class="user-role"><?= e(Auth::role()) ?></div>
                    </div>
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" style="width:16px;height:16px;color:var(--text-muted)"><path d="M9 21H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h4"></path><polyline points="16 17 21 12 16 7"></polyline><line x1="21" y1="12" x2="9" y2="12"></line></svg>
                </a>
            </div>
        </aside>
        <script>
            // Instant sidebar scroll restoration
            (function() {
                const sidebar = document.getElementById('sidebar');
                const scrollPos = sessionStorage.getItem('sidebarScrollTop');
                if (scrollPos) {
                    sidebar.scrollTop = parseInt(scrollPos);
                }
            })();
        </script>

        <!-- Main Content -->
        <main class="main-content">
            
            <!-- Topbar -->
            <header class="topbar">
                <button class="topbar-btn mobile-menu-btn" onclick="document.getElementById('sidebar').classList.toggle('open')">
                    <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><line x1="3" y1="12" x2="21" y2="12"></line><line x1="3" y1="6" x2="21" y2="6"></line><line x1="3" y1="18" x2="21" y2="18"></line></svg>
                </button>
                <div class="topbar-title">
                    <?= e($pageTitle ?? 'Dashboard') ?>
                </div>

                <div class="topbar-actions">
                    <a href="<?= APP_URL ?>/sales/pos" class="btn btn-primary btn-sm" title="POS Terminal (F4)">POS</a>
                    <a href="<?= APP_URL ?>/notifications" class="topbar-btn">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><path d="M18 8A6 6 0 0 0 6 8c0 7-3 9-3 9h18s-3-2-3-9"></path><path d="M13.73 21a2 2 0 0 1-3.46 0"></path></svg>
                        <?php if (($notifCount ?? NotificationModel::unreadCount()) > 0): ?>
                            <span class="notif-dot"></span>
                        <?php endif; ?>
                    </a>
                </div>
            </header>

            <div class="page-content">
                <?php if ($flashErr = getFlash('error')): ?>
                    <div class="alert alert-error">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12.01" y2="16"></line></svg>
                        <?= e($flashErr) ?>
                    </div>
                <?php endif; ?>
                <?php if ($flashSucc = getFlash('success')): ?>
                    <div class="alert alert-success">
                        <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="20 6 9 17 4 12"></polyline></svg>
                        <?= e($flashSucc) ?>
                    </div>
                <?php endif; ?>

                <?= $content ?? '' ?>
            </div>

        </main>
    </div>

    <!-- Mobile Sidebar Overlay -->
    <div class="sidebar-overlay" id="sidebarOverlay" onclick="document.getElementById('sidebar').classList.remove('open')"></div>

    <!-- Scripts -->
    <script src="<?= APP_URL ?>/assets/js/optimization.js"></script>
    <script>
        // Sidebar collapse/expand functionality
        const sidebar = document.getElementById('sidebar');
        const collapseBtn = document.getElementById('sidebarCollapseBtn');
        const appWrapper = document.querySelector('.app-wrapper');
        
        // Load saved state from localStorage
        const savedState = localStorage.getItem('sidebarCollapsed');
        if (savedState === 'true') {
            sidebar.classList.add('collapsed');
            appWrapper.classList.add('sidebar-collapsed');
        }
        
        // Toggle collapse on button click
        collapseBtn.addEventListener('click', function() {
            sidebar.classList.toggle('collapsed');
            appWrapper.classList.toggle('sidebar-collapsed');
            localStorage.setItem('sidebarCollapsed', sidebar.classList.contains('collapsed'));
        });
        
        // On mobile, ensure sidebar is not collapsed (use open/close instead)
        if (window.innerWidth < 1024) {
            sidebar.classList.remove('collapsed');
            appWrapper.classList.remove('sidebar-collapsed');
        }
        
        // Handle window resize
        window.addEventListener('resize', function() {
            if (window.innerWidth >= 1024) {
                // On desktop, restore collapsed state
                const savedState = localStorage.getItem('sidebarCollapsed');
                if (savedState === 'true') {
                    sidebar.classList.add('collapsed');
                    appWrapper.classList.add('sidebar-collapsed');
                } else {
                    sidebar.classList.remove('collapsed');
                    appWrapper.classList.remove('sidebar-collapsed');
                }
            } else {
                // On mobile, remove collapsed state (use open/close instead)
                sidebar.classList.remove('collapsed');
                appWrapper.classList.remove('sidebar-collapsed');
            }
        });

        // Prevent scroll-to-top behavior on sidebar navigation clicks
        document.querySelectorAll('.nav-item, .nav-sub-item').forEach(function(link) {
            link.addEventListener('click', function(e) {
                // Store sidebar scroll position before navigation
                const sidebarScroll = sidebar.scrollTop;
                sessionStorage.setItem('sidebarScrollTop', sidebarScroll);
            });
        });

        // Clear sidebar scroll position after a short delay to ensure it's used
        // but doesn't persist forever across different sessions
        window.addEventListener('load', function() {
            setTimeout(() => {
                sessionStorage.removeItem('sidebarScrollTop');
            }, 100);
        });
    </script>
</body>
</html>
