{% extends "base.html" %}
{% block title %}Customer {{ customer.name }}{% endblock %}
{% block content %}
<div class="space-y-4">
  <h1 class="text-2xl font-bold">{{ customer.name }}</h1>
  <p class="opacity-70">{{ customer.phone|default:"" }} {{ customer.email|default:"" }}</p>
  <p>Outstanding Balance: <strong>{{ customer.balance_due }}</strong></p>

  <div class="grid grid-cols-1 lg:grid-cols-2 gap-4">
    <div class="card bg-base-100 border border-base-200">
      <div class="card-body">
        <h2 class="font-semibold">Recent Sales</h2>
        <ul class="text-sm space-y-1">
          {% for sale in sales %}
            <li>{{ sale.date }} - {{ sale.reference }} ({{ sale.total }})</li>
          {% empty %}
            <li class="opacity-70">No sales.</li>
          {% endfor %}
        </ul>
      </div>
    </div>

    <div class="card bg-base-100 border border-base-200">
      <div class="card-body">
        <h2 class="font-semibold">Recent Invoices</h2>
        <ul class="text-sm space-y-1">
          {% for invoice in invoices %}
            <li>{{ invoice.issue_date }} - {{ invoice.reference }} (Due {{ invoice.balance_due }})</li>
          {% empty %}
            <li class="opacity-70">No invoices.</li>
          {% endfor %}
        </ul>
      </div>
    </div>
  </div>

  <div class="card bg-base-100 border border-base-200">
    <div class="card-body">
      <h2 class="font-semibold">Ledger History</h2>
      <div class="overflow-x-auto">
        <table class="table table-sm">
          <thead>
            <tr>
              <th>Date</th>
              <th>Type</th>
              <th>Reference</th>
              <th>Debit</th>
              <th>Credit</th>
              <th>Note</th>
            </tr>
          </thead>
          <tbody>
            {% for entry in ledger_entries %}
            <tr>
              <td>{{ entry.date|date:"Y-m-d" }}</td>
              <td>{{ entry.get_entry_type_display }}</td>
              <td>{{ entry.reference|default:"-" }}</td>
              <td class="{% if entry.debit %}text-error{% endif %}">{{ entry.debit|default:0 }}</td>
              <td class="{% if entry.credit %}text-success{% endif %}">{{ entry.credit|default:0 }}</td>
              <td>{{ entry.note|default:"-" }}</td>
            </tr>
            {% empty %}
            <tr>
              <td colspan="6" class="text-center opacity-70">No ledger entries.</td>
            </tr>
            {% endfor %}
          </tbody>
        </table>
      </div>
    </div>
  </div>
</div>
{% endblock %}