{% extends "base.html" %}
{% block title %}Invoice SALE-{{ sale.id }}{% endblock %}
{% block content %}
<div class="page-head no-print">
  <h1>Invoice SALE-{{ sale.id }}</h1>
  <div class="d-flex gap-2">
    <a class="btn btn-outline-secondary" href="{{ url_for('doc_list', kind='sale') }}">All sales</a>
    <button class="btn btn-primary" onclick="window.print()">Print invoice</button>
  </div>
</div>
<div class="panel" style="max-width:820px">
  <div class="d-flex justify-content-between mb-4">
    <div><div class="brand" style="color:#1b2a38;margin:0">TechPro WMS</div>
      <div class="text-secondary">Sold from {{ sale.warehouse }}</div></div>
    <div class="text-end"><div class="fw-semibold">SALE-{{ sale.id }}</div>
      <div class="text-secondary">{{ sale.created_at[:16] }}</div></div>
  </div>
  <p class="mb-3"><span class="text-secondary">Bill to:</span> <strong>{{ sale.customer }}</strong>{% if sale.city %}, {{ sale.city }}{% endif %}{% if sale.phone %} ({{ sale.phone }}){% endif %}</p>
  <table class="table">
    <thead><tr><th>SKU</th><th>Product</th><th class="num">Qty</th><th class="num">Unit price</th><th class="num">Amount</th></tr></thead>
    <tbody>
    {% for i in items %}
      <tr><td>{{ i.sku }}</td><td>{{ i.name }}</td><td class="num">{{ i.qty }} {{ i.unit }}</td>
        <td class="num">{{ i.unit_price|money }}</td><td class="num">{{ (i.qty * i.unit_price)|money }}</td></tr>
    {% endfor %}
    </tbody>
    <tfoot><tr><td colspan="4" class="num fw-semibold">Total ({{ currency }})</td><td class="num fw-bold">{{ sale.total|money }}</td></tr></tfoot>
  </table>
  {% if sale.note %}<p class="mb-1"><span class="text-secondary">Note:</span> {{ sale.note }}</p>{% endif %}
  <p class="text-secondary small mb-0">Served by {{ sale.seller or 'staff' }}</p>
</div>
{% endblock %}