<?php
declare(strict_types=1);
require_once __DIR__ . '/../../app/helpers.php';
require_once __DIR__ . '/../../app/auth.php';

$u = $u ?? current_user();
$title = $title ?? 'Satıcı Paneli';
$active = $active ?? 'dashboard';
?>
<!doctype html>
<html lang="tr">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, viewport-fit=cover">
  <title><?=h($title)?> • <?=h(cfg()['app']['name'] ?? 'Panel')?></title>

  <script src="https://cdn.tailwindcss.com"></script>
  <script defer src="https://unpkg.com/lucide@latest"></script>

  <style>
    :root{ --bg:#0b0d10; --card:#0f1217; --line:rgba(255,255,255,.10); }
    body{ background: radial-gradient(1200px 700px at 20% -10%, rgba(255,128,10,.14), transparent 55%),
                     radial-gradient(900px 600px at 90% 10%, rgba(255,255,255,.08), transparent 55%),
                     var(--bg); }
    .glass{ background: rgba(15,18,23,.78); border:1px solid var(--line); backdrop-filter: blur(10px); }
    .btn{ border:1px solid rgba(255,128,10,.35); }
    .btn:hover{ box-shadow: 0 0 0 6px rgba(255,128,10,.10); }
    .pill{ border:1px solid rgba(255,255,255,.10); }
  </style>
</head>
<body class="min-h-screen text-white">
  <div class="mx-auto max-w-6xl px-4 py-5">
    <!-- Top Bar -->
    <div class="glass rounded-2xl p-4 flex items-center justify-between gap-3">
      <div class="flex items-center gap-3">
        <div class="w-11 h-11 rounded-2xl bg-white/5 grid place-items-center border border-white/10">
          <i data-lucide="sparkles" class="w-5 h-5"></i>
        </div>
        <div>
          <div class="text-sm text-white/70">Satıcı Paneli</div>
          <div class="text-lg font-semibold leading-tight"><?=h(cfg()['app']['name'] ?? 'sanatçıdan.com')?></div>
        </div>
      </div>

      <div class="flex items-center gap-2">
        <div class="hidden sm:flex items-center gap-2 pill rounded-full px-3 py-2 bg-white/5">
          <i data-lucide="user" class="w-4 h-4 text-white/70"></i>
          <span class="text-sm text-white/85"><?=h($u['name'] ?? 'Kullanıcı')?></span>
        </div>
        <a href="<?=h(app_base('seller/logout.php'))?>" class="btn rounded-xl px-3 py-2 bg-[#ff800a]/15 text-[#ffb67a] text-sm flex items-center gap-2">
          <i data-lucide="log-out" class="w-4 h-4"></i> Çıkış
        </a>
      </div>
    </div>

    <!-- Nav -->
    <div class="mt-4 grid grid-cols-2 sm:grid-cols-4 gap-3">
      <?php
        $nav = [
          'dashboard' => ['Dashboard','layout-dashboard','seller/dashboard.php'],
          'products'  => ['Ürünler','package','seller/products.php'],
          'new'       => ['Yeni Ürün','plus-circle','seller/product-new.php'],
          'offers'    => ['Teklifler','gavel','seller/dashboard.php'], // şimdilik placeholder
        ];
        foreach($nav as $k=>$it):
          $is = $active===$k;
      ?>
      <a href="<?=h(app_base($it[2]))?>" class="glass rounded-2xl p-4 flex items-center gap-3 transition hover:translate-y-[-1px] <?= $is ? 'ring-2 ring-[#ff800a]/50' : '' ?>">
        <div class="w-11 h-11 rounded-2xl bg-white/5 grid place-items-center border border-white/10">
          <i data-lucide="<?=h($it[1])?>" class="w-5 h-5 <?= $is ? 'text-[#ff800a]' : 'text-white/80' ?>"></i>
        </div>
        <div class="font-semibold"><?=h($it[0])?></div>
      </a>
      <?php endforeach; ?>
    </div>

    <!-- Content -->
    <div class="mt-4">
      <?= $content ?? '' ?>
    </div>
  </div>

  <script>window.addEventListener('DOMContentLoaded', ()=>{ if(window.lucide) lucide.createIcons(); });</script>
</body>
</html>
