@php $c = $document->company; @endphp
<div class="flex items-start justify-between border-b pb-4 mb-4" style="border-color: {{ $c->letterhead_color ?? '#0f172a' }}">
    <div>
        @if($c->logo_path)<img src="{{ public_path('storage/'.$c->logo_path) }}" style="height:60px" alt="">@endif
        <div class="text-lg font-semibold mt-2" style="color: {{ $c->letterhead_color ?? '#0f172a' }}">{{ $c->name }}</div>
        <div class="text-xs text-slate-600 whitespace-pre-line">{{ $c->address }}</div>
        <div class="text-xs text-slate-600">{{ $c->phone }} · {{ $c->email }} · {{ $c->website }}</div>
        @if($c->tax_number)<div class="text-xs text-slate-600">Tax No: {{ $c->tax_number }}</div>@endif
    </div>
    <div class="text-right">
        <div class="text-2xl font-bold uppercase">{{ \App\Models\Document::typeLabel($document->type) }}</div>
        <div class="text-sm">No: <b>{{ $document->number }}</b></div>
        <div class="text-sm">Date: {{ $document->issue_date?->format('Y-m-d') }}</div>
        @if($document->due_date)<div class="text-sm">Due: {{ $document->due_date->format('Y-m-d') }}</div>@endif
    </div>
</div>

<div class="mb-4">
    <div class="text-xs uppercase text-slate-500">Bill To</div>
    <div class="font-medium">{{ $document->customer->name }}</div>
    @if($document->customer->company_name)<div>{{ $document->customer->company_name }}</div>@endif
    <div class="text-sm whitespace-pre-line">{{ $document->customer->address }}</div>
    <div class="text-sm">{{ $document->customer->phone }} · {{ $document->customer->email }}</div>
</div>

<table class="w-full text-sm border-collapse">
    <thead>
        <tr style="background: #f1f5f9">
            <th class="p-2 text-left">#</th><th class="p-2 text-left">Product</th>
            <th class="p-2 text-right">Qty</th><th class="p-2 text-left">Unit</th>
            <th class="p-2 text-right">Price</th><th class="p-2 text-right">Total</th>
        </tr>
    </thead>
    <tbody>
    @foreach($document->items as $i => $it)
        <tr class="border-t align-top">
            <td class="p-2">{{ $i+1 }}</td>
            <td class="p-2">
                <div class="font-mono text-xs text-slate-500">{{ $it->product_code }}</div>
                <div class="font-medium">{{ $it->product_name }}</div>
                @if($it->description)<div class="text-xs text-slate-600">{{ $it->description }}</div>@endif
                @if($it->quantity_mode!=='pcs')
                    <div class="text-xs text-slate-500">
                        @if($it->quantity_mode==='area')   {{ $it->length }} × {{ $it->width }} × {{ (int)$it->pieces }} pcs @endif
                        @if($it->quantity_mode==='linear') {{ $it->length }} m × {{ (int)$it->pieces }} pcs @endif
                        @if($it->quantity_mode==='volume') {{ $it->length }} × {{ $it->width }} × {{ $it->height }} × {{ (int)$it->pieces }} pcs @endif
                    </div>
                @endif
            </td>
            <td class="p-2 text-right tabular-nums">{{ rtrim(rtrim(number_format($it->quantity,3,'.',''),'0'),'.') }}</td>
            <td class="p-2">{{ $it->unit_type }}</td>
            <td class="p-2 text-right tabular-nums">{{ number_format($it->unit_price, 2) }}</td>
            <td class="p-2 text-right tabular-nums">{{ number_format($it->line_total, 2) }}</td>
        </tr>
    @endforeach
    </tbody>
</table>

<div class="flex justify-end mt-4">
    <table class="text-sm">
        <tr><td class="pr-6">Subtotal</td><td class="text-right tabular-nums">{{ $document->currency }} {{ number_format($document->subtotal, 2) }}</td></tr>
        @if($document->discount_amount > 0)
            <tr><td class="pr-6">Discount @if($document->discount_type==='percent')({{ rtrim(rtrim(number_format($document->discount_value,2),'0'),'.') }}%)@endif</td>
                <td class="text-right tabular-nums">-{{ number_format($document->discount_amount, 2) }}</td></tr>
        @endif
        @if($document->tax_amount > 0)
            <tr><td class="pr-6">Tax ({{ rtrim(rtrim(number_format($document->tax_rate,2),'0'),'.') }}%)</td>
                <td class="text-right tabular-nums">{{ number_format($document->tax_amount, 2) }}</td></tr>
        @endif
        <tr class="border-t font-semibold text-base"><td class="pr-6 pt-2">Total</td><td class="text-right tabular-nums pt-2">{{ $document->currency }} {{ number_format($document->total, 2) }}</td></tr>
    </table>
</div>

@if($document->payment_terms)
    <div class="mt-6 text-sm"><b>Payment terms:</b> {{ $document->payment_terms }}</div>
@endif
@if($document->notes)
    <div class="mt-2 text-sm whitespace-pre-line"><b>Notes:</b> {{ $document->notes }}</div>
@endif
@if($c->footer_text)
    <div class="mt-8 pt-3 border-t text-center text-xs text-slate-500">{{ $c->footer_text }}</div>
@endif