@extends('layouts.app')
@section('title', 'Invoice '.$sale->invoice_number)
@section('actions')
    <a href="{{ route('product-sales.pdf', $sale) }}" class="btn btn-dark"><i class="bi bi-file-pdf"></i> Download PDF</a>
    <a href="{{ route('pos.index') }}" class="btn btn-warning"><i class="bi bi-cart3"></i> New Sale</a>
@endsection

@section('content')
<div class="card p-4 mx-auto" style="max-width:600px;">
    <div class="text-center mb-3">
        <img src="{{ $brandLogo }}" alt="{{ config('app.name') }}" style="max-height:70px;">
        <h5 class="mt-2 mb-0" style="color:#bd8a18;">{{ config('app.name') }}</h5>
        <div class="text-muted small">Sale Receipt</div>
    </div>
    <div class="d-flex justify-content-between small mb-2">
        <div><strong>Invoice:</strong> {{ $sale->invoice_number }}</div>
        <div><strong>Date:</strong> {{ $sale->sale_date->format('d M Y') }}</div>
    </div>
    <div class="table-responsive">
        <table class="table table-sm align-middle">
            <thead><tr><th>Product</th><th class="text-center">Qty</th><th class="text-end">Unit</th><th class="text-end">Total</th></tr></thead>
            <tbody>
            @foreach($sale->items as $item)
                <tr>
                    <td>{{ $item->product->name ?? '—' }}</td>
                    <td class="text-center">{{ $item->quantity }}</td>
                    <td class="text-end">{{ number_format($item->unit_price, 2) }}</td>
                    <td class="text-end">{{ number_format($item->line_total, 2) }}</td>
                </tr>
            @endforeach
            </tbody>
        </table>
    </div>
    <div class="ms-auto" style="max-width:280px;">
        <div class="d-flex justify-content-between"><span>Subtotal</span><span>{{ number_format($sale->subtotal, 2) }}</span></div>
        <div class="d-flex justify-content-between"><span>Discount</span><span>{{ number_format($sale->discount_amount, 2) }}</span></div>
        <div class="d-flex justify-content-between fw-bold border-top pt-1"><span>Grand Total</span><span>{{ number_format($sale->grand_total, 2) }}</span></div>
        <div class="d-flex justify-content-between"><span>Amount Received</span><span>{{ number_format($sale->amount_received, 2) }}</span></div>
        <div class="d-flex justify-content-between"><span>Balance / Change</span><span>{{ number_format($sale->balance(), 2) }}</span></div>
    </div>
    @if($sale->notes)<div class="small text-muted mt-2">Notes: {{ $sale->notes }}</div>@endif
    <div class="text-center text-muted small mt-3">Thank you!</div>
</div>
@endsection