<?php
require_once __DIR__ . '/../config.php';
if (isCustomer())
  redirect(SITE_URL . '/pages/account.php');
$next = trim($_GET['next'] ?? '');
$error = '';
if ($_SERVER['REQUEST_METHOD'] === 'POST') {
  $email = trim($_POST['email'] ?? '');
  $pass = trim($_POST['password'] ?? '');
  if ($email && $pass) {
    $db = getDB();
    $stmt = $db->prepare("SELECT * FROM customers WHERE email=?");
    $stmt->execute([$email]);
    $cust = $stmt->fetch();
    if ($cust && password_verify($pass, $cust['password'])) {
      $_SESSION['customer_id'] = $cust['id'];
      $_SESSION['customer_name'] = $cust['name'];
      $_SESSION['customer_email'] = $cust['email'];
      redirect($next ?: SITE_URL . '/pages/account.php');
    }
    $error = 'Invalid email or password.';
  } else {
    $error = 'Please enter email and password.';
  }
}
$page_title = 'Customer Login | Balimeen Private Limited';
?>
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1.0">
  <title><?= h($page_title) ?></title>
  <link
    href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Outfit:wght@700;800;900&display=swap"
    rel="stylesheet">
  <link rel="stylesheet" href="<?= SITE_URL ?>/assets/css/style.css">
  <link rel="stylesheet" href="<?= SITE_URL ?>/assets/css/shop.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.0/css/all.min.css">
</head>

<body>
  <div class="auth-page">
    <!-- Left -->
    <div class="auth-left">
      <div class="auth-left-inner">
      <div class="auth-brand" style="background:transparent;border:none;">
        <img src="<?= SITE_URL ?>/assets/images/logo.jpg" alt="Balimeen" style="width:100%;height:100%;object-fit:contain;border-radius:12px;">
      </div>
        <h2>Welcome to <span>Balimeen</span></h2>
        <p>Sign in to track your orders, manage your profile and enjoy exclusive customer benefits.</p>
        <div class="auth-perks">
          <div class="auth-perk">
            <div class="auth-perk-icon">📦</div>
            <div class="auth-perk-text">
              <h4>Track Your Orders</h4>
              <p>Real-time order status from dispatch to delivery</p>
            </div>
          </div>
          <div class="auth-perk">
            <div class="auth-perk-icon">💰</div>
            <div class="auth-perk-text">
              <h4>Factory Direct Prices</h4>
              <p>Best prices on premium SS 304 kitchen sinks</p>
            </div>
          </div>
          <div class="auth-perk">
            <div class="auth-perk-icon">🚚</div>
            <div class="auth-perk-text">
              <h4>Pan-India Delivery</h4>
              <p>Secure shipping to all major states</p>
            </div>
          </div>
          <div class="auth-perk">
            <div class="auth-perk-icon">🛡️</div>
            <div class="auth-perk-text">
              <h4>Quality Guarantee</h4>
              <p>ISI certified products with after-sales support</p>
            </div>
          </div>
        </div>
      </div>
    </div>
    <!-- Right -->
    <div class="auth-right">
      <div class="auth-card">
        <h3>Sign In</h3>
        <p class="sub-head">Don't have an account? <a href="register.php">Create one free →</a></p>
        <?php if ($error): ?>
          <div class="alert alert-error"
            style="margin-bottom:18px;border-radius:9px;padding:11px 14px;background:#fef2f2;border:1px solid #fca5a5;color:#991b1b;font-size:.87rem;font-weight:500;display:flex;align-items:center;gap:8px;">
            <i class="fas fa-exclamation-circle"></i><?= h($error) ?></div><?php endif; ?>
        <form method="POST">
          <input type="hidden" name="next" value="<?= h($next) ?>">
          <label class="auth-form-label"><i class="fas fa-envelope" style="color:#2557d6;margin-right:5px;"></i>Email
            Address</label>
          <div class="auth-input-wrap"><i class="fas fa-envelope ico"></i><input type="email" name="email"
              placeholder="your@email.com" value="<?= h($_POST['email'] ?? '') ?>" required autofocus
              autocomplete="email"></div>
          <label class="auth-form-label"><i class="fas fa-lock"
              style="color:#2557d6;margin-right:5px;"></i>Password</label>
          <div class="auth-input-wrap"><i class="fas fa-lock ico"></i><input type="password" name="password"
              id="passInput" placeholder="••••••••" required autocomplete="current-password"><button type="button"
              class="auth-eye" onclick="togglePass()"><i class="fas fa-eye" id="eyeIco"></i></button></div>
          <button type="submit" class="auth-btn"><i class="fas fa-sign-in-alt"></i> Sign In to My Account</button>
        </form>
        <div class="auth-divider">or</div>
        <div style="text-align:center;">
          <a href="<?= SITE_URL ?>" style="font-size:.83rem;color:#64748b;"><i class="fas fa-arrow-left"></i> Back to
            Website</a>
          &nbsp;·&nbsp;
          <a href="<?= SITE_URL ?>/pages/products.php" style="font-size:.83rem;color:#2557d6;">Browse Products</a>
        </div>
        <div class="auth-note" style="margin-top:16px;">By signing in you agree to our <a href="#">Terms of Service</a>
        </div>
      </div>
    </div>
  </div>
  <script>
    function togglePass() {
      const i = document.getElementById('passInput');
      const ic = document.getElementById('eyeIco');
      i.type = i.type === 'password' ? 'text' : 'password';
      ic.className = i.type === 'password' ? 'fas fa-eye' : 'fas fa-eye-slash';
    }
  </script>
</body>

</html>