{% extends "base.html" %}
{% block title %}Checkout — KiwiCrib{% endblock %}
{% block content %}
<h1 class="text-2xl font-bold mb-4">Checkout</h1>
{% if not cart %}
<p>Your cart is empty. <a href="{% url 'orders:cart_detail' %}" class="text-blue-600">Return to cart</a>.</p>
{% else %}
<table class="min-w-full border">
    <thead>
        <tr class="bg-gray-100">
            <th class="border px-2 py-1">Product</th>
            <th class="border px-2 py-1">Qty</th>
            <th class="border px-2 py-1">Unit Price</th>
            <th class="border px-2 py-1">Total</th>
        </tr>
    </thead>
    <tbody>
        {% for item in cart %}
        <tr class="border-t">
            <td class="border px-2 py-1">{{ item.product.name }}</td>
            <td class="border px-2 py-1">{{ item.quantity }}</td>
            <td class="border px-2 py-1">${{ item.unit_price }}</td>
            <td class="border px-2 py-1">${{ item.total_price }}</td>
        </tr>
        {% endfor %}
    </tbody>
    <tfoot>
        <tr>
            <td colspan="3" class="text-right font-bold border px-2 py-1">Cart Total</td>
            <td class="border px-2 py-1 font-bold">${{ cart.total_price }}</td>
        </tr>
    </tfoot>
</table>
<form method="post" class="mt-4">
    {% csrf_token %}
    <button type="submit" class="bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded">Place Order</button>
    <p class="text-sm text-gray-600 mt-2">(Payment integration pending — orders will be created as "new" status.)</p>
</form>
{% endif %}
{% endblock %}