{% extends 'base.html' %}
{% block content %}
  <div style="display:flex;justify-content:space-between;align-items:center;">
    <h2>Ledger - {{ farm.name }}</h2>
    <a class="btn-primary" href="{{ url_for('farm_payment', farm_id=farm.id) }}">Record Payment</a>
  </div>
  
  <!-- Live Search -->
  <div class="card" style="margin-top:8px; margin-bottom:8px;">
    <input type="text" id="farm-ledger-search" placeholder="🔍 Search ledger entries by date, description, credit, debit, balance..." 
           style="width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; box-sizing: border-box;">
  </div>
  
  <div class="card" style="margin-top:8px">
    <table class="table" id="farm-ledger-table">
      <thead><tr><th>Date</th><th>Description</th><th>Credit (Payable)</th><th>Debit (Paid)</th><th>Balance</th><th>Actions</th></tr></thead>
      <tbody>
        {% set running_balance = opening_balance or 0 %}
        {% if opening_balance_amount and opening_balance_amount > 0 %}
        <tr style="background-color: #fef3c7;">
          <td>{{ farm.created_at.date() if farm.created_at else 'N/A' }}</td>
          <td><strong>Opening Balance ({{ opening_balance_type|upper }})</strong></td>
          <td style="color: #059669; font-weight: 500;">
            {% if opening_balance_type == 'credit' %}{{ opening_balance_amount|currency }}{% else %}-{% endif %}
          </td>
          <td style="color: #dc2626; font-weight: 500;">
            {% if opening_balance_type == 'debit' %}{{ opening_balance_amount|currency }}{% else %}-{% endif %}
          </td>
          <td style="font-weight: 600; color: #059669;">{{ running_balance|currency }}</td>
          <td><span style="color: #9ca3af; font-size: 12px;">-</span></td>
        </tr>
        {% endif %}
        {% for e in entries %}
          {% set running_balance = running_balance + (e.credit or 0) - (e.debit or 0) %}
          <tr>
            <td>{{ e.date }}</td>
            <td>{{ e.description }}</td>
            <td style="color: #059669;">{{ e.credit|currency }}</td>
            <td style="color: #dc2626;">{{ e.debit|currency }}</td>
            <td style="font-weight: 600; color: #059669;">{{ running_balance|currency }}</td>
            <td>
              {% if e.debit and e.debit > 0 and not e.purchase_id %}
                <div style="display: flex; gap: 4px;">
                  <a href="{{ url_for('edit_farm_ledger_entry', entry_id=e.id) }}" class="btn-outline" style="padding: 4px 8px; font-size: 12px;">✏️ Edit</a>
                  <form method="post" action="{{ url_for('delete_farm_ledger_entry', entry_id=e.id) }}" style="display: inline;" onsubmit="return confirm('Are you sure you want to delete this payment? This will reverse the account balance.');">
                    <button type="submit" class="btn-outline" style="padding: 4px 8px; font-size: 12px; color: #dc2626; border-color: #dc2626;">🗑️ Delete</button>
                  </form>
                </div>
              {% elif e.credit and e.credit > 0 and e.purchase_id %}
                <a href="{{ url_for('edit_farm_ledger_entry', entry_id=e.id) }}" class="btn-outline" style="padding: 4px 8px; font-size: 12px;">✏️ Edit</a>
              {% else %}
                <span style="color: #9ca3af; font-size: 12px;">-</span>
              {% endif %}
            </td>
          </tr>
        {% else %}
          {% if not opening_balance or opening_balance == 0 %}
          <tr><td colspan="6" class="muted">No entries yet.</td></tr>
          {% endif %}
        {% endfor %}
      </tbody>
      <tfoot>
        <tr>
          <th colspan="5">Payable Balance</th>
          <th style="color: #059669;">{{ balance|currency }}</th>
        </tr>
      </tfoot>
    </table>
  </div>
  
  <script>
    document.addEventListener('DOMContentLoaded', function() {
      initLiveSearch('farm-ledger-search', 'farm-ledger-table');
    });
  </script>
{% endblock %}