<?php
$page_title = "Checkout — GyaniGuru by JMC";
include 'includes/header.php';

// If user is not logged in, they can still checkout
$is_logged_in = isset($_SESSION['user_id']);
$u_name = '';
$u_email = '';
$u_phone = '';
$u_address = '';
$u_city = '';
$u_pincode = '';

if ($is_logged_in) {
    $user = get_row("SELECT * FROM users WHERE id = ?", [$_SESSION['user_id']]);
    $u_name = $user['name'];
    $u_email = $user['email'];
    $u_phone = $user['phone'] ?? '';
    $u_address = $user['address'] ?? '';
    $u_city = $user['city'] ?? '';
    $u_pincode = $user['pincode'] ?? '';
}

// Handle Order Submission
if ($_SERVER['REQUEST_METHOD'] == 'POST' && isset($_POST['place_order'])) {
    if (!$is_logged_in) {
        $name = $_POST['name'];
        $email = $_POST['email'];
        $phone = $_POST['phone'];
        $pass = password_hash('Guest@123', PASSWORD_DEFAULT);
        
        $check = get_row("SELECT id FROM users WHERE email = ?", [$email]);
        if ($check) {
            $user_id = $check['id'];
        } else {
            $conn->query("INSERT INTO users (name, email, phone, password) VALUES ('$name', '$email', '$phone', '$pass')");
            $user_id = $conn->insert_id;
        }
    } else {
        $user_id = $_SESSION['user_id'];
    }

    $total = $_POST['total_amount'];
    $pm = $_POST['payment_method'];
    $address = $_POST['address'] . ", " . $_POST['city'] . " - " . $_POST['pincode'];
    
    // Insert Order
    $razorpay_order_id = $_POST['razorpay_order_id'] ?? '';
    $razorpay_payment_id = $_POST['razorpay_payment_id'] ?? '';
    $razorpay_signature = $_POST['razorpay_signature'] ?? '';
    $payment_status = ($pm === 'Online' && $razorpay_payment_id) ? 'paid' : 'pending';

    $stmt = $conn->prepare("INSERT INTO orders (user_id, total_amount, payment_method, payment_status, shipping_address, razorpay_order_id, razorpay_payment_id, razorpay_signature) VALUES (?, ?, ?, ?, ?, ?, ?, ?)");
    $stmt->bind_param("idssssss", $user_id, $total, $pm, $payment_status, $address, $razorpay_order_id, $razorpay_payment_id, $razorpay_signature);
    $stmt->execute();
    $order_id = $conn->insert_id;

    // Insert Order Items
    $cart_data = json_decode($_POST['cart_json'], true);
    foreach ($cart_data as $item) {
        $bid = (int)$item['id'];
        $qty = (int)$item['qty'];
        $price = (float)$item['price'];
        $conn->query("INSERT INTO order_items (order_id, book_id, quantity, price) VALUES ($order_id, $bid, $qty, $price)");
    }

    echo "<script>
        localStorage.setItem('gg_cart', '[]');
        if(window.updateCartBadge) updateCartBadge();
        window.location.href = 'order-success.php?id=$order_id';
    </script>";
    exit();
}
?>

<div class="page-header py-5" style="background: var(--gradient-divine); border-bottom: 2px solid var(--gold); color: white;">
    <div class="container d-flex justify-content-between align-items-center py-2">
        <div>
            <h1 class="font-cinzel m-0 text-white">Checkout</h1>
            <p class="m-0" style="color: var(--gold-light); opacity: 0.8;">Securely complete your quest for knowledge</p>
        </div>
        <div class="checkout-steps d-none d-md-flex align-items-center gap-3">
            <span class="text-white-50 small fw-bold">1. CART</span>
            <i class="bi bi-chevron-right" style="color: var(--gold); opacity: 0.5;"></i>
            <span class="badge rounded-pill bg-gold text-dark px-4 py-2" style="font-weight:700">2. ADDRESS</span>
            <i class="bi bi-chevron-right" style="color: var(--gold); opacity: 0.5;"></i>
            <span style="color: rgba(255,255,255,0.4); font-size: 0.85rem; font-weight: 600;">3. PAYMENT</span>
        </div>
    </div>
