@extends('customer.dashboard.layout')

@section('title', 'Order Details')

@section('content')
<div class="row mb-4">
    <div class="col-12">
        <div class="d-flex justify-content-between align-items-center">
            <div>
                <h2 class="mb-1">Order #{{ $order->order_number }}</h2>
                <p class="text-muted mb-0">
                    Placed on {{ $order->created_at->format('F d, Y \a\t g:i A') }}
                </p>
            </div>
            <div>
                <a href="{{ route('customer.orders', $subdomain) }}" class="btn btn-outline-secondary">
                    <i class="bi bi-arrow-left"></i> Back to Orders
                </a>
                @if($order->payment_status === 'paid')
                <a href="{{ route('customer.orders.invoice', [$subdomain, $order->id]) }}"
                   class="btn btn-primary"
                   target="_blank">
                    <i class="bi bi-download"></i> Download Invoice
                </a>
                @endif
            </div>
        </div>
    </div>
</div>

<div class="row">
    <!-- Order Status -->
    <div class="col-md-8 mb-4">
        <div class="content-card">
            <h3 class="h5 mb-4">Order Status</h3>

            <div class="row mb-4">
                <div class="col-md-6">
                    <div class="mb-3">
                        <strong>Order Status:</strong>
                        <span class="badge bg-{{ $order->status === 'completed' ? 'success' : ($order->status === 'pending' ? 'warning' : ($order->status === 'processing' ? 'info' : 'secondary')) }} ms-2">
                            {{ ucfirst($order->status) }}
                        </span>
                    </div>

                    <div class="mb-3">
                        <strong>Payment Status:</strong>
                        <span class="badge bg-{{ $order->payment_status === 'paid' ? 'success' : ($order->payment_status === 'pending' ? 'warning' : 'danger') }} ms-2">
                            {{ ucfirst($order->payment_status) }}
                        </span>
                    </div>
                </div>

                <div class="col-md-6">
                    <div class="mb-3">
                        <strong>Payment Method:</strong>
                        <span class="text-muted">{{ ucfirst(str_replace('_', ' ', $order->payment_method)) }}</span>
                    </div>

                    @if($order->paid_at)
                    <div class="mb-3">
                        <strong>Paid At:</strong>
                        <span class="text-muted">{{ $order->paid_at->format('M d, Y g:i A') }}</span>
                    </div>
                    @endif
                </div>
            </div>

            <!-- Order Items -->
            <h3 class="h5 mb-3">Order Items</h3>

            <div class="table-responsive">
                <table class="table">
                    <thead>
                        <tr>
                            <th>Product</th>
                            <th>Price</th>
                            <th>Quantity</th>
                            <th class="text-end">Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach($order->orderItems as $item)
                        <tr>
                            <td>
                                <div>
                                    <strong>{{ $item->product_name }}</strong>
                                </div>
                                @if($item->variation_details)
                                <small class="text-muted">{{ $item->variation_details }}</small>
                                @endif
                                @if($item->product_sku)
                                <div><small class="text-muted">SKU: {{ $item->product_sku }}</small></div>
                                @endif
                            </td>
                            <td>RM {{ number_format($item->unit_price, 2) }}</td>
                            <td>{{ $item->quantity }}</td>
                            <td class="text-end">RM {{ number_format($item->total_price, 2) }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="3" class="text-end"><strong>Subtotal:</strong></td>
                            <td class="text-end">RM {{ number_format($order->subtotal, 2) }}</td>
                        </tr>
                        @if($order->tax_amount > 0)
                        <tr>
                            <td colspan="3" class="text-end"><strong>Tax:</strong></td>
                            <td class="text-end">RM {{ number_format($order->tax_amount, 2) }}</td>
                        </tr>
                        @endif
                        @if($order->shipping_amount > 0)
                        <tr>
                            <td colspan="3" class="text-end"><strong>Shipping:</strong></td>
                            <td class="text-end">RM {{ number_format($order->shipping_amount, 2) }}</td>
                        </tr>
                        @endif
                        @if($order->discount_amount > 0)
                        <tr>
                            <td colspan="3" class="text-end"><strong>Discount:</strong></td>
                            <td class="text-end text-success">-RM {{ number_format($order->discount_amount, 2) }}</td>
                        </tr>
                        @endif
                        <tr class="table-active">
                            <td colspan="3" class="text-end"><strong>Total:</strong></td>
                            <td class="text-end"><strong>RM {{ number_format($order->total_amount, 2) }}</strong></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>
    </div>

    <!-- Delivery & Customer Information -->
    <div class="col-md-4 mb-4">
        <!-- Customer Information -->
        <div class="content-card mb-4">
            <h3 class="h5 mb-3">Customer Information</h3>

            <div class="mb-2">
                <strong>Name:</strong>
                <div class="text-muted">{{ $order->customer_name }}</div>
            </div>

            <div class="mb-2">
                <strong>Email:</strong>
                <div class="text-muted">{{ $order->customer_email }}</div>
            </div>

            @if($order->customer_phone)
            <div class="mb-0">
                <strong>Phone:</strong>
                <div class="text-muted">{{ $order->customer_phone }}</div>
            </div>
            @endif
        </div>

        <!-- Billing Address -->
        @if($order->billing_address_line_1)
        <div class="content-card mb-4">
            <h3 class="h5 mb-3">Billing Address</h3>

            <address class="mb-0">
                {{ $order->billing_address_line_1 }}<br>
                @if($order->billing_address_line_2)
                    {{ $order->billing_address_line_2 }}<br>
                @endif
                {{ $order->billing_city }}, {{ $order->billing_state }} {{ $order->billing_postal_code }}<br>
                {{ $order->billing_country }}
            </address>
        </div>
        @endif

        <!-- Shipping Address -->
        @if($order->shipping_address_line_1)
        <div class="content-card">
            <h3 class="h5 mb-3">Shipping Address</h3>

            <address class="mb-0">
                {{ $order->shipping_address_line_1 }}<br>
                @if($order->shipping_address_line_2)
                    {{ $order->shipping_address_line_2 }}<br>
                @endif
                {{ $order->shipping_city }}, {{ $order->shipping_state }} {{ $order->shipping_postal_code }}<br>
                {{ $order->shipping_country }}
            </address>

            @if($order->shipped_at)
            <hr>
            <div class="mb-2">
                <strong>Shipped:</strong>
                <div class="text-muted">{{ $order->shipped_at->format('M d, Y') }}</div>
            </div>
            @endif

            @if($order->delivered_at)
            <div class="mb-0">
                <strong>Delivered:</strong>
                <div class="text-muted">{{ $order->delivered_at->format('M d, Y') }}</div>
            </div>
            @endif
        </div>
        @endif

        @if($order->notes)
        <div class="content-card mt-4">
            <h3 class="h5 mb-3">Order Notes</h3>
            <p class="text-muted mb-0">{{ $order->notes }}</p>
        </div>
        @endif
    </div>
</div>
@endsection