{% load i18n %}
<div class="page-header mb-4">
    <div class="d-flex flex-wrap align-items-center justify-content-between gap-3">
        <div>
            <h2 class="h3 mb-1">
                {% if icon_class %}<i class="{{ icon_class }} me-2"></i>{% endif %}
                {{ title|default:_("Untitled") }}
            </h2>
            {% if subtitle %}
                <p class="description">{{ subtitle }}</p>
            {% endif %}
        </div>
        <div class="d-flex flex-wrap align-items-center gap-2">
            {% if header_controls %}
                {{ header_controls|safe }}
            {% endif %}
            {% if back_url %}
                <a href="{{ back_url }}" class="btn btn-outline-light">
                    <i class="fas fa-arrow-left me-1"></i>{{ back_label|default:_("Back") }}
                </a>
            {% endif %}
        </div>
    </div>
    {% if icon_class %}
        <i class="{{ icon_class }} header-bg"></i>
    {% endif %}
</div>
