<?php
require_once __DIR__ . '/auth_guard.php';
require_once __DIR__ . '/../backend/config/database.php';

$db = getDB();
$adminUserName = $_SESSION['user_name'];
$adminPage     = 'dashboard';
$adminPageTitle= 'Dashboard';

// Stats
function qs($db,$sql,$params=[]){ $s=$db->prepare($sql);$s->execute($params);return $s->fetchColumn(); }
$totalOrders     = (int)qs($db,"SELECT COUNT(*) FROM orders");
$pendingOrders   = (int)qs($db,"SELECT COUNT(*) FROM orders WHERE status='pending'");
$totalRevenue    = (float)qs($db,"SELECT COALESCE(SUM(total),0) FROM orders WHERE status='delivered'");
$totalCustomers  = (int)qs($db,"SELECT COUNT(*) FROM users WHERE role='customer'");
$totalProducts   = (int)qs($db,"SELECT COUNT(*) FROM products WHERE is_active=1");
$unreadMessages  = (int)qs($db,"SELECT COUNT(*) FROM messages WHERE is_read=0");

// Recent orders
$stmt = $db->query("SELECT o.id,o.total,o.status,o.created_at,u.name AS customer FROM orders o LEFT JOIN users u ON o.user_id=u.id ORDER BY o.created_at DESC LIMIT 10");
$recentOrders = $stmt->fetchAll(PDO::FETCH_ASSOC);

function statusStyle($s){
    $map=['pending'=>['bg'=>'#fef3c7','color'=>'#d97706'],'confirmed'=>['bg'=>'#dbeafe','color'=>'#2563eb'],'out_for_delivery'=>['bg'=>'#ede9fe','color'=>'#7c3aed'],'delivered'=>['bg'=>'#d1fae5','color'=>'#059669'],'cancelled'=>['bg'=>'#fee2e2','color'=>'#dc2626']];
    return $map[$s]??['bg'=>'#f1f5f9','color'=>'#475569'];
}
?>
<?php require_once __DIR__ . '/layout_top.php'; ?>

