@extends('layouts.app')
@section('title', 'Order Placed - AVIOBOOTS')

@section('content')
<main class="container" style="padding: 4rem 2rem; max-width:800px; text-align:center;">
    <div style="background:#d4edda; color:#155724; padding:3rem; border-radius:16px;">
        <i class="fa-solid fa-circle-check" style="font-size:4rem; color:#155724;"></i>
        <h1 style="margin:1rem 0;">Order Confirmed!</h1>
        <p style="font-size:1.2rem;">Your order <strong>#{{ $order->id }}</strong> has been placed successfully.</p>
        <p>Payment method: <strong>Cash on Delivery</strong></p>
        <p>Total: <strong>Rs {{ number_format($order->total, 0) }}</strong></p>
        <p style="margin-top:1rem;">You will receive a call from our team to confirm delivery.</p>
        <a href="{{ route('home') }}" class="btn" style="margin-top:1.5rem;">Continue Shopping</a>
    </div>

    <div style="margin-top:3rem; text-align:left;">
        <h3>Order items</h3>
        @foreach($order->items as $it)
            <div class="summary-row">
                <span>{{ $it->product_name }} × {{ $it->qty }} ({{ $it->size ?? 'N/A' }})</span>
                <span>Rs {{ number_format($it->price * $it->qty, 0) }}</span>
            </div>
        @endforeach
        <div class="summary-row total"><span>Total</span><span>Rs {{ number_format($order->total, 0) }}</span></div>
    </div>
</main>
@endsection