{% extends 'base.html' %}
{% load static %}

{% block title %}Delete Repayment{% endblock %}

{% block content %}
<div class="container-fluid">
    <div class="row">
        <div class="col-12">
            <div class="card">
                <div class="card-header bg-danger text-white">
                    <h3 class="card-title">
                        <span>🗑️</span>
                        Delete Repayment - {{ repayment.receipt_number }}
                    </h3>
                </div>
                
                <div class="card-body">
                    <div class="alert alert-warning">
                        <span>⚠️</span>
                        <strong>Warning:</strong> This action cannot be undone. Deleting this repayment will:
                        <ul class="mb-0 mt-2">
                            <li>Remove the repayment record permanently</li>
                            <li>Delete the associated receipt</li>
                            <li>Recalculate the loan's outstanding balance</li>
                            <li>Update the loan status if necessary</li>
                        </ul>
                    </div>
                    
                    <div class="row">
                        <div class="col-md-8">
                            <h5>Repayment Details</h5>
                            <table class="table table-bordered">
                                <tr>
                                    <th>Receipt Number</th>
                                    <td>{{ repayment.receipt_number }}</td>
                                </tr>
                                <tr>
                                    <th>Amount</th>
                                    <td>KES {{ repayment.amount|floatformat:2 }}</td>
                                </tr>
                                <tr>
                                    <th>Payment Method</th>
                                    <td>{{ repayment.get_payment_method_display }}</td>
                                </tr>
                                <tr>
                                    <th>Payment Date</th>
                                    <td>{{ repayment.payment_date|date:"M d, Y H:i" }}</td>
                                </tr>
                                {% if repayment.mpesa_transaction_id %}
                                <tr>
                                    <th>M-Pesa Transaction ID</th>
                                    <td>{{ repayment.mpesa_transaction_id }}</td>
                                </tr>
                                {% endif %}
                            </table>
                            
                            <h5>Loan Information</h5>
                            <table class="table table-bordered">
                                <tr>
                                    <th>Loan Number</th>
                                    <td>{{ repayment.loan.loan_number }}</td>
                                </tr>
                                <tr>
                                    <th>Borrower</th>
                                    <td>{{ repayment.loan.borrower.get_full_name }}</td>
                                </tr>
                                <tr>
                                    <th>Current Outstanding</th>
                                    <td>KES {{ repayment.loan.outstanding_balance|floatformat:2 }}</td>
                                </tr>
                                <tr>
                                    <th>After Deletion</th>
                                    <td class="text-danger">KES {{ repayment.loan.outstanding_balance|add:repayment.amount|floatformat:2 }}</td>
                                </tr>
                            </table>
                        </div>
                        
                        <div class="col-md-4">
                            <div class="card bg-light">
                                <div class="card-header">
                                    <h5 class="card-title mb-0">Confirmation</h5>
                                </div>
                                <div class="card-body">
                                    <form method="post">
                                        {% csrf_token %}
                                        <p class="text-muted">Are you sure you want to delete this repayment?</p>
                                        
                                        <div class="form-group">
                                            <button type="submit" class="btn btn-danger btn-block">
                                                <span>🗑️</span>Yes, Delete Repayment
                                            </button>
                                        </div>
                                        
                                        <div class="form-group">
                                            <a href="{% url 'loans:loan_detail' repayment.loan.pk %}" class="btn btn-secondary btn-block">
                                                <span>←</span>Cancel
                                            </a>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
{% endblock %}