{% extends 'emails/base_email_template.html' %}
{% load i18n %}

{% block title %}{% trans "ESCALATION - Department Response Overdue" %}{% endblock %}
{% block preheader %}{% trans "An inquiry department response is overdue and has been escalated." %}{% endblock %}

{% block content %}
<p style="margin: 0 0 15px;">
    {% trans "Dear" %} <strong>{{ recipient_name|default:'Department Manager' }}</strong>,
</p>

<p style="margin: 0 0 20px; color: #dc2626; font-weight: bold;">
    {% trans "ESCALATION: A department response for an inquiry is overdue and requires your immediate attention." %}
</p>

<p style="margin: 0 0 5px;"><strong>{% trans "Reference:" %}</strong> {{ inquiry.reference_number }}</p>
<p style="margin: 0 0 5px;"><strong>{% trans "Subject:" %}</strong> {{ inquiry.subject }}</p>
<p style="margin: 0 0 5px;"><strong>{% trans "Department:" %}</strong> {{ department_name }}</p>
<p style="margin: 0 0 5px;"><strong>{% trans "Response Deadline:" %}</strong> {{ sla_due_at|date:"F d, Y H:i" }}</p>
<p style="margin: 0 0 20px;"><strong>{% trans "Hours Overdue:" %}</strong> {{ hours_overdue }}</p>

{% if inquiry_url %}
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
    <tr>
        <td align="center">
            <a href="{{ inquiry_url }}"
               style="display: inline-block; padding: 12px 32px; font-size: 16px; font-weight: 600; color: #ffffff; text-decoration: none; border-radius: 6px; background-color: #dc2626;">
                {% trans "View Inquiry" %}
            </a>
        </td>
    </tr>
</table>
{% endif %}

<p style="margin: 25px 0 5px; font-size: 13px; color: #666666; direction: rtl; text-align: right;">
    تصعيد - رد القسم متأخر - {{ inquiry.reference_number }}
</p>
<p style="margin: 0; font-size: 12px; color: #999999; direction: rtl; text-align: right; line-height: 1.8;">
    موعد الاستحقاق: {{ sla_due_at|date:"Y F d H:i" }} - ساعات التأخير: {{ hours_overdue }}
</p>
{% endblock %}