<!DOCTYPE html>
<html lang="<?= Language::getLocale() ?>">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="csrf-token" content="<?= Security::csrfToken() ?>">
  <title><?= $pageTitle ?? 'CARGOO Admin Portal' ?></title>
  <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.min.css">
  <link rel="stylesheet" href="<?= asset('/assets/css/app.css') ?>">
</head>
<body class="admin-shell">

<!-- ── Admin Header ─────────────────────────────────────── -->
<header class="admin-header d-flex align-items-center px-3 px-md-4 gap-3">
  <!-- Mobile Drawer Toggle -->
  <button class="btn btn-sm btn-outline-secondary text-white border-secondary d-lg-none" type="button"
          data-bs-toggle="offcanvas" data-bs-target="#adminSidebarOffcanvas" aria-label="Open Navigation">
    <i class="bi bi-list fs-5"></i>
  </button>

  <!-- Brand -->
  <a href="<?= url('/admin') ?>" class="d-flex align-items-center gap-2 text-decoration-none me-2">
    <img src="<?= asset('/assets/images/brand/logo2-white.png') ?>" alt="CARGOO" height="26">
    <span class="badge bg-danger rounded-pill px-2 py-1" style="font-size: 0.65rem; letter-spacing: 0.04em;">ADMIN OPS</span>
  </a>

  <!-- Global Quick Search Bar (Desktop) -->
  <div class="d-none d-md-block flex-grow-1 mx-3" style="max-width: 420px;">
    <form action="<?= url('/admin/orders') ?>" method="GET" class="position-relative">
      <i class="bi bi-search position-absolute top-50 start-0 translate-middle-y ms-3 text-muted" style="font-size: 0.8rem;"></i>
      <input type="text" name="q" class="form-control form-control-sm bg-dark text-light border-secondary ps-5"
             placeholder="ค้นหาด่วน (เลขออเดอร์, สินค้า, ร้านค้า, ผู้ใช้)..."
             style="font-size: 0.8rem; background-color: rgba(255,255,255,0.07) !important; border-color: rgba(255,255,255,0.15) !important;">
    </form>
  </div>

  <!-- Right Actions & Quick Switchers -->
  <div class="d-flex align-items-center gap-2 ms-auto">
    <!-- Switch to Customer Storefront -->
    <a href="<?= url('/') ?>" class="btn btn-sm btn-outline-light d-flex align-items-center gap-1 border-opacity-25" title="เปิดหน้าร้านค้า">
      <i class="bi bi-shop"></i><span class="d-none d-xl-inline small">หน้าร้านค้า</span>
    </a>

    <!-- Switch to Seller Center (if seller) -->
    <?php if (Auth::isSeller()): ?>
    <a href="<?= url('/seller') ?>" class="btn btn-sm btn-outline-light d-flex align-items-center gap-1 border-opacity-25" title="ศูนย์ผู้ขาย">
      <i class="bi bi-box-seam"></i><span class="d-none d-xl-inline small">ศูนย์ผู้ขาย</span>
    </a>
    <?php endif; ?>

    <!-- Notification Center Link -->
    <?php 
      require_once __DIR__ . '/../../app/Models/Notification.php';
      $adminNotifCount = (new Notification())->getUnreadCount((int)Auth::id(), 'admin');
    ?>
    <a href="<?= url('/account/notifications') ?>" class="btn btn-sm btn-outline-light position-relative d-flex align-items-center border-opacity-25" title="การแจ้งเตือน">
      <i class="bi bi-bell"></i>
      <?php if ($adminNotifCount > 0): ?>
        <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-danger" style="font-size: 0.6rem;">
          <?= $adminNotifCount ?>
        </span>
      <?php endif; ?>
    </a>

    <!-- Help Modal Trigger -->
    <button type="button" class="btn btn-sm btn-outline-secondary text-white border-0" data-bs-toggle="modal" data-bs-target="#adminHelpModal" title="คู่มือการใช้งาน">
      <i class="bi bi-question-circle"></i>
    </button>

    <!-- Language Switcher -->
    <div class="dropdown">
      <button class="btn btn-sm btn-outline-light dropdown-toggle rounded-pill px-2 d-flex align-items-center gap-1 border-opacity-25" type="button" data-bs-toggle="dropdown" aria-expanded="false">
        <i class="bi bi-globe2 text-primary"></i> <span class="small fw-semibold"><?= strtoupper(Language::getLocale()) ?></span>
      </button>
      <ul class="dropdown-menu dropdown-menu-end shadow-sm border-0 rounded-3 small">
        <li><a class="dropdown-item <?= Language::getLocale() === 'th' ? 'active fw-bold' : '' ?>" href="<?= Language::switchUrl('th') ?>"><span class="badge bg-secondary-subtle text-secondary small border me-1">TH</span> ภาษาไทย</a></li>
        <li><a class="dropdown-item <?= Language::getLocale() === 'en' ? 'active fw-bold' : '' ?>" href="<?= Language::switchUrl('en') ?>"><span class="badge bg-secondary-subtle text-secondary small border me-1">EN</span> English</a></li>
      </ul>
    </div>

    <!-- Admin Profile Dropdown -->
    <div class="dropdown ms-1">
      <button class="btn btn-sm btn-outline-light border-0 d-flex align-items-center gap-2 py-1 px-2 rounded-2"
              data-bs-toggle="dropdown" aria-expanded="false" style="background-color: rgba(255,255,255,0.08);">
        <div class="rounded-circle bg-primary bg-opacity-75 text-white d-flex align-items-center justify-content-center fw-bold" style="width: 26px; height: 26px; font-size: 0.72rem;">
          <?= strtoupper(mb_substr(Auth::user()['first_name'] ?? 'A', 0, 1)) ?>
        </div>
        <div class="text-start d-none d-sm-block lh-1">
          <div class="small fw-semibold text-white"><?= e(Auth::user()['first_name'] ?? 'Admin') ?></div>
          <div class="text-muted" style="font-size: 0.65rem;">
            <?= !empty($_SESSION['is_super_admin']) ? 'Super Admin' : 'Admin' ?>
          </div>
        </div>
        <i class="bi bi-chevron-down text-muted" style="font-size: 0.7rem;"></i>
      </button>

      <ul class="dropdown-menu dropdown-menu-end shadow-sm mt-1 border" style="min-width: 220px; font-size: 0.82rem;">
        <li class="px-3 py-2 border-bottom bg-light">
          <div class="fw-semibold text-dark"><?= e(Auth::user()['first_name'] . ' ' . Auth::user()['last_name']) ?></div>
          <div class="text-muted small">@<?= e(Auth::user()['username'] ?? '') ?> &bull; <?= e(Auth::user()['email'] ?? '') ?></div>
        </li>
        <li><a class="dropdown-item py-2" href="<?= url('/account/profile') ?>"><i class="bi bi-person me-2 text-primary"></i>โปรไฟล์ส่วนตัว</a></li>
        <li><a class="dropdown-item py-2" href="<?= url('/account/security') ?>"><i class="bi bi-shield-lock me-2 text-primary"></i>ความปลอดภัยบัญชี</a></li>
        <?php if (AdminMiddleware::can('settings.manage')): ?>
        <li><a class="dropdown-item py-2" href="<?= url('/admin/settings') ?>"><i class="bi bi-gear me-2 text-primary"></i>Platform Settings</a></li>
        <?php endif; ?>
        <li><hr class="dropdown-divider my-1"></li>
        <li>
          <form action="<?= url('/logout') ?>" method="POST" class="d-inline">
            <?= Security::csrfField() ?>
            <button type="submit" class="dropdown-item py-2 text-danger"><i class="bi bi-box-arrow-right me-2"></i>ออกจากระบบ</button>
          </form>
        </li>
      </ul>
    </div>
  </div>
