{% load static %}
{% load custom_tags_and_filters %}
{% load billing_tags %}
<div>
    <br>
    {% for cap_discount in cap_discounts %}
        {% with cap_highest_amount=cap_discount.capdiscounttier_set.last.amount %}
            {% widthratio .75 1 cap_highest_amount as warn_limit %}
            <div style="padding: 15px 30px"
                 class="alert {% if cap_discount.latest_amount.end >= cap_highest_amount %}alert-success{% elif cap_discount.latest_amount.end|to_int >= warn_limit|to_int %}alert-warning{% else %}alert-danger{% endif %} alert-link">
                <span style="font-weight:bold">{{ cap_discount }}</span>
                <br>
                <div>
                    <u>Amount:</u> <span style="font-weight: bold"><span class="{% if cap_discount.latest_amount.end >= cap_highest_amount %}success-highlight{% elif cap_discount.latest_amount.end|to_int >= warn_limit|to_int %}warning-highlight{% else %}danger-highlight{% endif %}">{{ cap_discount.latest_amount.end|default:0 }}</span>/{{ cap_highest_amount }}</span>
                    <br>
                    <u>Last updated:</u> {{ cap_discount.latest_amount.amount_date|date:"F Y" }}
                    <br>
                    <u>Current estimated amount</u> <span style="font-weight: bold"><span class="{% if cap_discount.latest_amount.end|add:cap_discount.estimated_charges_since_last_update >= cap_highest_amount %}success-highlight{% elif cap_discount.latest_amount.end|add:cap_discount.estimated_charges_since_last_update|to_int >= warn_limit|to_int %}warning-highlight{% else %}danger-highlight{% endif %}">{{ cap_discount.latest_amount.end|default:0|add:cap_discount.estimated_charges_since_last_update }}</span>/{{ cap_highest_amount }}</span>
                    <br>
                    <u>Started:</u> {{ cap_discount.last_reset.date|date:"F Y" }}
                    <br>
                    <u>Next reset:</u> {{ cap_discount.next_reset.date|date:"F Y" }}
                    <br>
                </div>
            </div>
        {% endwith %}
    {% endfor %}
</div>
