@extends('layouts.app')

@section('content')
<section class="py-16 md:py-24 bg-[#1a1614]">
    <div class="max-w-[1400px] mx-auto px-4 sm:px-6 lg:px-8">
        <div class="flex flex-col md:flex-row md:items-center justify-between gap-4 mb-10">
            <div>
                <h1 class="text-3xl font-light text-white">{{ __('my_account') }}</h1>
                <p class="text-white/50 mt-1">{{ $customer->name }} · {{ $customer->email }}</p>
            </div>
            <form method="POST" action="{{ localized_route('customer.logout') }}">
                @csrf
                <button type="submit" class="text-sm text-white/60 hover:text-white transition">{{ __('logout') }}</button>
            </form>
        </div>

        <div class="bg-[#231e1b] rounded-xl p-6 mb-8">
            <h2 class="text-xl font-light text-white mb-6">{{ __('orders') }}</h2>
            @if($orders->isEmpty())
                <p class="text-white/50">{{ __('no_orders') }}</p>
            @else
                <div class="overflow-x-auto">
                    <table class="w-full text-left">
                        <thead>
                            <tr class="text-xs text-white/40 uppercase tracking-wider border-b border-white/10">
                                <th class="pb-3">{{ __('order_number') }}</th>
                                <th class="pb-3">{{ __('date') }}</th>
                                <th class="pb-3">{{ __('status') }}</th>
                                <th class="pb-3">{{ __('total') }}</th>
                                <th class="pb-3"></th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($orders as $order)
                                <tr class="border-b border-white/5 last:border-0">
                                    <td class="py-4 text-white font-medium">{{ $order->order_number }}</td>
                                    <td class="py-4 text-white/60">{{ $order->created_at->format('d.m.Y') }}</td>
                                    <td class="py-4"><span class="admin-status-{{ $order->status }}">{{ $order->status }}</span></td>
                                    <td class="py-4 text-white">{{ number_format($order->total, 2, ',', ' ') }} AZN</td>
                                    <td class="py-4 text-right">
                                        <a href="{{ localized_route('customer.order', $order->order_number) }}" class="text-sm text-[#c77d4a] hover:text-white transition">{{ __('details') }}</a>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
                <div class="mt-6">{{ $orders->links() }}</div>
            @endif
        </div>
    </div>
</section>
@endsection