<?php
$page_title = 'Dashboard';
require_once __DIR__ . '/header.php';

$stats = [
    'total_orders' => 24,
    'pending_orders' => 3,
    'completed_orders' => 21,
    'wallet_balance' => 12450.00,
    'loyalty_points' => 1250
];
?>

<div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;">
  <div>
    <h1 style="margin:0 0 8px;font-size:1.8rem;color:#0f172a;font-family:'Outfit',sans-serif;">Welcome back, <?= h($cust['name']) ?>! 👋</h1>
    <p style="margin:0;color:#64748b;">Thank you for choosing Balimeen. We are here to serve you better.</p>
  </div>
</div>

<div class="grid-5" style="margin-bottom:24px;">
  <div class="card" style="margin:0;padding:20px;display:flex;flex-direction:column;gap:12px;">
    <div style="display:flex;align-items:center;gap:12px;color:#2563eb;">
      <div style="background:#eff6ff;padding:8px;border-radius:8px;"><i class="fas fa-file-invoice"></i></div>
      <span style="font-weight:600;font-size:0.9rem;color:#64748b;">Total Orders</span>
    </div>
    <div style="font-size:1.8rem;font-weight:700;color:#0f172a;"><?= $stats['total_orders'] ?></div>
    <a href="orders.php" style="color:#2563eb;font-size:0.85rem;text-decoration:none;font-weight:500;">View all orders</a>
  </div>

  <div class="card" style="margin:0;padding:20px;display:flex;flex-direction:column;gap:12px;">
    <div style="display:flex;align-items:center;gap:12px;color:#d97706;">
      <div style="background:#fef3c7;padding:8px;border-radius:8px;"><i class="fas fa-hourglass-half"></i></div>
      <span style="font-weight:600;font-size:0.9rem;color:#64748b;">Pending Orders</span>
    </div>
    <div style="font-size:1.8rem;font-weight:700;color:#0f172a;"><?= $stats['pending_orders'] ?></div>
    <a href="orders.php?status=pending" style="color:#2563eb;font-size:0.85rem;text-decoration:none;font-weight:500;">View pending</a>
  </div>

  <div class="card" style="margin:0;padding:20px;display:flex;flex-direction:column;gap:12px;">
    <div style="display:flex;align-items:center;gap:12px;color:#16a34a;">
      <div style="background:#dcfce7;padding:8px;border-radius:8px;"><i class="fas fa-check-circle"></i></div>
      <span style="font-weight:600;font-size:0.9rem;color:#64748b;">Completed Orders</span>
    </div>
    <div style="font-size:1.8rem;font-weight:700;color:#0f172a;"><?= $stats['completed_orders'] ?></div>
    <a href="orders.php?status=completed" style="color:#2563eb;font-size:0.85rem;text-decoration:none;font-weight:500;">View completed</a>
  </div>

  <div class="card" style="margin:0;padding:20px;display:flex;flex-direction:column;gap:12px;">
    <div style="display:flex;align-items:center;gap:12px;color:#9333ea;">
      <div style="background:#f3e8ff;padding:8px;border-radius:8px;"><i class="fas fa-wallet"></i></div>
      <span style="font-weight:600;font-size:0.9rem;color:#64748b;">Wallet Balance</span>
    </div>
    <div style="font-size:1.5rem;font-weight:700;color:#0f172a;">₹ <?= number_format($stats['wallet_balance'], 2) ?></div>
    <a href="wallet.php" style="color:#2563eb;font-size:0.85rem;text-decoration:none;font-weight:500;">Add Money</a>
  </div>

  <div class="card" style="margin:0;padding:20px;display:flex;flex-direction:column;gap:12px;">
    <div style="display:flex;align-items:center;gap:12px;color:#f59e0b;">
      <div style="background:#fef3c7;padding:8px;border-radius:8px;"><i class="fas fa-star"></i></div>
      <span style="font-weight:600;font-size:0.9rem;color:#64748b;">Loyalty Points</span>
    </div>
    <div style="font-size:1.8rem;font-weight:700;color:#0f172a;"><?= number_format($stats['loyalty_points']) ?></div>
    <a href="rewards.php" style="color:#2563eb;font-size:0.85rem;text-decoration:none;font-weight:500;">View Rewards</a>
  </div>
</div>

