<?php
// V14: One-Page Checkout - All steps on a single page
$currency = isset($store_setting['currency_sign']) ? $store_setting['currency_sign'] : '$';
$is_rtl = (isset($store_setting['store_direction']) && $store_setting['store_direction'] == 'rtl');
?>
<div class="container py-4">
    <div class="row justify-content-center">
        <div class="col-lg-10">
            <!-- Progress Indicator -->
            <div class="d-flex align-items-center justify-content-center mb-4 gap-3">
                <span class="badge bg-primary rounded-pill px-3 py-2"><i class="fas fa-shopping-cart me-1"></i> <?= __('store.cart') ?></span>
                <i class="fas fa-chevron-right text-muted"></i>
                <span class="badge bg-primary rounded-pill px-3 py-2"><i class="fas fa-truck me-1"></i> <?= __('store.shipping') ?></span>
                <i class="fas fa-chevron-right text-muted"></i>
                <span class="badge bg-primary rounded-pill px-3 py-2"><i class="fas fa-credit-card me-1"></i> <?= __('store.payment') ?></span>
            </div>

            <form id="onepage-checkout-form" method="post" action="<?= $checkout_url ?>/confirm_order" enctype="multipart/form-data">
                <div class="row g-4">
                    <!-- Left Column: Shipping + Payment -->
                    <div class="col-lg-7">
                        <!-- Login/Register Section -->
                        <?php if (!$is_logged): ?>
                        <div class="card border-0 shadow-sm mb-4">
                            <div class="card-header bg-light border-0">
                                <h6 class="mb-0 fw-bold"><i class="fas fa-user me-2"></i><?= __('store.customer_info') ?></h6>
                            </div>
                            <div class="card-body">
                                <div class="row g-3">
                                    <div class="col-md-6">
                                        <label class="form-label"><?= __('store.email') ?> <span class="text-danger">*</span></label>
                                        <input type="email" name="email" class="form-control" required placeholder="<?= __('store.email') ?>">
                                    </div>
                                    <div class="col-md-6">
                                        <label class="form-label"><?= __('store.phone') ?></label>
                                        <input type="text" name="phone" class="form-control" placeholder="<?= __('store.phone') ?>">
                                    </div>
                                </div>
                                <div class="mt-2">
                                    <small class="text-muted"><?= __('store.already_have_account') ?> <a href="<?= $base_url ?>/login"><?= __('store.login') ?></a></small>
                                </div>
                            </div>
                        </div>
                        <?php endif; ?>

                        <!-- Shipping Address -->
                        <?php if ($allow_shipping): ?>
                        <div class="card border-0 shadow-sm mb-4">
                            <div class="card-header bg-light border-0">
                                <h6 class="mb-0 fw-bold"><i class="fas fa-map-marker-alt me-2"></i><?= __('store.shipping_address') ?></h6>
                            </div>
                            <div class="card-body">
                                <div id="onepage-shipping-form">
                                    <!-- Shipping form will be loaded via AJAX from checkout_shipping -->
                                    <div class="text-center py-3">
                                        <div class="spinner-border spinner-border-sm text-primary" role="status"></div>
                                        <span class="ms-2 text-muted">Loading shipping options...</span>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <?php endif; ?>

                        <!-- Payment Method -->
                        <div class="card border-0 shadow-sm mb-4">
                            <div class="card-header bg-light border-0">
                                <h6 class="mb-0 fw-bold"><i class="fas fa-credit-card me-2"></i><?= __('store.payment_method') ?></h6>
                            </div>
                            <div class="card-body">
                                <div id="onepage-payment-methods">
                                    <?php
                                    $ps = $paymentsetting;
                                    $payment_methods = [];
                                    if (!empty($ps['paypal_enable'])) $payment_methods[] = ['id' => 'paypal', 'name' => 'PayPal', 'icon' => 'fab fa-paypal'];
                                    if (!empty($ps['stripe_enable'])) $payment_methods[] = ['id' => 'stripe', 'name' => 'Stripe', 'icon' => 'fab fa-stripe'];
                                    if (!empty($ps['cod_enable'])) $payment_methods[] = ['id' => 'cod', 'name' => __('store.cash_on_delivery'), 'icon' => 'fas fa-money-bill'];
                                    if (!empty($ps['bank_enable'])) $payment_methods[] = ['id' => 'bank', 'name' => __('store.bank_transfer'), 'icon' => 'fas fa-university'];
                                    ?>
                                    <?php if (!empty($payment_methods)): ?>
                                    <div class="row g-2">
                                        <?php foreach ($payment_methods as $pm): ?>
                                        <div class="col-md-6">
                                            <div class="form-check border rounded p-3">
                                                <input class="form-check-input" type="radio" name="payment_method" value="<?= $pm['id'] ?>" id="pm_<?= $pm['id'] ?>">
                                                <label class="form-check-label w-100 cursor-pointer" for="pm_<?= $pm['id'] ?>">
                                                    <i class="<?= $pm['icon'] ?> me-2"></i><?= $pm['name'] ?>
                                                </label>
                                            </div>
                                        </div>
                                        <?php endforeach; ?>
                                    </div>
                                    <?php else: ?>
                                    <p class="text-muted">No payment methods configured.</p>
                                    <?php endif; ?>
                                </div>
                            </div>
                        </div>

                        <!-- Order Comment -->
                        <div class="card border-0 shadow-sm mb-4">
                            <div class="card-header bg-light border-0">
                                <h6 class="mb-0 fw-bold"><i class="fas fa-comment me-2"></i><?= __('store.order_comments') ?></h6>
                            </div>
                            <div class="card-body">
                                <textarea name="order_comment" class="form-control" rows="3" placeholder="<?= __('store.order_comments') ?>"></textarea>
                            </div>
                        </div>
                    </div>

                    <!-- Right Column: Order Summary -->
                    <div class="col-lg-5">
                        <div class="card border-0 shadow-sm sticky-top" style="top:20px">
                            <div class="card-header bg-light border-0">
                                <h6 class="mb-0 fw-bold"><i class="fas fa-receipt me-2"></i><?= __('store.order_summary') ?></h6>
                            </div>
                            <div class="card-body">
                                <?php if (!empty($products)): ?>
                                <?php foreach ($products as $p): ?>
                                <div class="d-flex align-items-center gap-3 mb-3 pb-3 border-bottom">
                                    <div class="position-relative flex-shrink-0">
                                        <img src="<?= !empty($p['product_image']) ? base_url('assets/images/product/'.$p['product_image']) : base_url('assets/images/no-image.png') ?>" class="rounded" width="50" height="50" style="object-fit:cover">
                                        <span class="position-absolute top-0 start-100 translate-middle badge rounded-pill bg-primary" style="font-size:10px"><?= $p['quantity'] ?></span>
                                    </div>
                                    <div class="flex-grow-1">
                                        <p class="mb-0 small fw-medium text-truncate" style="max-width:180px"><?= htmlspecialchars($p['product_name']) ?></p>
                                        <?php if (!empty($p['variation_name'])): ?>
                                        <small class="text-muted"><?= $p['variation_name'] ?></small>
                                        <?php endif; ?>
                                    </div>
                                    <span class="fw-medium"><?= $currency ?><?= number_format($p['product_price'] * $p['quantity'], 2) ?></span>
                                </div>
                                <?php endforeach; ?>
                                <?php endif; ?>

                                <!-- Coupon -->
                                <div class="mb-3">
                                    <div class="input-group">
                                        <input type="text" name="coupon_code" class="form-control form-control-sm" placeholder="<?= __('store.coupon_code') ?>">
                                        <button type="button" class="btn btn-outline-primary btn-sm" id="apply-coupon"><?= __('store.apply') ?></button>
                                    </div>
                                </div>

                                <!-- Totals -->
                                <div class="border-top pt-3">
                                    <?php if (!empty($totals)): ?>
                                    <?php foreach ($totals as $t): ?>
                                    <div class="d-flex justify-content-between mb-2">
                                        <span class="text-muted"><?= $t['title'] ?></span>
                                        <span><?= $currency ?><?= number_format($t['value'], 2) ?></span>
                                    </div>
                                    <?php endforeach; ?>
                                    <?php endif; ?>
                                    <hr>
                                    <div class="d-flex justify-content-between">
                                        <span class="fw-bold fs-5"><?= __('store.total') ?></span>
                                        <span class="fw-bold fs-5 text-primary"><?= $currency ?><?= number_format($total, 2) ?></span>
                                    </div>
                                </div>

                                <button type="submit" class="btn btn-primary w-100 mt-4 py-3 fw-bold">
                                    <i class="fas fa-lock me-2"></i><?= __('store.place_order') ?>
                                </button>

                                <div class="text-center mt-2">
                                    <small class="text-muted"><i class="fas fa-shield-alt me-1"></i> <?= __('store.secure_checkout') ?></small>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
// Load shipping form via AJAX if available
$(document).ready(function(){
    var shippingDiv = $('#onepage-shipping-form');
    if (shippingDiv.length) {
        $.get('<?= $checkout_url ?>/checkout_shipping', function(html){
            shippingDiv.html(html);
        });
    }
});
</script>
