{% extends 'base.html' %}
{% block content %}
  <div style="display:flex;justify-content:space-between;align-items:center;">
    <h2>Edit Entry - {{ farm.name }}</h2>
    <a class="btn-outline" href="{{ url_for('farm_ledger', farm_id=farm.id) }}">Back to Ledger</a>
  </div>
  
  <div class="card" style="margin-top:8px">
    <form method="POST">
      {{ form.hidden_tag() }}
      
      <div class="form-group">
        {{ form.date.label(class="form-label") }}
        {{ form.date(class="form-control") }}
        {% if form.date.errors %}
          <div class="error">{{ form.date.errors[0] }}</div>
        {% endif %}
      </div>
      
      <div class="form-group">
        {{ form.description.label(class="form-label") }}
        {{ form.description(class="form-control") }}
        {% if form.description.errors %}
          <div class="error">{{ form.description.errors[0] }}</div>
        {% endif %}
      </div>
      
      <div style="display: grid; grid-template-columns: 1fr 1fr; gap: 16px;">
        <div class="form-group">
          {{ form.credit.label(class="form-label") }}
          {{ form.credit(class="form-control", placeholder="0.00") }}
          {% if form.credit.errors %}
            <div class="error">{{ form.credit.errors[0] }}</div>
          {% endif %}
          <small class="form-text" style="color: #059669;">Amount we owe to farm (purchase)</small>
        </div>
        
        <div class="form-group">
          {{ form.debit.label(class="form-label") }}
          {{ form.debit(class="form-control", placeholder="0.00") }}
          {% if form.debit.errors %}
            <div class="error">{{ form.debit.errors[0] }}</div>
          {% endif %}
          <small class="form-text" style="color: #dc2626;">Payment made to farm</small>
        </div>
      </div>
      
      <div class="form-group" id="account-field" style="{% if not entry.debit or entry.debit == 0 %}display: none;{% endif %}">
        {{ form.account_id.label(class="form-label") }}
        {{ form.account_id(class="form-control") }}
        {% if form.account_id.errors %}
          <div class="error">{{ form.account_id.errors[0] }}</div>
        {% endif %}
        <small class="form-text">Account from which payment was made (required for payment entries)</small>
      </div>
      
      <script>
        // Show/hide account field based on debit/credit selection
        document.addEventListener('DOMContentLoaded', function() {
          const debitField = document.querySelector('input[name="debit"]');
          const creditField = document.querySelector('input[name="credit"]');
          const accountField = document.getElementById('account-field');
          const accountSelect = accountField ? accountField.querySelector('select') : null;
          
          function toggleAccountField() {
            if (!accountField || !accountSelect) return;
            
            const debitValue = parseFloat(debitField.value) || 0;
            const creditValue = parseFloat(creditField.value) || 0;
            
            if (debitValue > 0 && creditValue == 0) {
              accountField.style.display = 'block';
              accountSelect.setAttribute('required', 'required');
            } else {
              accountField.style.display = 'none';
              accountSelect.removeAttribute('required');
            }
          }
          
          if (debitField) debitField.addEventListener('input', toggleAccountField);
          if (creditField) creditField.addEventListener('input', toggleAccountField);
          
          // Initial check
          toggleAccountField();
        });
      </script>
      
      <div class="form-actions">
        <button type="submit" class="btn-primary">Update Entry</button>
        <a class="btn-outline" href="{{ url_for('farm_ledger', farm_id=farm.id) }}">Cancel</a>
      </div>
    </form>
  </div>
  
  <!-- Current Balance Display -->
  <div class="card" style="margin-top: 16px;">
    <h3>Current Farm Balance</h3>
    <div style="font-size: 1.2em; font-weight: bold; color: {% if current_balance > 0 %}#059669{% else %}#dc2626{% endif %};">
      {{ current_balance|currency }}
    </div>
    <p style="margin: 8px 0 0 0; color: #666;">
      {% if current_balance > 0 %}
        We owe farm {{ current_balance|currency }}
      {% else %}
        Farm owes us {{ (current_balance * -1)|currency }}
      {% endif %}
    </p>
  </div>
  
  {% if account_txn %}
  <div class="card" style="margin-top: 16px; background-color: #f0f9ff;">
    <h3>Linked Account Transaction</h3>
    <p style="margin: 4px 0;"><strong>Account:</strong> {{ account_txn.account.name }}</p>
    <p style="margin: 4px 0;"><strong>Amount:</strong> {{ account_txn.amount|currency }}</p>
    <p style="margin: 4px 0;"><strong>Date:</strong> {{ account_txn.date|date_format }}</p>
    <p style="margin: 4px 0; color: #666; font-size: 0.9em;">This account transaction will be updated when you save changes.</p>
  </div>
  {% endif %}
{% endblock %}