{% extends 'base.html' %}
{% block content %}
  <div style="display:flex;justify-content:space-between;align-items:center;">
    <h2>Edit Transaction - {{ account.name }}</h2>
    <a class="btn-outline" href="{{ url_for('account_view', account_id=account.id) }}">Back to Account</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 class="form-group">
        {{ form.amount.label(class="form-label") }}
        {{ form.amount(class="form-control", placeholder="0.00") }}
        {% if form.amount.errors %}
          <div class="error">{{ form.amount.errors[0] }}</div>
        {% endif %}
        <small class="form-text">Positive for deposits, negative for withdrawals</small>
      </div>
      
      <div class="form-group">
        {{ form.ref_customer_id.label(class="form-label") }}
        {{ form.ref_customer_id(class="form-control") }}
        {% if form.ref_customer_id.errors %}
          <div class="error">{{ form.ref_customer_id.errors[0] }}</div>
        {% endif %}
        <small class="form-text">Optional: Link this transaction to a customer</small>
      </div>
      
      <div class="form-actions">
        <button type="submit" class="btn-primary">Update Transaction</button>
        <a class="btn-outline" href="{{ url_for('account_view', account_id=account.id) }}">Cancel</a>
      </div>
    </form>
  </div>
  
  <!-- Current Balance Display -->
  <div class="card" style="margin-top: 16px;">
    <h3>Current Account Balance</h3>
    <div style="font-size: 1.2em; font-weight: bold; color: {% if current_balance > 0 %}green{% else %}red{% endif %};">
      {{ current_balance|currency }}
    </div>
    <p style="margin: 8px 0 0 0; color: #666; font-weight: bold;">
      {% if current_balance > 0 %}
        Account has {{ current_balance|currency }} available
      {% else %}
        Account is overdrawn by {{ (current_balance * -1)|currency }}
      {% endif %}
    </p>
  </div>
{% endblock %}