@php
  $editing = isset($invoice) && $invoice;
  $action = $editing ? route('invoices.update', $invoice) : route('invoices.store');
  $method = $editing ? 'PUT' : 'POST';
  if ($editing && $invoice->items->isNotEmpty()) {
      $rows = $invoice->items;
  } else {
      $rows = collect([(object) ['description' => '', 'quantity' => 1, 'unit_rate' => '', 'total' => 0]]);
  }
@endphp
<form id="inv-invoice-{{ $editing ? 'edit-'.$invoice->id : 'create' }}" data-action="{{ $action }}" data-method="{{ $method }}" class="inv-invoice-form">
  @csrf
  <div style="margin-bottom:12px">
    <label class="fl" for="inv_client_id">Client</label>
    <select id="inv_client_id" name="client_id" class="fi" required>
      <option value="">Select client</option>
      @foreach($clients as $c)
        <option value="{{ $c->id }}" @selected($editing && (int)$invoice->client_id === (int)$c->id)>{{ $c->company_name }}</option>
      @endforeach
    </select>
  </div>
  <div style="margin-bottom:12px">
    <label class="fl" for="inv_project_id">Project</label>
    <select id="inv_project_id" name="project_id" class="fi" required>
      <option value="">Select project</option>
      @foreach($projects as $p)
        <option value="{{ $p->id }}" data-client-id="{{ $p->client_id }}" @selected($editing && (int)$invoice->project_id === (int)$p->id)>{{ $p->name }}</option>
      @endforeach
    </select>
  </div>
  <div style="margin-bottom:12px">
    <label class="fl" for="inv_invoice_date">Invoice date</label>
    <input id="inv_invoice_date" name="invoice_date" type="date" class="fi" required value="{{ $editing ? $invoice->invoice_date->format('Y-m-d') : now()->format('Y-m-d') }}">
  </div>
  <div style="margin-bottom:12px">
    <label class="fl" for="inv_due_date">Due date</label>
    <input id="inv_due_date" name="due_date" type="date" class="fi" required value="{{ $editing ? $invoice->due_date->format('Y-m-d') : now()->addDays(30)->format('Y-m-d') }}">
  </div>
  <div style="margin-bottom:12px">
    <label class="fl" for="inv_description">Description</label>
    <textarea id="inv_description" name="description" class="fi" rows="2" maxlength="2000" placeholder="Optional">{{ $editing ? $invoice->description : '' }}</textarea>
  </div>

  <p class="text-[11px] font-bold text-slate-500 uppercase tracking-wider mb-2">Line items</p>
  <div class="inv-lines space-y-2 mb-2">
    @foreach($rows as $idx => $line)
      <div class="inv-line flex flex-wrap gap-2 items-end border border-slate-100 rounded-lg p-2 bg-slate-50/80">
        <div class="flex-1 min-w-[140px]">
          <label class="fl text-[9px]">Description</label>
          <input type="text" name="items[{{ $idx }}][description]" class="fi inv-line-desc" required maxlength="500" value="{{ $editing ? $line->description : '' }}">
        </div>
        <div class="w-[72px]">
          <label class="fl text-[9px]">Qty</label>
          <input type="number" step="0.01" min="0.01" name="items[{{ $idx }}][quantity]" class="fi inv-line-qty" required value="{{ $editing ? $line->quantity : 1 }}">
        </div>
        <div class="w-[100px]">
          <label class="fl text-[9px]">Unit rate</label>
          <input type="number" step="0.01" min="0" name="items[{{ $idx }}][unit_rate]" class="fi inv-line-rate" required value="{{ $editing ? $line->unit_rate : '' }}">
        </div>
        <div class="w-[90px]">
          <label class="fl text-[9px]">Line total</label>
          <input type="text" class="fi inv-line-total bg-slate-100" readonly value="{{ $editing ? number_format((float)$line->total, 2, '.', '') : '0.00' }}">
        </div>
        <button type="button" class="bs inv-remove-line text-[11px] py-1 px-2" style="display:{{ $rows->count() > 1 ? 'inline-block' : 'none' }}">Remove</button>
      </div>
    @endforeach
  </div>
  <button type="button" class="inv-add-line bs text-[11px] py-1 px-2 mb-3">+ Add item</button>

  <div style="margin-bottom:12px">
    <label class="fl" for="inv_vat_amount">VAT amount (MWK)</label>
    <input id="inv_vat_amount" name="vat_amount" type="number" step="0.01" min="0" class="fi" value="{{ $editing ? $invoice->vat_amount : '0' }}">
  </div>
  <div class="rounded-lg border border-slate-200 p-3 mb-3 bg-slate-50">
    <p class="text-[11px] text-slate-500">Preview totals (server recalculates on save)</p>
    <p class="text-[13px] font-bold text-slate-800">Subtotal: <span class="inv-prev-sub">0.00</span> · VAT: <span class="inv-prev-vat">0.00</span> · <span class="text-blue-600">Total: <span class="inv-prev-total">0.00</span></span></p>
  </div>

  <div class="inv-form-err text-red-600 text-[12px] mb-2" style="display:none"></div>
  <div style="display:flex;gap:10px;justify-content:flex-end;margin-top:12px">
    <button type="button" class="bs inv-form-cancel">Cancel</button>
    <button type="submit" class="bp inv-form-submit">{{ $editing ? 'Save changes' : 'Create invoice' }}</button>
  </div>
</form>