{% extends 'rental_app/base_rental.html' %}
{% block title %}Banking Details{% endblock %}

{% block content %}
<section class="py-5">
    <div class="container">
        <div class="mb-4">
            <span class="section-mini-title">Rental Owner Dashboard</span>
            <h1 class="fw-bold">Banking Details</h1>
            <p class="text-muted mb-0">
                Add or update your bank account details so rental payments can be transferred to you after applicable commission deductions.
            </p>
        </div>

        <div class="row g-4">
            <div class="col-lg-8">
                <div class="border rounded-4 bg-white shadow-sm p-4">
                    <h4 class="fw-bold mb-3">Payout Information</h4>

                    <form method="post">
                        {% csrf_token %}

                        <div class="row g-3">
                            <div class="col-md-6">
                                <label class="form-label">Account Holder Name</label>
                                {{ form.account_holder_name }}
                            </div>
                            <div class="col-md-6">
                                <label class="form-label">Bank Name</label>
                                {{ form.bank_name }}
                            </div>

                            <div class="col-md-6">
                                <label class="form-label">Branch Name</label>
                                {{ form.branch_name }}
                            </div>
                            <div class="col-md-6">
                                <label class="form-label">Account Number</label>
                                {{ form.account_number }}
                            </div>

                            <div class="col-md-6">
                                <label class="form-label">IBAN</label>
                                {{ form.iban }}
                            </div>
                            <div class="col-md-6">
                                <label class="form-label">SWIFT Code</label>
                                {{ form.swift_code }}
                            </div>

                            <div class="col-md-6">
                                <label class="form-label">Bank Country</label>
                                {{ form.bank_country }}
                            </div>
                            <div class="col-md-6">
                                <label class="form-label">Verification Status</label>
                                <div class="form-control bg-light">
                                    {% if banking_details.is_verified %}
                                        Verified
                                    {% else %}
                                        Not verified yet
                                    {% endif %}
                                </div>
                            </div>

                            <div class="col-12">
                                <label class="form-label">Bank Address</label>
                                {{ form.bank_address }}
                            </div>

                            <div class="col-12">
                                <label class="form-label">Payment Notes</label>
                                {{ form.payment_notes }}
                            </div>
                        </div>

                        <div class="mt-4 d-flex gap-2 flex-wrap">
                            <button type="submit" class="btn btn-dark">Save Banking Details</button>
                            <a href="{% url 'rental_app:rental_owner_profile_page' %}" class="btn btn-outline-secondary">
                                Back to Profile Page
                            </a>
                        </div>
                    </form>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="border rounded-4 bg-white shadow-sm p-4">
                    <h5 class="fw-bold mb-3">Important Notes</h5>
                    <ul class="mb-0 ps-3">
                        <li>Payments can be transferred only after required verification steps.</li>
                        <li>Your rental commission may be deducted before payout.</li>
                        <li>Make sure your account number and bank transfer details are correct.</li>
                        <li>You can update these details any time if your bank account changes.</li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>
{% endblock %}