{% load i18n %}

<div class="modal fade" id="deleteModal" tabindex="-1" role="dialog" aria-labelledby="deleteModalTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title fs-5" id="deleteModalLongTitle">
                    {% translate "Are you sure?" %}
                </div>

                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% translate 'Close' %}"></button>
            </div>

            <div class="modal-body">
                <p>
                    {% translate "Are you sure you wish to delete this fit?" %}
                    <br>
                    <i><strong>{% translate "This action is permanent." %}</strong></i>
                </p>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                    {% translate "No - Close" %}
                </button>

                <a href="{% url 'fittings:delete_fit' fit.pk %}" type="button" class="btn btn-danger">
                    {% translate "Yes - Delete" %}
                </a>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="eftModal" tabindex="-1" role="dialog" aria-labelledby="eftModalTitle" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <div class="modal-title fs-5" id="eftModalLongTitle">
                    {{ fit.name }}
                </div>

                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% translate 'Close' %}"></button>
            </div>

            <div class="modal-body">
                <label for="eft-fitting" style="margin-bottom: 1rem;">
                    {% translate "EFT Formatted Fitting" %}
                </label>

                <textarea id="eft-fitting" style="width: 100%; height: 100%;" rows="25" onclick="this.select()" readonly>{{ fit.eft }}</textarea>
            </div>

            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                    {% translate "Close" %}
                </button>
            </div>
        </div>
    </div>
</div>