{% extends "base.html" %}

{%  block content %}
    <div class="row">
        <div class="col s10 offset-s1">
            <div class ="card">
                <div class="card-content">
                    <div class="card-title">MRE Generator</div>
                    <form method="post" enctype="multipart/form-data">
                        {{ form.hidden_tag() }}
                        <div class="row">
                            <div class="col">
                                <div class="row">{{ form.occupant_fico.label }}</div>
                                <div class="row">{{ form.occupant_fico }}</div>
                            </div>
                            <div class="col offset-s2">
                                <div class="row">{{ form.occupant_income.label }}</div>
                                <div class="row">{{ form.occupant_income }}</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="row">{{ form.home_price.label }}</div>
                                <div class="row">{{ form.home_price }}</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col">
                                <div class="row">{{ form.default_rates.label }}</div>
                                <div class="row">{{ form.default_rates }}</div>
                            </div>
                            <div class="col">
                                <div class="row">{{ form.risk_pool_makeup.label }}</div>
                                <div class="row">{{ form.risk_pool_makeup }}</div>
                            </div>
                        </div>
                        <div class="row">
                            <div class="card-action right-align">
                                <button type="submit" class="waves-effect waves-light btn">Compute MRE</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
            {% if mre %}
                <div class="card">
                    <div class="card-content">
                        <div class="card-title">Calculated MRE: {{ mre }}</div>
                    </div>
                </div>
            {% endif %}
        </div>
    </div>
{% endblock %}