38682-vm/admin/includes/header.php
Flatlogic Bot 6e5310e4dc update pos
2026-02-24 17:07:31 +00:00

645 lines
33 KiB
PHP

<?php
if (session_status() === PHP_SESSION_NONE) {
session_start();
}
// Ensure functions are available
if (file_exists(__DIR__ . '/../../db/config.php')) {
require_once __DIR__ . '/../../db/config.php';
}
if (file_exists(__DIR__ . '/../../includes/functions.php')) {
require_once __DIR__ . '/../../includes/functions.php';
}
if (file_exists(__DIR__ . '/../../includes/lang.php')) {
require_once __DIR__ . '/../../includes/lang.php';
}
// Handle language switching
if (isset($_GET['lang'])) {
$allowed_langs = ['en', 'ar'];
if (in_array($_GET['lang'], $allowed_langs)) {
$_SESSION['lang'] = $_GET['lang'];
}
// Remove lang from URL to prevent infinite redirect or messy URLs
$current_url = strtok($_SERVER["REQUEST_URI"], '?');
$query = $_GET;
unset($query['lang']);
if (count($query) > 0) {
$current_url .= '?' . http_build_query($query);
}
header("Location: $current_url");
exit;
}
$currentLang = $_SESSION['lang'] ?? 'en';
$isRTL = ($currentLang === 'ar');
// Require login for all admin pages
if (function_exists('require_login')) {
require_login();
}
// Trigger auto backup if needed
if (function_exists('trigger_auto_backup')) {
trigger_auto_backup();
}
$currentUser = function_exists('get_logged_user') ? get_logged_user() : null;
$userName = $currentUser['full_name'] ?? ($currentUser['username'] ?? 'Admin');
$userGroup = $currentUser['group_name'] ?? 'System';
$userInitial = strtoupper(substr($userName, 0, 1));
$userPic = $currentUser['profile_pic'] ?? null;
$companySettings = function_exists('get_company_settings') ? get_company_settings() : [];
$companyName = $companySettings['company_name'] ?? 'Foody';
$logoUrl = $companySettings['logo_url'] ?? '';
$faviconUrl = $companySettings['favicon_url'] ?? '';
// Simple active link helper
function isActive($page) {
return basename($_SERVER['PHP_SELF']) === $page ? 'active' : '';
}
// Group active helper
function isGroupActive($pages) {
return in_array(basename($_SERVER['PHP_SELF']), $pages) ? 'show' : '';
}
function isGroupExpanded($pages) {
return in_array(basename($_SERVER['PHP_SELF']), $pages) ? 'true' : 'false';
}
function getGroupToggleClass($pages) {
return in_array(basename($_SERVER['PHP_SELF']), $pages) ? '' : 'collapsed';
}
// Permission helper for sidebar
function can_view($module) {
if (!function_exists('has_permission')) return true;
return has_permission($module . '_view') || has_permission($module);
}
?>
<!doctype html>
<html lang="<?= $currentLang ?>" dir="<?= $isRTL ? 'rtl' : 'ltr' ?>">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title><?= htmlspecialchars($companyName) ?> Admin Panel</title>
<?php if ($faviconUrl): ?>
<link rel="icon" href="../<?= htmlspecialchars($faviconUrl) ?>">
<?php endif; ?>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.10.5/font/bootstrap-icons.css" rel="stylesheet">
<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&family=Noto+Sans+Arabic:wght@400;500;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="../assets/css/custom.css?v=<?= time() ?>">
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
<style>
/* Base styles using CSS variables for theming */
body {
font-family: 'Inter', 'Noto Sans Arabic', sans-serif;
background-color: var(--bg-body);
color: var(--text-primary);
}
.sidebar {
height: 100vh;
position: fixed;
top: 0;
<?= $isRTL ? 'right: 0; border-left: 1px solid var(--border-color); border-right: none;' : 'left: 0; border-right: 1px solid var(--border-color); border-left: none;' ?>
width: 250px;
background: var(--bg-sidebar);
padding-top: 0;
z-index: 1060;
overflow-y: auto;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
.sidebar-header {
padding: 1rem 1.5rem;
border-bottom: 1px solid var(--border-color);
position: sticky;
top: 0;
background: var(--bg-sidebar);
z-index: 10;
transition: background-color 0.3s ease, border-color 0.3s ease;
}
.sidebar .nav-link {
color: var(--text-secondary);
padding: 0.6rem 1.5rem;
font-weight: 500;
font-size: 0.95rem;
transition: all 0.2s ease;
<?= $isRTL ? 'text-align: right;' : '' ?>
}
.sidebar .nav-link:hover, .sidebar .nav-link.active {
color: var(--sidebar-active-color);
background: var(--sidebar-active-bg);
<?= $isRTL ? 'border-left: 3px solid var(--sidebar-active-border); border-right: none;' : 'border-right: 3px solid var(--sidebar-active-border); border-left: none;' ?>
}
.sidebar-heading {
font-size: 0.75rem;
text-transform: uppercase;
letter-spacing: 0.05em;
color: var(--text-heading);
padding: 1.25rem 1.5rem 0.5rem;
font-weight: 700;
display: flex;
align-items: center;
cursor: pointer; /* Clickable */
width: 100%;
background: none;
border: none;
<?= $isRTL ? 'text-align: right; flex-direction: row-reverse;' : 'text-align: left;' ?>
}
.sidebar-heading:hover {
color: var(--accent-color);
}
.sidebar-heading i:first-child {
font-size: 1rem;
<?= $isRTL ? 'margin-left: 0.5rem; margin-right: 0;' : 'margin-right: 0.5rem; margin-left: 0;' ?>
color: var(--accent-color);
}
.main-content { <?= $isRTL ? 'margin-right: 250px; margin-left: 0;' : 'margin-left: 250px; margin-right: 0;' ?> padding: 2rem; }
@media (max-width: 768px) {
.sidebar { transform: <?= $isRTL ? 'translateX(100%)' : 'translateX(-100%)' ?>; transition: transform 0.3s ease; top: 0; height: 100vh; }
.sidebar.show { transform: translateX(0); }
.main-content { margin-left: 0; margin-right: 0; }
.sidebar-header { display: none !important; } /* Hide duplicate logo on mobile */
}
.stat-card {
border: none;
border-radius: 12px;
background-color: var(--bg-card);
box-shadow: var(--shadow);
transition: transform 0.2s, background-color 0.3s;
}
.stat-card:hover { transform: translateY(-3px); }
.icon-box {
width: 48px;
height: 48px;
border-radius: 10px;
display: flex;
align-items: center;
justify-content: center;
font-size: 1.25rem;
background-color: var(--bg-body); /* subtle background for icons */
color: var(--accent-color);
}
/* Dropdown theming override */
.dropdown-menu {
background-color: var(--bg-card);
border-color: var(--border-color);
<?= $isRTL ? 'text-align: right;' : '' ?>
}
.dropdown-item {
color: var(--text-primary);
<?= $isRTL ? 'text-align: right;' : '' ?>
}
.dropdown-item i {
<?= $isRTL ? 'margin-left: 0.5rem; margin-right: 0;' : 'margin-right: 0.5rem; margin-left: 0;' ?>
}
.dropdown-item:hover {
background-color: var(--bg-body);
color: var(--accent-color);
}
.dropdown-header {
color: var(--text-secondary);
<?= $isRTL ? 'text-align: right;' : '' ?>
}
.offcanvas-start {
<?= $isRTL ? 'right: 0; left: auto; transform: translateX(100%);' : '' ?>
}
.offcanvas-start.show {
<?= $isRTL ? 'transform: translateX(0);' : '' ?>
}
</style>
<script>
// Theme Switcher Logic
function setTheme(themeName) {
if (themeName === 'default') {
document.documentElement.removeAttribute('data-theme');
localStorage.removeItem('theme');
} else {
document.documentElement.setAttribute('data-theme', themeName);
localStorage.setItem('theme', themeName);
}
}
// Apply theme immediately on load to prevent flash
(function() {
const savedTheme = localStorage.getItem('theme');
if (savedTheme) {
document.documentElement.setAttribute('data-theme', savedTheme);
}
})();
</script>
</head>
<body>
<!-- Mobile Header -->
<nav class="navbar navbar-light border-bottom d-md-none fixed-top" style="background-color: var(--bg-card);">
<div class="container-fluid">
<a class="navbar-brand fw-bold" href="index.php" style="color: var(--text-primary);">
<?php if ($logoUrl): ?>
<img src="../<?= htmlspecialchars($logoUrl) ?>" alt="Logo" style="height: 30px;">
<?php else: ?>
<?= htmlspecialchars($companyName) ?><span style="color: var(--accent-color);">Admin</span>
<?php endif; ?>
</a>
<button class="navbar-toggler border-0" type="button" data-bs-toggle="offcanvas" data-bs-target="#sidebarMenu">
<span class="navbar-toggler-icon"></span>
</button>
</div>
</nav>
<!-- Sidebar -->
<div class="offcanvas-md offcanvas-<?= $isRTL ? 'end' : 'start' ?> sidebar" tabindex="-1" id="sidebarMenu">
<div class="d-flex align-items-center justify-content-center sidebar-header d-none d-md-flex">
<a href="index.php" class="text-decoration-none">
<?php if ($logoUrl): ?>
<img src="../<?= htmlspecialchars($logoUrl) ?>" alt="Logo" style="max-height: 50px; max-width: 100%;">
<?php else: ?>
<h4 class="fw-bold m-0" style="color: var(--text-primary);"><?= htmlspecialchars($companyName) ?><span style="color: var(--accent-color);">.</span></h4>
<?php endif; ?>
</a>
</div>
<div class="px-4 py-3 d-md-none d-flex justify-content-between align-items-center">
<h5 class="fw-bold m-0" style="color: var(--text-primary);"><?= t('menu_management') ?></h5><button type="button" class="btn-close" data-bs-dismiss="offcanvas" data-bs-target="#sidebarMenu" aria-label="Close"></button>
</div>
<div class="sidebar-content accordion" id="sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('dashboard')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('index.php') ?>" href="index.php">
<i class="bi bi-grid me-2"></i> <?= t('dashboard') ?>
</a>
</li>
<?php endif; ?>
</ul>
<?php
$posGroup = ['orders.php', 'ads.php', 'ad_edit.php'];
$canViewPosGroup = can_view('pos') || can_view('orders') || can_view('kitchen') || can_view('ads');
if ($canViewPosGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($posGroup) ?>"
data-bs-toggle="collapse" href="#collapsePos" role="button" aria-expanded="<?= isGroupExpanded($posGroup) ?>" aria-controls="collapsePos">
<span><i class="bi bi-shop"></i> <?= t('pos_operations') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($posGroup) ?>" id="collapsePos" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('pos')): ?>
<li class="nav-item">
<a class="nav-link" href="../pos.php" target="_blank">
<i class="bi bi-display me-2"></i> <?= t('pos_terminal') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('orders')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('orders.php') ?>" href="orders.php">
<i class="bi bi-receipt me-2"></i> <?= t('orders_pos') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('kitchen')): ?>
<li class="nav-item">
<a class="nav-link" href="../kitchen.php" target="_blank">
<i class="bi bi-fire me-2"></i> <?= t('kitchen_view') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('ads')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('ads.php') || isActive('ad_edit.php') ? 'active' : '' ?>" href="ads.php">
<i class="bi bi-megaphone me-2"></i> <?= t('ads_management') ?>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$menuGroup = ['products.php', 'product_edit.php', 'categories.php', 'category_edit.php', 'product_variants.php'];
$canViewMenuGroup = can_view('products') || can_view('categories');
if ($canViewMenuGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($menuGroup) ?>"
data-bs-toggle="collapse" href="#collapseMenu" role="button" aria-expanded="<?= isGroupExpanded($menuGroup) ?>" aria-controls="collapseMenu">
<span><i class="bi bi-menu-button-wide"></i> <?= t('menu_management') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($menuGroup) ?>" id="collapseMenu" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('products')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('products.php') ?>" href="products.php">
<i class="bi bi-box-seam me-2"></i> <?= t('products') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('categories')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('categories.php') ?>" href="categories.php">
<i class="bi bi-tags me-2"></i> <?= t('categories') ?>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$setupGroup = ['outlets.php', 'outlet_edit.php', 'areas.php', 'area_edit.php', 'tables.php', 'table_edit.php'];
$canViewSetupGroup = can_view('outlets') || can_view('areas') || can_view('tables');
if ($canViewSetupGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($setupGroup) ?>"
data-bs-toggle="collapse" href="#collapseSetup" role="button" aria-expanded="<?= isGroupExpanded($setupGroup) ?>" aria-controls="collapseSetup">
<span><i class="bi bi-gear-wide-connected"></i> <?= t('restaurant_setup') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($setupGroup) ?>" id="collapseSetup" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('outlets')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('outlets.php') ?>" href="outlets.php">
<i class="bi bi-shop me-2"></i> <?= t('outlets') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('areas')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('areas.php') ?>" href="areas.php">
<i class="bi bi-geo-alt me-2"></i> <?= t('areas') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('tables')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('tables.php') ?>" href="tables.php">
<i class="bi bi-ui-checks-grid me-2"></i> <?= t('tables') ?>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$peopleGroup = ['customers.php', 'suppliers.php', 'loyalty.php'];
$canViewPeopleGroup = can_view('customers') || can_view('suppliers') || can_view('loyalty');
if ($canViewPeopleGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($peopleGroup) ?>"
data-bs-toggle="collapse" href="#collapsePeople" role="button" aria-expanded="<?= isGroupExpanded($peopleGroup) ?>" aria-controls="collapsePeople">
<span><i class="bi bi-people"></i> <?= t('people_partners') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($peopleGroup) ?>" id="collapsePeople" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('customers')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('customers.php') ?>" href="customers.php">
<i class="bi bi-people-fill me-2"></i> <?= t('customers') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('suppliers')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('suppliers.php') ?>" href="suppliers.php">
<i class="bi bi-truck me-2"></i> <?= t('suppliers') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('loyalty')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('loyalty.php') ?>" href="loyalty.php">
<i class="bi bi-award me-2"></i> <?= t('loyalty') ?>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$financialsGroup = ['expenses.php', 'expense_categories.php', 'expense_category_edit.php', 'purchases.php'];
$canViewFinancialsGroup = can_view('expenses') || can_view('expense_categories') || can_view('purchases');
if ($canViewFinancialsGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($financialsGroup) ?>"
data-bs-toggle="collapse" href="#collapseFinancials" role="button" aria-expanded="<?= isGroupExpanded($financialsGroup) ?>" aria-controls="collapseFinancials">
<span><i class="bi bi-wallet2"></i> <?= t('financials') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($financialsGroup) ?>" id="collapseFinancials" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('purchases')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('purchases.php') ? 'active' : '' ?>" href="purchases.php">
<i class="bi bi-cart-plus me-2"></i> <?= t('purchases') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('expenses')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('expenses.php') ? 'active' : '' ?>" href="expenses.php">
<i class="bi bi-cash-stack me-2"></i> <?= t('expenses') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('expense_categories')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('expense_categories.php') || isActive('expense_category_edit.php') ? 'active' : '' ?>" href="expense_categories.php">
<i class="bi bi-tags me-2"></i> <?= t('expense_categories') ?>
</a>
</li>
<?php endif; ?>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$reportsGroup = ['reports.php'];
if (can_view('reports')):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($reportsGroup) ?>"
data-bs-toggle="collapse" href="#collapseReports" role="button" aria-expanded="<?= isGroupExpanded($reportsGroup) ?>" aria-controls="collapseReports">
<span><i class="bi bi-bar-chart-line"></i> <?= t('reports_analytics') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($reportsGroup) ?>" id="collapseReports" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link <?= isActive('reports.php') ?>" href="reports.php">
<i class="bi bi-graph-up me-2"></i> <?= t('daily_reports') ?>
</a>
</li>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$userGroupPages = [ 'ratings.php','users.php', 'user_edit.php', 'user_groups.php', 'user_group_edit.php', 'attendance.php'];
$canViewUserGroup = can_view('users') || can_view('user_groups');
if ($canViewUserGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($userGroupPages) ?>"
data-bs-toggle="collapse" href="#collapseUsers" role="button" aria-expanded="<?= isGroupExpanded($userGroupPages) ?>" aria-controls="collapseUsers">
<span><i class="bi bi-person-badge"></i> <?= t('user_management') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($userGroupPages) ?>" id="collapseUsers" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column">
<?php if (can_view('users')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('users.php') ?>" href="users.php">
<i class="bi bi-people me-2"></i> <?= t('users') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('user_groups')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('user_groups.php') ?>" href="user_groups.php">
<i class="bi bi-shield-lock me-2"></i> <?= t('roles_groups') ?>
</a>
</li>
<?php endif; ?>
<li class="nav-item">
<a class="nav-link <?= isActive('attendance.php') ?>" href="attendance.php">
<i class="bi bi-calendar-check me-2"></i> <?= t('attendance') ?>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?= isActive('ratings.php') ?>" href="ratings.php">
<i class="bi bi-star me-2"></i> <?= t('staff_ratings') ?>
</a>
</li>
</ul>
</div>
</div>
<?php endif; ?>
<?php
$settingsGroup = ['payment_types.php', 'payment_type_edit.php', 'integrations.php', 'company.php', 'backup.php'];
$canViewSettingsGroup = can_view('payment_types') || can_view('settings');
if ($canViewSettingsGroup):
?>
<div class="nav-group">
<a class="sidebar-heading d-flex justify-content-between align-items-center text-decoration-none <?= getGroupToggleClass($settingsGroup) ?>"
data-bs-toggle="collapse" href="#collapseSettings" role="button" aria-expanded="<?= isGroupExpanded($settingsGroup) ?>" aria-controls="collapseSettings">
<span><i class="bi bi-sliders"></i> <?= t('settings') ?></span>
<i class="bi bi-chevron-down chevron-icon"></i>
</a>
<div class="collapse <?= isGroupActive($settingsGroup) ?>" id="collapseSettings" data-bs-parent="#sidebarAccordion">
<ul class="nav flex-column mb-5">
<?php if (can_view('payment_types')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('payment_types.php') ?>" href="payment_types.php">
<i class="bi bi-credit-card me-2"></i> <?= t('payment_types') ?>
</a>
</li>
<?php endif; ?>
<?php if (can_view('settings')): ?>
<li class="nav-item">
<a class="nav-link <?= isActive('integrations.php') ?>" href="integrations.php">
<i class="bi bi-plugin me-2"></i> <?= t('integrations') ?>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?= isActive('company.php') ?>" href="company.php">
<i class="bi bi-building me-2"></i> <?= t('company') ?>
</a>
</li>
<li class="nav-item">
<a class="nav-link <?= isActive('backup.php') ?>" href="backup.php">
<i class="bi bi-cloud-arrow-down me-2"></i> <?= t('backup_restore') ?>
</a>
</li>
<?php endif; ?>
<li class="nav-item border-top mt-2 pt-2">
<a class="nav-link text-muted" href="../index.php" target="_blank">
<i class="bi bi-box-arrow-up-right me-2"></i> <?= t('view_site') ?>
</a>
</li>
</ul>
</div>
</div>
<?php endif; ?>
</div>
</div>
<div class="main-content pt-5 pt-md-4">
<!-- Top Header -->
<header class="d-flex justify-content-end align-items-center mb-4 pb-3 border-bottom">
<div class="d-flex align-items-center gap-3">
<!-- Language Switcher -->
<div class="dropdown">
<button class="btn btn-link text-decoration-none dropdown-toggle d-flex align-items-center gap-2" type="button" id="topLangDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="color: var(--text-primary);">
<i class="bi bi-translate"></i>
<span class="d-none d-sm-inline"><?= t('language') ?></span>
</button>
<ul class="dropdown-menu dropdown-menu-end shadow border-0" aria-labelledby="topLangDropdown">
<li><h6 class="dropdown-header"><?= t('select_language') ?></h6></li>
<li><a class="dropdown-item d-flex align-items-center gap-2" href="?lang=en"><?= t('english') ?></a></li>
<li><a class="dropdown-item d-flex align-items-center gap-2" href="?lang=ar"><?= t('arabic') ?></a></li>
</ul>
</div>
<!-- Theme Switcher -->
<div class="dropdown">
<button class="btn btn-link text-decoration-none dropdown-toggle d-flex align-items-center gap-2" type="button" id="topThemeDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="color: var(--text-primary);">
<i class="bi bi-palette"></i>
<span class="d-none d-sm-inline"><?= t('theme') ?></span>
</button>
<ul class="dropdown-menu dropdown-menu-end shadow border-0" aria-labelledby="topThemeDropdown">
<li><h6 class="dropdown-header"><?= t('select_theme') ?></h6></li>
<li><button class="dropdown-item d-flex align-items-center gap-2" onclick="setTheme('default')"><span class="d-inline-block rounded-circle" style="width:12px;height:12px;background:#eee;border:1px solid #ddd"></span> <?= t('default') ?></button></li>
<li><button class="dropdown-item d-flex align-items-center gap-2" onclick="setTheme('dark')"><span class="d-inline-block rounded-circle" style="width:12px;height:12px;background:#333"></span> <?= t('dark') ?></button></li>
<li><button class="dropdown-item d-flex align-items-center gap-2" onclick="setTheme('ocean')"><span class="d-inline-block rounded-circle" style="width:12px;height:12px;background:#0077B6"></span> <?= t('ocean') ?></button></li>
<li><button class="dropdown-item d-flex align-items-center gap-2" onclick="setTheme('forest')"><span class="d-inline-block rounded-circle" style="width:12px;height:12px;background:#2D6A4F"></span> <?= t('forest') ?></button></li>
<li><button class="dropdown-item d-flex align-items-center gap-2" onclick="setTheme('grape')"><span class="d-inline-block rounded-circle" style="width:12px;height:12px;background:#7B1FA2"></span> <?= t('grape') ?></button></li>
</ul>
</div>
<!-- User Profile -->
<div class="dropdown">
<a href="#" class="d-flex align-items-center text-decoration-none dropdown-toggle" id="userDropdown" data-bs-toggle="dropdown" aria-expanded="false" style="color: var(--text-primary);">
<?php if ($userPic): ?>
<img src="../<?= htmlspecialchars($userPic) ?>?v=<?= time() ?>" alt="Profile" class="rounded-circle me-2 shadow-sm" style="width:38px;height:38px; object-fit: cover;">
<?php else: ?>
<div class="bg-primary bg-gradient rounded-circle d-flex align-items-center justify-content-center text-white me-2 shadow-sm" style="width:38px;height:38px; font-weight:600;"><?= $userInitial ?></div>
<?php endif; ?>
<span class="d-none d-sm-inline fw-medium"><?= htmlspecialchars($userName) ?></span>
</a>
<ul class="dropdown-menu dropdown-menu-end shadow border-0" aria-labelledby="userDropdown">
<li><span class="dropdown-item-text text-muted small"><?= t('signed_in_as') ?> <?= htmlspecialchars($userGroup) ?></span></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item" href="profile.php"><i class="bi bi-person me-2"></i> <?= t('my_profile') ?></a></li>
<li><a class="dropdown-item" href="company.php"><i class="bi bi-building me-2"></i> <?= t('company_settings') ?></a></li>
<li><hr class="dropdown-divider"></li>
<li><a class="dropdown-item text-danger" href="<?= get_base_url() ?>logout.php"><i class="bi bi-box-arrow-right me-2"></i> <?= t('logout') ?></a></li>
</ul>
</div>
</div>
</header>