</div>

<div class="container py-5">
    <div class="row g-5">
        <div class="col-lg-7">
            <div class="bg-white p-4 p-md-5 rounded shadow-sm" style="border: 1px solid var(--cream-dark)">
                <h4 class="font-cinzel mb-4" style="color: var(--maroon); border-left: 5px solid var(--gold); padding-left: 15px;">Shipping Details</h4>
                <form id="checkoutForm" action="" method="POST">
                    <div class="row g-4">
                        <div class="col-md-12">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">Full Name</label>
                            <input type="text" name="name" class="form-control" style="background: var(--warm-white)" required value="<?php echo $u_name; ?>" <?php echo $is_logged_in ? 'readonly' : ''; ?>>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">Email Address</label>
                            <input type="email" name="email" class="form-control" style="background: var(--warm-white)" required value="<?php echo $u_email; ?>" <?php echo $is_logged_in ? 'readonly' : ''; ?>>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">Phone Number</label>
                            <input type="text" name="phone" class="form-control" style="background: var(--warm-white)" required value="<?php echo $u_phone; ?>" placeholder="10-digit mobile number">
                        </div>
                        <div class="col-12">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">Full Delivery Address</label>
                            <textarea name="address" class="form-control" style="background: var(--warm-white)" rows="3" required placeholder="House No, Street, Landmark..."><?php echo $u_address; ?></textarea>
                        </div>
                        <div class="col-md-6">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">City</label>
                            <input type="text" name="city" class="form-control" style="background: var(--warm-white)" required value="<?php echo $u_city; ?>">
                        </div>
                        <div class="col-md-6">
                            <label class="form-label small text-uppercase fw-bold" style="color: var(--text-light)">Pincode</label>
                            <input type="text" name="pincode" class="form-control" style="background: var(--warm-white)" required value="<?php echo $u_pincode; ?>">
                        </div>
                    </div>

                    <h4 class="font-cinzel mt-5 mb-4" style="color: var(--maroon); border-left: 5px solid var(--gold); padding-left: 15px;">Payment Methodology</h4>
                    <div class="p-4 rounded" style="background: var(--warm-white); border: 2px dashed var(--cream-dark)">
                        <div class="form-check mb-3">
                            <input class="form-check-input" type="radio" name="payment_method" id="pm1" value="COD" checked>
                            <label class="form-check-label fw-bold" for="pm1" style="color: var(--text-dark)">
                                <i class="bi bi-cash-coin me-2" style="color: var(--gerua)"></i> Cash on Delivery (COD)
                            </label>
                            <p class="text-muted small ms-4">Pay securely at your doorstep.</p>
                        </div>
                        <div class="form-check opacity-50">
                            <input class="form-check-input" type="radio" name="payment_method" id="pm2" value="Online" disabled>
                            <label class="form-check-label fw-bold" for="pm2" style="color: var(--text-dark)">
                                <i class="bi bi-credit-card me-2"></i> Online Payment (UPI / Cards / Net Banking)
                            </label>
                            <span class="badge bg-gold text-dark ms-2" style="font-size: 0.6rem;">SOON</span>
                        </div>
                    </div>

                    <input type="hidden" name="total_amount" id="formTotal">
                    <input type="hidden" name="cart_json" id="formCartJson">
                    <input type="hidden" name="place_order" value="1">
                    <input type="hidden" name="razorpay_order_id" id="razorpay_order_id">
                    <input type="hidden" name="razorpay_payment_id" id="razorpay_payment_id">
                    <input type="hidden" name="razorpay_signature" id="razorpay_signature">

                    <button type="submit" id="submitOrderBtn" class="btn btn-saffron w-100 py-3 mt-5 shadow-lg">
                        CONFIRM DIVINE ORDER <i class="bi bi-check-circle-fill ms-2"></i>
                    </button>
                </form>
            </div>
        </div>

        <div class="col-lg-5">
            <div class="bg-white p-4 rounded shadow-sm" style="border: 1px solid var(--cream-dark); position: sticky; top: 120px;">
                <h5 class="font-cinzel mb-4" style="color: var(--maroon); border-bottom: 2px solid var(--gold); padding-bottom: 15px;">Order Summary</h5>
                <div id="checkoutItemsList" class="mb-4">
                    <!-- Loaded by JS -->
                </div>
                <div class="d-flex justify-content-between mb-2">
                    <span style="color: var(--text-medium)">Subtotal</span>
                    <span id="checkSubtotal" class="fw-bold" style="color: var(--text-dark)">₹0</span>
                </div>
                <div class="d-flex justify-content-between mb-2">
                    <span style="color: var(--text-medium)">Shipping</span>
                    <span id="checkShipping" style="color: #27ae60; font-weight: 700;">FREE</span>
                </div>
                <hr style="border-color: var(--cream-dark)">
                <div class="d-flex justify-content-between mt-3">
                    <h4 class="font-cinzel m-0" style="color: var(--maroon)">Total</h4>
                    <h4 class="m-0 fw-bold" id="checkTotal" style="color: var(--maroon)">₹0</h4>
                </div>
                
                <div class="mt-5 p-3 rounded" style="background: var(--warm-white); border: 1px solid var(--cream-dark); text-align: center;">
                    <p class="small mb-0" style="color: var(--text-medium)"><i class="bi bi-shield-lock-fill me-2" style="color: var(--gerua)"></i> Your order is encrypted and handled with care.</p>
                </div>
            </div>
        </div>
    </div>
