@extends('layouts.admin')
@section('title', 'Draft '.$draftOrder->number)
@section('content')
@php
  $label = fn (string $v) => ucwords(str_replace('_', ' ', $v));
  $statusTone = match ($draftOrder->status) {
      'open' => 'info',
      'invoice_sent' => 'warning',
      'paid', 'converted' => 'success',
      default => 'muted',
  };
  $lines = collect($draftOrder->lines ?? []);
@endphp

<x-admin.page
    title="{{ $draftOrder->number }}"
    subtitle="{{ $draftOrder->company_name ?: $draftOrder->email }} · {{ $draftOrder->labeledTotal() }} · {{ $label($draftOrder->status) }}"
>
    <x-slot:actions>
        <a href="{{ route('admin.draft-orders.index') }}" class="admin-btn">
            <i data-lucide="arrow-left" class="h-3.5 w-3.5"></i>
            Back
        </a>
        @if($draftOrder->isOpen())
            <form method="post" action="{{ route('admin.draft-orders.invoice', $draftOrder) }}">
                @csrf
                <button class="admin-btn">
                    <i data-lucide="mail" class="h-3.5 w-3.5"></i>
                    Send invoice
                </button>
            </form>
            @if($draftOrder->status !== 'paid')
                <form method="post" action="{{ route('admin.draft-orders.paid', $draftOrder) }}">
                    @csrf
                    <button class="admin-btn">Mark paid</button>
                </form>
            @endif
            <form method="post" action="{{ route('admin.draft-orders.convert', $draftOrder) }}" onsubmit="return confirm('Convert this draft to a live order?');">
                @csrf
                <button class="admin-btn admin-btn-primary">
                    <i data-lucide="shopping-bag" class="h-3.5 w-3.5"></i>
                    Convert to order
                </button>
            </form>
        @elseif($draftOrder->order_id)
            <a href="{{ route('admin.orders.show', $draftOrder->order_id) }}" class="admin-btn admin-btn-primary">View order</a>
        @endif
    </x-slot:actions>

    <div class="grid gap-4 lg:grid-cols-[minmax(0,1.35fr)_minmax(18rem,.85fr)]">
        <div class="grid gap-4">
            <x-admin.card>
                <div class="mb-4 flex flex-wrap items-center justify-between gap-3">
                    <h2 class="text-base font-semibold">Line items</h2>
                    <x-admin.badge :tone="$statusTone">{{ $label($draftOrder->status) }}</x-admin.badge>
                </div>
                <table class="admin-table">
                    <thead>
                        <tr>
                            <th>Item</th>
                            <th>SKU</th>
                            <th>Qty</th>
                            <th>Unit</th>
                            <th class="text-right">Total</th>
                        </tr>
                    </thead>
                    <tbody>
                        @forelse($lines as $line)
                            <tr>
                                <td class="font-medium">{{ $line['title'] ?? '—' }}</td>
                                <td class="text-xs text-[#8c9196]">{{ $line['sku'] ?? '—' }}</td>
                                <td>{{ $line['quantity'] ?? 1 }}</td>
                                <td>{{ $draftOrder->currency }} {{ number_format(($line['unit_price_cents'] ?? 0) / 100, 2) }}</td>
                                <td class="text-right font-semibold">
                                    {{ $draftOrder->currency }} {{ number_format(($line['total_cents'] ?? (($line['unit_price_cents'] ?? 0) * ($line['quantity'] ?? 1))) / 100, 2) }}
                                </td>
                            </tr>
                        @empty
                            <tr><td colspan="5" class="p-6 text-center text-[#8c9196]">No lines.</td></tr>
                        @endforelse
                    </tbody>
                </table>
                <dl class="mt-4 grid gap-2 border-t border-[var(--color-admin-border)] pt-4 text-sm">
                    <div class="flex justify-between"><dt class="text-[#8c9196]">Subtotal</dt><dd>{{ $draftOrder->currency }} {{ number_format(($draftOrder->subtotal_cents ?: $draftOrder->total_cents) / 100, 2) }}</dd></div>
                    @if($draftOrder->discount_cents)
                        <div class="flex justify-between text-[var(--color-success)]"><dt>Discount</dt><dd>−{{ number_format($draftOrder->discount_cents / 100, 2) }}</dd></div>
                    @endif
                    @if($draftOrder->shipping_cents)
                        <div class="flex justify-between"><dt class="text-[#8c9196]">Shipping</dt><dd>{{ number_format($draftOrder->shipping_cents / 100, 2) }}</dd></div>
                    @endif
                    @if($draftOrder->tax_cents)
                        <div class="flex justify-between"><dt class="text-[#8c9196]">Tax</dt><dd>{{ number_format($draftOrder->tax_cents / 100, 2) }}</dd></div>
                    @endif
                    <div class="flex justify-between text-base font-semibold"><dt>Total</dt><dd>{{ $draftOrder->labeledTotal() }}</dd></div>
                </dl>
            </x-admin.card>

            @if($draftOrder->shipping_address || $draftOrder->customer_note || $draftOrder->staff_note)
                <x-admin.card>
                    <h2 class="mb-3 text-base font-semibold">Notes & address</h2>
                    <div class="grid gap-4 text-sm md:grid-cols-2">
                        <div>
                            <div class="text-xs font-semibold uppercase tracking-wide text-[#8c9196]">Shipping</div>
                            @if($draftOrder->shipping_address)
                                <p class="mt-1 leading-relaxed">
                                    {{ $draftOrder->shipping_address['name'] ?? '' }}<br>
                                    {{ $draftOrder->shipping_address['line1'] ?? '' }}<br>
                                    {{ collect([$draftOrder->shipping_address['city'] ?? null, $draftOrder->shipping_address['region'] ?? null, $draftOrder->shipping_address['postal_code'] ?? null])->filter()->implode(' ') }}<br>
                                    {{ $draftOrder->shipping_address['country'] ?? $draftOrder->country }}
                                </p>
                            @else
                                <p class="mt-1 text-[#8c9196]">Not captured</p>
                            @endif
                        </div>
                        <div class="grid gap-3">
                            @if($draftOrder->customer_note)
                                <div>
                                    <div class="text-xs font-semibold uppercase tracking-wide text-[#8c9196]">Customer note</div>
                                    <p class="mt-1">{{ $draftOrder->customer_note }}</p>
                                </div>
                            @endif
                            @if($draftOrder->staff_note)
                                <div>
                                    <div class="text-xs font-semibold uppercase tracking-wide text-[#8c9196]">Staff note</div>
                                    <p class="mt-1 whitespace-pre-line">{{ $draftOrder->staff_note }}</p>
                                </div>
                            @endif
                        </div>
                    </div>
                </x-admin.card>
            @endif
        </div>

        <div class="grid gap-4 content-start">
            <x-admin.card>
                <h2 class="mb-3 text-base font-semibold">Customer</h2>
                <dl class="grid gap-3 text-sm">
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Email</dt><dd class="mt-0.5 font-medium">{{ $draftOrder->email ?: '—' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Company</dt><dd class="mt-0.5">{{ $draftOrder->company_name ?: '—' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Phone</dt><dd class="mt-0.5">{{ $draftOrder->phone ?: '—' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Country</dt><dd class="mt-0.5">{{ $draftOrder->country ?: '—' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">PO number</dt><dd class="mt-0.5">{{ $draftOrder->po_number ?: '—' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Payment terms</dt><dd class="mt-0.5">{{ $label($draftOrder->payment_terms ?: 'due_on_receipt') }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Source</dt><dd class="mt-0.5">{{ $label($draftOrder->source ?: 'admin') }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Created by</dt><dd class="mt-0.5">{{ $draftOrder->creator?->name ?: 'System' }}</dd></div>
                    <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Reservation</dt>
                        <dd class="mt-0.5">
                            {{ $draftOrder->reservation_expires_at?->format('M j, Y g:ia') ?: '—' }}
                        </dd>
                    </div>
                    @if($draftOrder->invoice_sent_at)
                        <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Invoice sent</dt>
                            <dd class="mt-0.5">{{ $draftOrder->invoice_sent_at->diffForHumans() }} · {{ $draftOrder->invoice_emails_sent }}×</dd>
                        </div>
                    @endif
                    @if($draftOrder->invoice_token)
                        <div><dt class="text-xs uppercase tracking-wide text-[#8c9196]">Invoice token</dt>
                            <dd class="mt-0.5 break-all font-mono text-xs">{{ $draftOrder->invoice_token }}</dd>
                        </div>
                    @endif
                </dl>
            </x-admin.card>

            @if($draftOrder->isOpen())
                <x-admin.card>
                    <h2 class="mb-3 text-base font-semibold">Danger zone</h2>
                    <form method="post" action="{{ route('admin.draft-orders.cancel', $draftOrder) }}" class="grid gap-2" onsubmit="return confirm('Cancel this draft?');">
                        @csrf
                        <input type="text" name="reason" class="admin-input" placeholder="Cancel reason (optional)">
                        <button class="admin-btn w-full justify-center">Cancel draft</button>
                    </form>
                </x-admin.card>
            @endif
        </div>
    </div>
</x-admin.page>
@endsection