<div style="display:grid;grid-template-columns:2fr 1fr;gap:24px;margin-bottom:24px;">
  <div>
    <!-- Shop By Categories -->
    <div class="card" style="margin-bottom:24px;">
      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;">
        <h3 style="margin:0;color:#0f172a;">Shop by Categories</h3>
        <a href="categories.php" style="color:#2563eb;text-decoration:none;font-size:0.85rem;font-weight:500;">View All</a>
      </div>
      <div style="display:grid;grid-template-columns:repeat(6, 1fr);gap:16px;text-align:center;">
        <?php 
        $cats = [
            ['name'=>'Kitchen Sinks', 'icon'=>'fa-sink'],
            ['name'=>'Faucets', 'icon'=>'fa-faucet'],
            ['name'=>'Drain Boards', 'icon'=>'fa-th-large'],
            ['name'=>'Accessories', 'icon'=>'fa-tools'],
            ['name'=>'Soap Dispensers', 'icon'=>'fa-pump-soap'],
            ['name'=>'All Products', 'icon'=>'fa-boxes']
        ];
        foreach($cats as $c): ?>
        <div style="background:#f8fafc;padding:16px;border-radius:12px;cursor:pointer;border:1px solid #e2e8f0;">
          <div style="font-size:2rem;color:#64748b;margin-bottom:12px;"><i class="fas <?= $c['icon'] ?>"></i></div>
          <div style="font-size:0.8rem;font-weight:600;color:#334155;"><?= $c['name'] ?></div>
        </div>
        <?php endforeach; ?>
      </div>
    </div>

    <!-- Popular Products -->
    <div class="card">
      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;">
        <h3 style="margin:0;color:#0f172a;">Popular Products</h3>
        <a href="products.php" style="color:#2563eb;text-decoration:none;font-size:0.85rem;font-weight:500;">View All Products</a>
      </div>
      <div style="display:grid;grid-template-columns:repeat(4, 1fr);gap:16px;">
        <?php 
        $prods = [
            ['name'=>'Premium Sink 24x18', 'desc'=>'Stainless Steel 304', 'price'=>4850, 'badge'=>'Best Seller', 'badge_color'=>'#16a34a'],
            ['name'=>'Handmade Sink 32x18', 'desc'=>'Stainless Steel 304', 'price'=>6250, 'badge'=>'New', 'badge_color'=>'#f59e0b'],
            ['name'=>'Double Bowl Sink 32x20', 'desc'=>'Stainless Steel 304', 'price'=>7150, 'badge'=>'', 'badge_color'=>''],
            ['name'=>'SS Faucet Premium', 'desc'=>'304 Grade', 'price'=>1950, 'badge'=>'Hot', 'badge_color'=>'#ef4444'],
        ];
        foreach($prods as $p): ?>
        <div style="border:1px solid #e2e8f0;border-radius:12px;padding:16px;position:relative;">
          <?php if($p['badge']): ?>
          <span style="position:absolute;top:10px;left:10px;background:<?= $p['badge_color'] ?>;color:#fff;padding:2px 8px;font-size:0.7rem;border-radius:10px;font-weight:600;"><?= $p['badge'] ?></span>
          <?php endif; ?>
          <div style="height:120px;background:#f8fafc;border-radius:8px;margin-bottom:12px;display:flex;align-items:center;justify-content:center;color:#cbd5e1;font-size:3rem;">
             <i class="fas fa-image"></i>
          </div>
          <h4 style="margin:0 0 4px;font-size:0.9rem;color:#0f172a;"><?= $p['name'] ?></h4>
          <p style="margin:0 0 8px;font-size:0.75rem;color:#64748b;"><?= $p['desc'] ?></p>
          <div style="font-weight:700;color:#0f172a;margin-bottom:12px;">₹<?= number_format($p['price'], 2) ?></div>
          <button style="width:100%;padding:8px;background:#2563eb;color:#fff;border:none;border-radius:6px;cursor:pointer;font-weight:600;">Add to Cart</button>
        </div>
        <?php endforeach; ?>
      </div>
    </div>
  </div>

  <div>
    <!-- My Recent Orders -->
    <div class="card" style="margin-bottom:24px;">
      <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;">
        <h3 style="margin:0;color:#0f172a;">My Recent Orders</h3>
        <a href="orders.php" style="color:#2563eb;text-decoration:none;font-size:0.85rem;font-weight:500;">View All</a>
      </div>
      <table style="width:100%;border-collapse:collapse;font-size:0.85rem;">
        <tbody>
          <tr style="border-bottom:1px solid #f1f5f9;">
            <td style="padding:12px 0;font-weight:600;color:#0f172a;">ORD-2024-1258</td>
            <td style="color:#64748b;">12 May 2026</td>
            <td style="font-weight:600;">₹ 12,450.00</td>
            <td style="text-align:right;"><span style="background:#dcfce7;color:#16a34a;padding:2px 8px;border-radius:12px;font-weight:600;">Delivered</span></td>
          </tr>
          <tr style="border-bottom:1px solid #f1f5f9;">
            <td style="padding:12px 0;font-weight:600;color:#0f172a;">ORD-2024-1257</td>
            <td style="color:#64748b;">08 May 2026</td>
            <td style="font-weight:600;">₹ 8,750.00</td>
            <td style="text-align:right;"><span style="background:#eff6ff;color:#2563eb;padding:2px 8px;border-radius:12px;font-weight:600;">Shipped</span></td>
          </tr>
          <tr style="border-bottom:1px solid #f1f5f9;">
            <td style="padding:12px 0;font-weight:600;color:#0f172a;">ORD-2024-1256</td>
            <td style="color:#64748b;">02 May 2026</td>
            <td style="font-weight:600;">₹ 15,200.00</td>
            <td style="text-align:right;"><span style="background:#fef3c7;color:#d97706;padding:2px 8px;border-radius:12px;font-weight:600;">Processing</span></td>
          </tr>
          <tr style="border-bottom:1px solid #f1f5f9;">
            <td style="padding:12px 0;font-weight:600;color:#0f172a;">ORD-2024-1255</td>
            <td style="color:#64748b;">28 Apr 2026</td>
            <td style="font-weight:600;">₹ 6,850.00</td>
            <td style="text-align:right;"><span style="background:#dcfce7;color:#16a34a;padding:2px 8px;border-radius:12px;font-weight:600;">Delivered</span></td>
          </tr>
          <tr>
            <td style="padding:12px 0;font-weight:600;color:#0f172a;">ORD-2024-1254</td>
            <td style="color:#64748b;">20 Apr 2026</td>
            <td style="font-weight:600;">₹ 9,950.00</td>
            <td style="text-align:right;"><span style="background:#dcfce7;color:#16a34a;padding:2px 8px;border-radius:12px;font-weight:600;">Delivered</span></td>
          </tr>
        </tbody>
      </table>
    </div>

    <!-- Quick Links -->
    <div style="display:grid;grid-template-columns:1fr 1fr 1fr 1fr;gap:12px;margin-bottom:24px;">
      <div class="card" style="margin:0;padding:16px;text-align:center;cursor:pointer;">
        <div style="color:#2563eb;font-size:1.5rem;margin-bottom:8px;"><i class="fas fa-map-marker-alt"></i></div>
        <div style="font-size:0.75rem;font-weight:600;color:#334155;">Track Order</div>
      </div>
      <div class="card" style="margin:0;padding:16px;text-align:center;cursor:pointer;">
        <div style="color:#16a34a;font-size:1.5rem;margin-bottom:8px;"><i class="fas fa-question-circle"></i></div>
        <div style="font-size:0.75rem;font-weight:600;color:#334155;">My Inquiries</div>
      </div>
      <div class="card" style="margin:0;padding:16px;text-align:center;cursor:pointer;">
        <div style="color:#9333ea;font-size:1.5rem;margin-bottom:8px;"><i class="fas fa-file-invoice"></i></div>
        <div style="font-size:0.75rem;font-weight:600;color:#334155;">Quotations</div>
      </div>
      <div class="card" style="margin:0;padding:16px;text-align:center;cursor:pointer;">
        <div style="color:#d97706;font-size:1.5rem;margin-bottom:8px;"><i class="fas fa-undo"></i></div>
        <div style="font-size:0.75rem;font-weight:600;color:#334155;">Returns</div>
      </div>
    </div>

    <!-- Need Help -->
    <div class="card">
      <h3 style="margin:0 0 16px;color:#0f172a;">Need Help?</h3>
      <div style="display:flex;align-items:center;gap:16px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #f1f5f9;cursor:pointer;">
        <div style="color:#2563eb;font-size:1.2rem;"><i class="fas fa-headset"></i></div>
        <div style="flex:1;">
          <div style="font-weight:600;color:#0f172a;font-size:0.9rem;">Create Support Ticket</div>
          <div style="font-size:0.75rem;color:#64748b;">We are here to help you</div>
        </div>
        <i class="fas fa-chevron-right" style="color:#cbd5e1;font-size:0.8rem;"></i>
      </div>
      <div style="display:flex;align-items:center;gap:16px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #f1f5f9;cursor:pointer;">
        <div style="color:#16a34a;font-size:1.2rem;"><i class="fas fa-comment-dots"></i></div>
        <div style="flex:1;">
          <div style="font-weight:600;color:#0f172a;font-size:0.9rem;">Chat with us</div>
          <div style="font-size:0.75rem;color:#64748b;">Available 9AM - 6PM</div>
        </div>
        <i class="fas fa-chevron-right" style="color:#cbd5e1;font-size:0.8rem;"></i>
      </div>
      <div style="display:flex;align-items:center;gap:16px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #f1f5f9;cursor:pointer;">
        <div style="color:#2563eb;font-size:1.2rem;"><i class="fas fa-phone-alt"></i></div>
        <div style="flex:1;">
          <div style="font-weight:600;color:#0f172a;font-size:0.9rem;">Call us</div>
          <div style="font-size:0.75rem;color:#64748b;">+91 12345 67890</div>
        </div>
        <i class="fas fa-chevron-right" style="color:#cbd5e1;font-size:0.8rem;"></i>
      </div>
      <div style="display:flex;align-items:center;gap:16px;cursor:pointer;">
        <div style="color:#16a34a;font-size:1.2rem;"><i class="fab fa-whatsapp"></i></div>
        <div style="flex:1;">
          <div style="font-weight:600;color:#0f172a;font-size:0.9rem;">WhatsApp Support</div>
          <div style="font-size:0.75rem;color:#64748b;">+91 98765 43210</div>
        </div>
        <i class="fas fa-chevron-right" style="color:#cbd5e1;font-size:0.8rem;"></i>
      </div>
    </div>
  </div>
</div>

<?php 
echo '</div></main></body></html>'; 
?>