</header>

<!-- ── Mobile Offcanvas Sidebar ─────────────────────────── -->
<div class="offcanvas offcanvas-start" tabindex="-1" id="adminSidebarOffcanvas" style="width: 280px;">
  <div class="offcanvas-header bg-dark text-white py-3 px-3">
    <div class="d-flex align-items-center gap-2">
      <img src="<?= asset('/assets/images/brand/logo2-white.png') ?>" alt="CARGOO" height="22">
      <span class="badge bg-danger" style="font-size: 0.65rem;">ADMIN OPS</span>
    </div>
    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="offcanvas" aria-label="Close"></button>
  </div>
  <div class="offcanvas-body p-2 bg-white">
    <?php require __DIR__ . '/../../views/admin/_sidebar_nav.php'; ?>
  </div>
</div>

<!-- ── Main Grid Layout ─────────────────────────────────── -->
<div class="container-fluid px-0">
  <div class="row g-0">
    <!-- Desktop Left Sidebar -->
    <div class="col-lg-2 col-xl-2 d-none d-lg-block">
      <aside class="admin-sidebar-nav position-sticky" style="top: 60px;">
        <?php require __DIR__ . '/../../views/admin/_sidebar_nav.php'; ?>
      </aside>
    </div>

    <!-- Main Operational Workspace -->
    <div class="col-lg-10 col-xl-10 p-3 p-md-4">
      <main>
        <?php require __DIR__ . '/../components/alerts.php'; ?>
        <?= $content ?>
      </main>
    </div>
  </div>
</div>

<!-- ── Admin Help Modal ─────────────────────────────────── -->
<div class="modal fade" id="adminHelpModal" tabindex="-1" aria-labelledby="adminHelpModalLabel" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h6 class="modal-title fw-bold" id="adminHelpModalLabel"><i class="bi bi-info-circle text-primary me-2"></i>ศูนย์ช่วยเหลือ Admin Portal</h6>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body small">
        <h6 class="fw-semibold text-dark">ระบบสิทธิ์และการควบคุม (Permission Matrix)</h6>
        <p class="text-muted">สิทธิ์การใช้งานแต่ละโมดูลขึ้นอยู่กับ Role และ Permission Overrides ที่ Super Admin มอบหมาย:</p>
        <ul class="text-muted ps-3 mb-3">
          <li><strong>Super Admin:</strong> สิทธิ์สูงสุด สามารถจัดการ Admin และตั้งค่าระบบทั้งหมด</li>
          <li><strong>Operation Admin:</strong> ดูแลผู้ใช้งาน ร้านค้า ตรวจสอบสินค้า คำสั่งซื้อ และประกาศ</li>
          <li><strong>Finance Admin:</strong> ตรวจสอบรายงานการเงินและรอบการโอนเงิน (Settlement)</li>
          <li><strong>Support Admin:</strong> จัดการรายงานปัญหาและประสานงานผู้ใช้</li>
        </ul>
        <div class="alert alert-light border small mb-0">
          <i class="bi bi-shield-check text-success me-1"></i> ทุกการดำเนินการที่สำคัญ (การอนุมัติ, ปฏิเสธ, ระงับบัญชี) จะถูกบันทึกใน <strong>Admin Audit Log</strong> โดยอัตโนมัติ
        </div>
      </div>
      <div class="modal-footer py-2">
        <button type="button" class="btn btn-sm btn-secondary" data-bs-dismiss="modal">ปิดหน้าต่าง</button>
      </div>
    </div>
  </div>
</div>

<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"></script>
<script src="<?= asset('/assets/js/app.js') ?>"></script>
</body>
</html>
