<?php
use App\Core\SessionAuth;
$authUser = app()->get(SessionAuth::class)->user();
$systemName = setting('shop_name_ar', 'فخر الأصالة العمانية');
$logo = setting('logo_path', 'assets/img/default-logo.png');
$logoSrc = str_starts_with($logo, 'assets/') ? base_url($logo) : file_url($logo);
?>
<!doctype html>
<html lang="ar" dir="rtl">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><?= e($title ?? $systemName) ?></title>
  <link rel="stylesheet" href="<?= e(base_url('assets/style.css')) ?>">
  <style>
    :root{--bg:#f6f1eb;--card:#ffffff;--line:#e8ddd3;--text:#1f2937;--muted:#6b7280;--brand:#5e3b23;--brand2:#a66e3f;--soft:#faf7f2;--danger:#b42318;--success:#067647}
    *{box-sizing:border-box} body{font-family:Tahoma,Arial,sans-serif;background:linear-gradient(180deg,#f7f3ef,#f1ebe4);margin:0;color:var(--text)}
    .topbar{background:linear-gradient(90deg,var(--brand),var(--brand2));color:#fff;padding:14px 18px;display:flex;align-items:center;gap:16px;justify-content:space-between;position:sticky;top:0;z-index:40;box-shadow:0 8px 30px rgba(94,59,35,.18)}
    .brand{display:flex;align-items:center;gap:12px;min-width:0}.brand img{width:46px;height:46px;border-radius:14px;background:#fff;padding:4px;object-fit:contain;box-shadow:0 4px 14px rgba(0,0,0,.12)}
    .brand h1{margin:0;font-size:20px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.brand p{margin:2px 0 0;font-size:13px;opacity:.92}
    .container{max-width:1320px;margin:22px auto;padding:0 14px}
    .nav{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 14px}.nav a{background:rgba(255,255,255,.92);padding:10px 14px;border-radius:14px;text-decoration:none;color:#2d1f16;box-shadow:0 8px 20px rgba(94,59,35,.07);border:1px solid rgba(166,110,63,.15)}
    .nav a:hover{background:#fff}.card{background:var(--card);border-radius:22px;padding:20px;box-shadow:0 10px 30px rgba(17,24,39,.06);margin-bottom:16px;border:1px solid rgba(166,110,63,.10)}
    .card.soft{background:var(--soft)}
    .grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}.col-3{grid-column:span 3}.col-4{grid-column:span 4}.col-5{grid-column:span 5}.col-6{grid-column:span 6}.col-7{grid-column:span 7}.col-8{grid-column:span 8}.col-12{grid-column:span 12}
    @media(max-width:980px){.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-12{grid-column:1/-1}}
    .btn{border:0;border-radius:14px;padding:11px 16px;background:#1f2937;color:#fff;text-decoration:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700}
    .btn.secondary{background:var(--brand2)} .btn.light{background:#f3f4f6;color:#111827;border:1px solid #e5e7eb} .btn.danger{background:var(--danger)} .btn.success{background:var(--success)}
    .input,.select,.textarea{width:100%;padding:12px 13px;border:1px solid #d7dce2;border-radius:14px;background:#fff;outline:none;transition:.18s}.textarea{min-height:92px}.input:focus,.select:focus,.textarea:focus{border-color:var(--brand2);box-shadow:0 0 0 4px rgba(166,110,63,.10)}
    .label{display:block;font-size:13px;margin-bottom:6px;color:#374151;font-weight:700}.muted{color:var(--muted)}
    .table-wrap{overflow:auto;border-radius:16px;border:1px solid var(--line)} .table{width:100%;border-collapse:collapse;background:#fff}.table th,.table td{padding:12px;border-bottom:1px solid #eee2d7;text-align:right;vertical-align:top}.table th{background:#fbf7f2;font-size:13px;white-space:nowrap}
    .alert{padding:13px 15px;border-radius:14px;margin-bottom:14px}.alert.error{background:#fee4e2;color:#912018}.alert.success{background:#dcfae6;color:#085d3a}
    .stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.stat{background:#fff;padding:18px;border-radius:18px;box-shadow:0 10px 22px rgba(17,24,39,.05);border:1px solid rgba(166,110,63,.10)} .stat strong{display:block;font-size:30px;margin-top:8px}
    @media(max-width:900px){.stats{grid-template-columns:repeat(2,1fr)}} @media(max-width:560px){.stats{grid-template-columns:1fr}}
    .line-item{border:1px solid #eadfd5;border-radius:18px;padding:14px;background:#fcfaf8;margin-bottom:12px}.badge{display:inline-block;padding:5px 10px;border-radius:999px;background:#f3f4f6;font-size:12px}
    .search-suggestions{position:absolute;inset-inline:0;top:100%;background:#fff;border:1px solid #e5e7eb;border-radius:14px;box-shadow:0 16px 34px rgba(0,0,0,.09);z-index:20;max-height:240px;overflow:auto}.search-suggestions button{display:block;width:100%;padding:10px 12px;border:0;background:#fff;text-align:right;cursor:pointer}.search-suggestions button:hover{background:#faf5ef}
    .hidden{display:none!important}.queue-big{font-size:clamp(34px,6vw,62px);font-weight:800;letter-spacing:1px}.pill{display:inline-block;background:#f1f5f9;border-radius:999px;padding:8px 12px}
    .page-head{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}.page-head h2{margin:0}.stack-mobile{display:flex;gap:12px;flex-wrap:wrap}@media(max-width:640px){.stack-mobile{flex-direction:column}.topbar{padding:12px}.brand h1{font-size:17px}}
    .toolbar{display:flex;gap:10px;flex-wrap:wrap}.section-title{margin:0 0 10px;font-size:18px}.hero{background:linear-gradient(135deg,#fff,#fcf5ee);border:1px solid #efdfcf}
    .ticket-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}.queue-panels{display:grid;grid-template-columns:1.1fr .9fr;gap:16px}@media(max-width:900px){.queue-panels{grid-template-columns:1fr}}
  </style>
</head>
<body>
<div class="topbar">
  <div class="brand">
    <img src="<?= e($logoSrc) ?>" alt="logo">
    <div>
      <h1><?= e($systemName) ?></h1>
      <?php if($authUser): ?><p><?= e($authUser['full_name']) ?> — <?= e($authUser['role_name']) ?></p><?php endif; ?>
    </div>
  </div>
  <?php if($authUser): ?><a class="btn light" href="<?= e(base_url('?page=logout')) ?>">خروج</a><?php endif; ?>
</div>
<div class="container">
<?php if($authUser): ?>
<div class="nav">
  <?php if(can_access_page('dashboard')): ?><a href="<?= e(base_url('?page=dashboard')) ?>">لوحة التحكم</a><?php endif; ?>
  <?php if(can_access_page('invoices')): ?><a href="<?= e(base_url('?page=invoices')) ?>">الفواتير</a><?php endif; ?>
  <?php if(can_access_page('returns')): ?><a href="<?= e(base_url('?page=returns')) ?>">الإرجاع</a><?php endif; ?>
  <?php if(can_access_page('items')): ?><a href="<?= e(base_url('?page=items')) ?>">القطع</a><?php endif; ?>
  <?php if(can_access_page('categories')): ?><a href="<?= e(base_url('?page=categories')) ?>">الفئات</a><?php endif; ?>
  <?php if(can_access_page('locations')): ?><a href="<?= e(base_url('?page=locations')) ?>">المواقع / الرفوف</a><?php endif; ?>
  <?php if(can_access_page('customers')): ?><a href="<?= e(base_url('?page=customers')) ?>">العملاء</a><?php endif; ?>
  <?php if(can_access_page('reports')): ?><a href="<?= e(base_url('?page=reports')) ?>">التقارير</a><?php endif; ?>
  <?php if(can_access_page('studio') || can_access_page('studio_store') || can_access_page('studio_update') || can_access_page('studio_delete')): ?><a href="<?= e(base_url('?page=studio')) ?>">حجز الاستوديو</a><?php endif; ?>
  <?php if(can_access_page('tailoring') || can_access_page('tailoring_store') || can_access_page('tailoring_ready')): ?><a href="<?= e(base_url('?page=tailoring')) ?>">خياطة المصر</a><?php endif; ?>
  <?php if(can_access_page('queue_print')): ?><a href="<?= e(base_url('?page=queue_print')) ?>">طباعة التذاكر</a><?php endif; ?>
  <?php if(can_access_page('queue_screen')): ?><a href="<?= e(base_url('?page=queue_screen')) ?>">شاشة الانتظار</a><?php endif; ?>
  <?php if(can_access_page('users')): ?><a href="<?= e(base_url('?page=users')) ?>">المستخدمون</a><?php endif; ?>
  <?php if(can_access_page('settings_branding')): ?><a href="<?= e(base_url('?page=settings_branding')) ?>">هوية النظام</a><?php endif; ?>
  <?php if(can_access_page('settings_whatsapp')): ?><a href="<?= e(base_url('?page=settings_whatsapp')) ?>">إعدادات واتساب</a><?php endif; ?>
  <?php if(can_access_page('audit')): ?><a href="<?= e(base_url('?page=audit')) ?>">سجل الحركات</a><?php endif; ?>
</div>
<?php endif; ?>
<?php if($msg = flash('error')): ?><div class="alert error"><?= e($msg) ?></div><?php endif; ?>
<?php if($msg = flash('success')): ?><div class="alert success"><?= e($msg) ?></div><?php endif; ?>
