<!-- Top Navigation Bar -->
<header class="top-bar">
    <div class="top-bar-page-title" style="display: flex; align-items: center; gap: 10px; flex-wrap: wrap;">
        <button class="mobile-menu-toggle" id="mobile-menu-toggle" title="القائمة">
            <i class="fa-solid fa-bars"></i>
        </button>
        <i class="fa-solid <?php echo isset($pageIcon) ? $pageIcon : 'fa-chart-pie'; ?>" style="color:var(--primary);"></i>
        <span><?php echo isset($pageTitle) ? $pageTitle : 'لوحة التحكم'; ?></span>

        <!-- System Refresh & Clear Cache Button next to title word -->
        <button type="button" class="btn-refresh-cache" id="system-refresh-btn" onclick="refreshSystemAndClearCache(this)" title="تحديث بيانات السيرفر ومسح الذاكرة المؤقتة (الكاش)">
            <i class="fa-solid fa-arrows-rotate" id="refresh-cache-icon"></i>
            <span class="refresh-btn-text">تحديث النظام والكاش</span>
        </button>
    </div>
    <div class="top-bar-actions">
        <button class="theme-toggle-btn" id="theme-toggle" title="تغيير المظهر">
            <i class="fa-solid fa-moon"></i>
        </button>
        <div class="notification-bell">
            <i class="fa-solid fa-bell"></i>
            <span class="badge"></span>
        </div>
    </div>
</header>
