@extends('layouts.dashboard')

@section('title', $quote->quote_number)
@section('header_title', $quote->quote_number)

@section('content')
<div class="max-w-4xl mx-auto space-y-6 text-xs">
    <div class="p-6 rounded-2xl bg-navy-900 border border-slate-800 flex flex-col sm:flex-row justify-between gap-4">
        <div>
            <h2 class="text-xl font-black text-white code-font">{{ $quote->quote_number }}</h2>
            <p class="text-slate-400 mt-1">{{ $quote->buyer_name }}</p>
            <p class="text-slate-500">{{ trans('dashboard.valid_until') }}: {{ $quote->valid_until?->toDateString() }}</p>
        </div>
        <div class="flex items-center gap-3">
            @if(! $quote->isConverted())
                <form method="POST" action="{{ route('dashboard.quotes.convert', $quote->uuid) }}">
                    @csrf
                    <button class="px-4 py-2 rounded-xl bg-brand-500 hover:bg-brand-600 text-white font-bold">{{ trans('dashboard.convert_to_invoice') }}</button>
                </form>
            @else
                <a href="{{ route('dashboard.invoices.show', $quote->convertedInvoice->uuid) }}" class="px-4 py-2 rounded-xl bg-slate-800 text-white font-bold">{{ trans('dashboard.view_invoice') }}</a>
            @endif
        </div>
    </div>

    <div class="p-6 rounded-2xl bg-navy-900 border border-slate-800">
        <table class="w-full">
            <thead class="text-slate-400 border-b border-slate-800">
                <tr>
                    <th class="pb-2 text-start">{{ trans('dashboard.line_name') }}</th>
                    <th class="pb-2 text-start">{{ trans('dashboard.line_qty') }}</th>
                    <th class="pb-2 text-start">{{ trans('dashboard.line_price') }}</th>
                </tr>
            </thead>
            <tbody class="text-slate-300">
                @foreach($quote->lines ?? [] as $line)
                    <tr>
                        <td class="py-2">{{ $line['name'] }}</td>
                        <td class="py-2">{{ $line['quantity'] }}</td>
                        <td class="py-2">{{ number_format($line['unit_price'], 2) }}</td>
                    </tr>
                @endforeach
            </tbody>
        </table>
        <div class="mt-4 text-end space-y-1">
            <div>{{ trans('dashboard.th_subtotal') }}: {{ number_format($quote->subtotal, 2) }}</div>
            <div>{{ trans('dashboard.th_vat') }}: {{ number_format($quote->vat_amount, 2) }}</div>
            <div class="font-black text-white inline-flex items-center gap-1.5" dir="ltr">
                <span>{{ trans('dashboard.th_total') }}:</span>
                <x-riyal-symbol class="w-[1.05em] h-[1.05em]" />
                <span>{{ number_format($quote->total, 2) }}</span>
            </div>
        </div>
</div>
@endsection