</div>

<script>
    document.addEventListener('DOMContentLoaded', function() {
        const cart = JSON.parse(localStorage.getItem('gg_cart') || '[]');
        if (cart.length === 0) {
            window.location.href = 'shop.php';
            return;
        }

        const itemsList = document.getElementById('checkoutItemsList');
        let subtotal = 0;
        
        itemsList.innerHTML = cart.map(item => {
            subtotal += item.price * item.qty;
            return `
                <div class="d-flex justify-content-between align-items-center mb-3">
                    <div class="d-flex align-items-center gap-3">
                        <div class="position-relative">
                            <img src="${item.image}" width="40" class="rounded shadow-sm" onerror="this.src='images/placeholder.png'">
                            <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-gold text-dark" style="font-size: 0.6rem">
                                ${item.qty}
                            </span>
                        </div>
                        <span style="font-size: 0.9rem; color: var(--text-dark); font-weight: 500">${item.title}</span>
                    </div>
                    <span class="fw-bold" style="color: var(--text-dark)">₹${(item.price * item.qty).toLocaleString()}</span>
                </div>
            `;
        }).join('');

        let shipping = subtotal >= 999 ? 0 : 80;
        let total = subtotal + shipping;

        document.getElementById('checkSubtotal').textContent = '₹' + subtotal.toLocaleString();
        const shipEl = document.getElementById('checkShipping');
        if (shipping === 0) {
            shipEl.textContent = 'FREE';
            shipEl.style.color = '#27ae60';
        } else {
            shipEl.textContent = '₹' + shipping;
            shipEl.style.color = 'var(--text-medium)';
        }
        document.getElementById('checkTotal').textContent = '₹' + total.toLocaleString();
        
        document.getElementById('formTotal').value = total;
        document.getElementById('formCartJson').value = JSON.stringify(cart);

        document.getElementById('checkoutForm').addEventListener('submit', function() {
            const btn = document.getElementById('submitOrderBtn');
            btn.innerHTML = '<span class="spinner"></span> Processing Order...';
            btn.style.pointerEvents = 'none';
        });
    });
</script>

<?php include 'includes/footer.php'; ?>