{% load i18n %}
{% load static %}
{% comment %}
Shared navigation and action loading overlay for Hostile Intel.

Add data-hostile-loading="Title" (and optionally data-hostile-loading-detail="Subtitle")
or data-loading-overlay="Title" to any link, button, or form that triggers a slow server round-trip.
hostile_loading.js displays this overlay on activation and hides it on page restoration.
{% endcomment %}
<link rel="stylesheet" href="{% static 'hostile/css/hostile_loading.css' %}">
<div id="hostilePageLoadingOverlay" class="hostile-page-loading-overlay d-none" aria-hidden="true">
    <div class="hostile-page-loading-dialog" role="status" aria-live="assertive" aria-atomic="true">
        <span class="spinner-border text-warning" aria-hidden="true"></span>
        <div>
            <div class="fw-semibold" data-hostile-loading-title>{% trans "Loading" %}</div>
            <div class="small text-muted" data-hostile-loading-detail>
                {% trans "This can take a few seconds. Please wait..." %}
            </div>
        </div>
    </div>
</div>
<script src="{% static 'hostile/js/hostile_loading.js' %}" defer></script>