<?php
// app/Views/shared/layout.php
// Variables expected: $pageTitle, $activePage, $user
$dir  = (lang() === 'ar') ? 'rtl' : 'ltr';
$thm  = theme();

$navsByRole = [
    'owner' => [
        ['key'=>'dashboard',   'icon'=>'🏠', 'href'=>BASE_URL.'/owner/dashboard.php'],
        ['key'=>'my_vehicles', 'icon'=>'🚗', 'href'=>BASE_URL.'/owner/vehicles.php'],
        ['key'=>'my_drivers',  'icon'=>'👥', 'href'=>BASE_URL.'/owner/drivers.php'],
        ['key'=>'documents',   'icon'=>'📄', 'href'=>BASE_URL.'/owner/documents.php'],
        ['key'=>'my_documents','icon'=>'🪪', 'href'=>BASE_URL.'/owner/personal.php'],
        ['key'=>'generate_qr', 'icon'=>'📱', 'href'=>BASE_URL.'/owner/qr.php'],
        ['key'=>'invite_codes','icon'=>'🔑', 'href'=>BASE_URL.'/owner/invite.php'],   // ← جديد

    ],
    'driver' => [
        ['key'=>'dashboard',      'icon'=>'🏠', 'href'=>BASE_URL.'/driver/dashboard.php'],
        ['key'=>'my_profile',     'icon'=>'👤', 'href'=>BASE_URL.'/driver/profile.php'],
        ['key'=>'my_license',     'icon'=>'🪪', 'href'=>BASE_URL.'/driver/license.php'],
        ['key'=>'linked_vehicles','icon'=>'🚗', 'href'=>BASE_URL.'/driver/vehicles.php'],
        ['key'=>'join_code',      'icon'=>'🔑', 'href'=>BASE_URL.'/driver/join.php'],  // ← جديد

    ],
    'officer' => [
        ['key'=>'dashboard',       'icon'=>'🏠', 'href'=>BASE_URL.'/officer/dashboard.php'],
        ['key'=>'search_vehicle',  'icon'=>'🔍', 'href'=>BASE_URL.'/officer/search.php'],
        ['key'=>'scan_qr',         'icon'=>'📷', 'href'=>BASE_URL.'/officer/scan.php'],
        ['key'=>'new_violation',   'icon'=>'📋', 'href'=>BASE_URL.'/officer/violation.php'],
        ['key'=>'violations_list', 'icon'=>'📊', 'href'=>BASE_URL.'/officer/violations.php'],
        ['key'=>'tow_vehicle',     'icon'=>'🚛', 'href'=>BASE_URL.'/officer/tow.php'],
    ],
    'admin' => [
        ['key'=>'dashboard',      'icon'=>'🏠', 'href'=>BASE_URL.'/admin/dashboard.php'],
        ['key'=>'analytics',      'icon'=>'📈', 'href'=>BASE_URL.'/admin/analytics.php'],
        ['key'=>'global_search',  'icon'=>'🔎', 'href'=>BASE_URL.'/admin/search.php'],
        ['key'=>'manage_users',   'icon'=>'👥', 'href'=>BASE_URL.'/admin/users.php'],
        ['key'=>'all_vehicles',   'icon'=>'🚗', 'href'=>BASE_URL.'/admin/vehicles.php'],
        ['key'=>'all_documents',  'icon'=>'📄', 'href'=>BASE_URL.'/admin/documents.php'],
        ['key'=>'doc_templates',  'icon'=>'🧩', 'href'=>BASE_URL.'/admin/templates.php'],
        ['key'=>'all_violations', 'icon'=>'📊', 'href'=>BASE_URL.'/admin/violations.php'],
        ['key'=>'activity_logs',  'icon'=>'📜', 'href'=>BASE_URL.'/admin/logs.php'],
        ['key'=>'settings',       'icon'=>'⚙️', 'href'=>BASE_URL.'/admin/settings.php'],
    ],
];
$navs = $navsByRole[$user['role']] ?? [];
$roleKey = $user['role'].'_role';
?>
<!DOCTYPE html>
<html lang="<?= e(lang()) ?>" dir="<?= $dir ?>" data-theme="<?= $thm ?>">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><?= e($pageTitle) ?> — <?= t('app_name') ?></title>
<link rel="preconnect" href="https://fonts.googleapis.com">
<link href="https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;600;700;900&family=Sora:wght@300;400;600;700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="<?= BASE_URL ?>/css/main.css">
</head>
<body>
<div class="app-layout">

  <!-- SIDEBAR -->
  <aside class="sidebar" id="sidebar">
    <div class="sidebar-logo">
      <div class="logo-icon" style="background:linear-gradient(135deg,#1a56db 0%,#0f3fa8 100%);border-radius:10px;display:flex;align-items:center;justify-content:center;width:38px;height:38px;flex-shrink:0">
        <svg width="22" height="22" viewBox="0 0 26 26" fill="none">
          <path d="M13 2L4 6V13C4 18 8.2 22.5 13 24C17.8 22.5 22 18 22 13V6L13 2Z" fill="rgba(255,255,255,0.15)" stroke="rgba(255,255,255,0.5)" stroke-width="1.5"/>
          <path d="M9 13L11.5 15.5L17 10" stroke="white" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
        </svg>
      </div>
      <div>
        <div class="logo-text">Vehicle<span style="color:#f5a623">Verify</span> <span style="font-size:10px;font-weight:600;opacity:0.5">DZ</span></div>
        <div class="logo-sub"><?= t('app_sub') ?></div>
      </div>
    </div>
    <nav class="sidebar-nav">
      <?php foreach($navs as $nav): ?>
      <a href="<?= e($nav['href']) ?>" class="<?= ($activePage??'') === $nav['href'] ? 'active' : '' ?>">
        <span class="nav-icon"><?= $nav['icon'] ?></span>
        <span><?= t($nav['key']) ?></span>
      </a>
      <?php endforeach; ?>
    </nav>
    <div class="sidebar-footer">
      <a href="<?= BASE_URL ?>/auth.php?action=logout" class="sidebar-user" style="text-decoration:none">
        <div class="sidebar-avatar"><?= avatarInitials($user['name']) ?></div>
        <div class="sidebar-user-info">
          <div class="sidebar-user-name"><?= e($user['name']) ?></div>
          <div class="sidebar-user-role"><?= t($roleKey) ?></div>
        </div>
        <span style="color:rgba(255,255,255,.4);font-size:16px">↩</span>
      </a>
    </div>
  </aside>

  <!-- SIDEBAR OVERLAY (mobile) -->
  <div class="sidebar-overlay" id="sidebarOverlay"></div>

  <!-- MAIN -->
  <div class="main-content">

    <!-- HEADER -->
    <header class="top-header">
      <div style="display:flex;align-items:center;gap:12px">
        <button class="btn btn-icon mobile-menu-btn">☰</button>
        <span class="header-title"><?= e($pageTitle) ?></span>
      </div>
      <div class="header-actions">
        <div class="toggle-group">
          <?php foreach(['ar','en','fr'] as $l): ?>
          <a href="<?= BASE_URL ?>/lang.php?set=<?= $l ?>&back=<?= urlencode($_SERVER['REQUEST_URI']) ?>"
             class="toggle-btn <?= lang()===$l?'active':'' ?>">
            <?= $l==='ar'?'ع':strtoupper($l) ?>
          </a>
          <?php endforeach; ?>
        </div>
        <a href="<?= BASE_URL ?>/theme.php?set=<?= $thm==='dark'?'light':'dark' ?>&back=<?= urlencode($_SERVER['REQUEST_URI']) ?>"
           class="btn btn-icon theme-toggle-btn" title="<?= $thm==='dark'?t('light_mode'):t('dark_mode') ?>">
          <?= $thm==='dark'?'☀️':'🌙' ?>
        </a>
      </div>
    </header>

    <!-- FLASH -->
    <?php $f = flash('dash'); if($f): ?>
    <div style="margin:16px 28px 0">
      <div class="alert alert-<?= $f['type']==='success'?'success':'danger' ?>">
        <?= e($f['msg']) ?>
      </div>
    </div>
    <?php endif; ?>

    <!-- PAGE CONTENT -->
    <div class="page-content">