@model OrderViewModel
@{
    ViewData["Title"] = "Order Confirmed";
}

<div class="max-w-2xl mx-auto px-8 py-16 text-center">
    <div class="text-success text-6xl mb-4"><i class="fas fa-check-circle"></i></div>
    <h1 class="text-3xl font-bold mb-2">Order Confirmed!</h1>
    <p class="text-gray-500 mb-6">Thank you for your purchase. Your order has been placed successfully.</p>

    <div class="card border rounded-lg p-6 shadow-sm text-left">
        <div class="flex items-center justify-between mb-4">
            <span class="text-sm text-gray-500">@Model.OrderNumber</span>
            <span class="badge bg-success">@Model.Status</span>
        </div>
        <div class="space-y-2">
            @foreach (var item in Model.Items)
            {
                <div class="flex items-center justify-between text-sm">
                    <span>@item.ProductName <span class="text-gray-400">x@(item.Quantity)</span></span>
                    <span class="font-semibold">$@item.Subtotal.ToString("F2")</span>
                </div>
            }
        </div>
        <div class="border-t mt-4 pt-4 flex justify-between">
            <span class="font-semibold text-lg">Total</span>
            <span class="text-2xl font-bold text-gray-900">$@Model.TotalAmount.ToString("F2")</span>
        </div>
    </div>

    <div class="mt-6 flex gap-4 justify-center">
        <a href="/" class="btn btn-primary">Continue Shopping</a>
        <a href="/account/orders" class="btn btn-outline-secondary">View Orders</a>
    </div>
</div>