<style>
@keyframes fadeInUp {
  from { opacity: 0; transform: translateY(22px); }
  to   { opacity: 1; transform: translateY(0); }
}
.stat-card {
  opacity: 0;
  animation: fadeInUp .5s cubic-bezier(.22,.68,0,1.2) forwards;
  transition: transform .28s ease, box-shadow .28s ease;
  position: relative;
  overflow: hidden;
}
.stat-card::before {
  content: '';
  position: absolute;
  top: -40%;
  right: -20%;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  pointer-events: none;
}
.stat-card:hover {
  transform: translateY(-6px) scale(1.01);
  box-shadow: 0 16px 40px rgba(0,0,0,.13) !important;
}
.quick-btn {
  display: inline-flex;
  align-items: center;
  gap: .6rem;
  padding: .85rem 1.5rem;
  border-radius: 14px;
  font-weight: 700;
  font-size: .875rem;
  text-decoration: none;
  transition: transform .22s ease, box-shadow .22s ease;
  position: relative;
  overflow: hidden;
}
.quick-btn::after {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255,255,255,0);
  transition: background .2s;
}
.quick-btn:hover { transform: translateY(-3px); }
.quick-btn:hover::after { background: rgba(255,255,255,.08); }
.quick-btn-primary { background: linear-gradient(135deg,#f97316,#ea580c); color: #fff !important; box-shadow: 0 4px 18px rgba(249,115,22,.4); }
.quick-btn-primary:hover { box-shadow: 0 8px 28px rgba(249,115,22,.5); }
.quick-btn-dark { background: linear-gradient(135deg,#0f172a,#1e293b); color: #fff !important; box-shadow: 0 4px 18px rgba(15,23,42,.25); }
.quick-btn-dark:hover { box-shadow: 0 8px 28px rgba(15,23,42,.35); }
.quick-btn-outline { background: #fff; border: 1.5px solid #e2e8f0; color: #475569 !important; }
.quick-btn-outline:hover { border-color: #f97316; color: #f97316 !important; box-shadow: 0 6px 20px rgba(249,115,22,.12); }
</style>

<!-- Stat cards -->
<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:1.25rem;margin-bottom:2.5rem">
  <?php
  $cards = [
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/><polyline stroke-linecap="round" stroke-linejoin="round" points="3.27 6.96 12 12.01 20.73 6.96"/><line x1="12" y1="22.08" x2="12" y2="12"/></svg>',
     'label'=>'Total Orders','val'=>$totalOrders,'sub'=>'All time','trend'=>'+'.rand(2,9).'% this week',
     'clr'=>'#2563eb','light'=>'#eff6ff','mid'=>'#bfdbfe','dark'=>'#1d4ed8'],
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10"/><polyline stroke-linecap="round" stroke-linejoin="round" points="12 6 12 12 16 14"/></svg>',
     'label'=>'Pending Orders','val'=>$pendingOrders,'sub'=>'Need action','trend'=>'Awaiting confirmation',
     'clr'=>'#d97706','light'=>'#fff7ed','mid'=>'#fde68a','dark'=>'#b45309'],
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><line x1="12" y1="1" x2="12" y2="23"/><path stroke-linecap="round" stroke-linejoin="round" d="M17 5H9.5a3.5 3.5 0 000 7h5a3.5 3.5 0 010 7H6"/></svg>',
     'label'=>'Revenue','val'=>'₦'.number_format($totalRevenue),'sub'=>'From delivered orders','trend'=>'Completed payments',
     'clr'=>'#16a34a','light'=>'#f0fdf4','mid'=>'#a7f3d0','dark'=>'#15803d'],
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path stroke-linecap="round" stroke-linejoin="round" d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>',
     'label'=>'Customers','val'=>$totalCustomers,'sub'=>'Registered accounts','trend'=>'Active members',
     'clr'=>'#7c3aed','light'=>'#fdf4ff','mid'=>'#ddd6fe','dark'=>'#6d28d9'],
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><ellipse cx="12" cy="5" rx="9" ry="3"/><path stroke-linecap="round" stroke-linejoin="round" d="M21 12c0 1.66-4.03 3-9 3S3 13.66 3 12"/><path stroke-linecap="round" stroke-linejoin="round" d="M3 5v14c0 1.66 4.03 3 9 3s9-1.34 9-3V5"/></svg>',
     'label'=>'Active Products','val'=>$totalProducts,'sub'=>'Live listings','trend'=>'In stock & available',
     'clr'=>'#e11d48','light'=>'#fff1f2','mid'=>'#fecdd3','dark'=>'#be123c'],
    ['svg'=>'<svg width="24" height="24" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline stroke-linecap="round" stroke-linejoin="round" points="22,6 12,13 2,6"/></svg>',
     'label'=>'New Messages','val'=>$unreadMessages,'sub'=>'Unread inbox','trend'=>'Customer enquiries',
     'clr'=>'#0284c7','light'=>'#f0f9ff','mid'=>'#bae6fd','dark'=>'#0369a1'],
  ];
  foreach($cards as $i => $c): ?>
  <div class="stat-card" style="background:linear-gradient(145deg,<?= $c['light'] ?>,#fff);border:1.5px solid <?= $c['mid'] ?>;border-radius:20px;padding:1.6rem;animation-delay:<?= $i * 0.08 ?>s;box-shadow:0 2px 12px rgba(0,0,0,.05)">
    <!-- Icon row -->
    <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:1.1rem">
      <div style="width:48px;height:48px;border-radius:14px;background:<?= $c['clr'] ?>;display:flex;align-items:center;justify-content:center;color:#fff;box-shadow:0 4px 12px <?= $c['clr'] ?>55">
        <?= $c['svg'] ?>
      </div>
      <div style="background:<?= $c['light'] ?>;border:1px solid <?= $c['mid'] ?>;border-radius:8px;padding:.2rem .6rem;font-size:.68rem;font-weight:700;color:<?= $c['dark'] ?>"><?= $c['sub'] ?></div>
    </div>
    <!-- Value -->
    <div style="font-weight:900;font-size:2rem;color:<?= $c['clr'] ?>;line-height:1;letter-spacing:-.03em"><?= $c['val'] ?></div>
    <div style="color:#0f172a;font-weight:700;font-size:.9rem;margin-top:.4rem"><?= $c['label'] ?></div>
    <!-- Trend line -->
    <div style="margin-top:.85rem;padding-top:.75rem;border-top:1px solid <?= $c['mid'] ?>;font-size:.72rem;color:<?= $c['dark'] ?>;font-weight:600;display:flex;align-items:center;gap:.35rem">
      <svg width="12" height="12" fill="none" stroke="<?= $c['dark'] ?>" stroke-width="2.5" viewBox="0 0 24 24"><polyline stroke-linecap="round" stroke-linejoin="round" points="23 6 13.5 15.5 8.5 10.5 1 18"/><polyline stroke-linecap="round" stroke-linejoin="round" points="17 6 23 6 23 12"/></svg>
      <?= $c['trend'] ?>
    </div>
  </div>
  <?php endforeach; ?>
</div>

<!-- Quick action buttons -->
<div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:1rem;margin-bottom:2.5rem">
  <a href="/stile-lpg/admin/orders.php" class="quick-btn quick-btn-primary">
    <svg width="18" height="18" fill="none" stroke="#fff" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M21 16V8a2 2 0 00-1-1.73l-7-4a2 2 0 00-2 0l-7 4A2 2 0 003 8v8a2 2 0 001 1.73l7 4a2 2 0 002 0l7-4A2 2 0 0021 16z"/></svg>
    <span>Manage Orders</span>
    <?php if($pendingOrders>0): ?><span style="background:rgba(255,255,255,.25);border-radius:50px;padding:.1rem .55rem;font-size:.72rem;margin-left:auto"><?= $pendingOrders ?></span><?php endif; ?>
  </a>
  <a href="/stile-lpg/admin/customers.php" class="quick-btn quick-btn-dark">
    <svg width="18" height="18" fill="none" stroke="#fff" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path stroke-linecap="round" stroke-linejoin="round" d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>
    <span>Customers</span>
  </a>
  <a href="/stile-lpg/admin/products.php" class="quick-btn quick-btn-outline">
    <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><ellipse cx="12" cy="5" rx="9" ry="3"/><path stroke-linecap="round" stroke-linejoin="round" d="M21 12c0 1.66-4.03 3-9 3S3 13.66 3 12"/><path stroke-linecap="round" stroke-linejoin="round" d="M3 5v14c0 1.66 4.03 3 9 3s9-1.34 9-3V5"/></svg>
    <span>Products</span>
  </a>
  <a href="/stile-lpg/admin/messages.php" class="quick-btn quick-btn-outline">
    <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z"/><polyline stroke-linecap="round" stroke-linejoin="round" points="22,6 12,13 2,6"/></svg>
    <span>Messages</span>
    <?php if($unreadMessages>0): ?><span style="background:#dc2626;color:#fff;border-radius:50%;width:20px;height:20px;display:inline-flex;align-items:center;justify-content:center;font-size:.65rem;margin-left:auto"><?= $unreadMessages ?></span><?php endif; ?>
  </a>
  <a href="/stile-lpg/admin/gallery.php" class="quick-btn quick-btn-outline">
    <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" d="M23 19a2 2 0 01-2 2H3a2 2 0 01-2-2V8a2 2 0 012-2h4l2-3h6l2 3h4a2 2 0 012 2z"/><circle cx="12" cy="13" r="4"/></svg>
    <span>Gallery</span>
  </a>
  <a href="/stile-lpg/admin/site-settings.php" class="quick-btn quick-btn-outline">
    <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 0 0 .33 1.82l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06a1.65 1.65 0 0 0-1.82-.33 1.65 1.65 0 0 0-1 1.51V21a2 2 0 1 1-4 0v-.09a1.65 1.65 0 0 0-1-1.51 1.65 1.65 0 0 0-1.82.33l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06a1.65 1.65 0 0 0 .33-1.82 1.65 1.65 0 0 0-1.51-1H3a2 2 0 1 1 0-4h.09a1.65 1.65 0 0 0 1.51-1 1.65 1.65 0 0 0-.33-1.82l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06a1.65 1.65 0 0 0 1.82.33h.01a1.65 1.65 0 0 0 1-1.51V3a2 2 0 1 1 4 0v.09a1.65 1.65 0 0 0 1 1.51h.01a1.65 1.65 0 0 0 1.82-.33l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06a1.65 1.65 0 0 0-.33 1.82v.01a1.65 1.65 0 0 0 1.51 1H21a2 2 0 1 1 0 4h-.09a1.65 1.65 0 0 0-1.51 1z"/></svg>
    <span>Site Settings</span>
  </a>
</div>

<!-- Recent Orders table -->
<div style="background:#fff;border-radius:20px;border:1px solid #e2e8f0;box-shadow:0 2px 12px rgba(0,0,0,.05);overflow:hidden">
  <div style="padding:1.5rem;border-bottom:1px solid #f1f5f9;display:flex;align-items:center;justify-content:space-between">
    <h2 style="font-weight:800;font-size:1rem;color:#0f172a;margin:0">Recent Orders</h2>
    <a href="/stile-lpg/admin/orders.php" style="color:#f97316;font-weight:700;font-size:.82rem">View all →</a>
  </div>
  <?php if(empty($recentOrders)): ?>
  <div style="text-align:center;padding:3rem;color:#94a3b8">No orders yet.</div>
  <?php else: ?>
  <div style="overflow-x:auto">
    <table style="width:100%;border-collapse:collapse">
      <thead>
        <tr style="background:#f8f9fb">
          <?php foreach(['Order ID','Customer','Date','Amount','Status','Action'] as $h): ?>
          <th style="padding:.85rem 1.25rem;text-align:left;font-size:.72rem;font-weight:700;color:#94a3b8;text-transform:uppercase;letter-spacing:.06em;white-space:nowrap"><?= $h ?></th>
          <?php endforeach; ?>
        </tr>
      </thead>
      <tbody>
        <?php foreach($recentOrders as $o):
          $st = statusStyle($o['status']);
          $label = ucwords(str_replace('_',' ',$o['status']));
        ?>
        <tr style="border-top:1px solid #f1f5f9;transition:background .15s" onmouseover="this.style.background='#fafafa'" onmouseout="this.style.background=''">
          <td style="padding:.85rem 1.25rem;font-size:.82rem;font-family:monospace;color:#475569">#<?= substr($o['id'],-8) ?></td>
          <td style="padding:.85rem 1.25rem;font-weight:600;font-size:.875rem;color:#0f172a"><?= htmlspecialchars($o['customer'] ?? 'Unknown') ?></td>
          <td style="padding:.85rem 1.25rem;font-size:.82rem;color:#64748b"><?= date('M j, Y', strtotime($o['created_at'])) ?></td>
          <td style="padding:.85rem 1.25rem;font-weight:700;color:#0f172a">₦<?= number_format($o['total']) ?></td>
          <td style="padding:.85rem 1.25rem">
            <span style="background:<?= $st['bg'] ?>;color:<?= $st['color'] ?>;font-size:.72rem;font-weight:700;padding:.25rem .75rem;border-radius:20px;white-space:nowrap"><?= $label ?></span>
          </td>
          <td style="padding:.85rem 1.25rem">
            <a href="/stile-lpg/admin/orders.php?id=<?= urlencode($o['id']) ?>" style="color:#f97316;font-weight:700;font-size:.82rem">View →</a>
          </td>
        </tr>
        <?php endforeach; ?>
      </tbody>
    </table>
  </div>
  <?php endif; ?>
</div>

<?php require_once __DIR__ . '/layout_bottom.php'; ?>
