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

{% block title %}{% trans "Survey Results Available - Al Hammadi Hospital" %}{% endblock %}

{% block preheader %}{% trans "Your department's survey results are now available for review." %}{% endblock %}

{% block hero_title %}{% trans "Survey Results Ready" %}{% endblock %}

{% block hero_subtitle %}{% trans "View the latest patient experience survey results for your department" %}{% endblock %}

{% block content %}
<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
    <tr>
        <td style="padding-bottom: 20px;">
            <p style="margin: 0; font-size: 16px; color: #1e293b; line-height: 1.6;">
                {% trans "Dear" %} <strong>{{ recipient_name|default:_("Team Member") }}</strong>,
            </p>
            <p style="margin: 15px 0 0 0; font-size: 16px; color: #64748b; line-height: 1.6;">
                {% blocktrans with dept=department_name|default:_("your department") %}The patient experience survey results for {{ dept }} are now available for review.{% endblocktrans %}
            </p>
        </td>
    </tr>
</table>

<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin: 25px 0;">
    <tr>
        <td width="33%" style="padding: 15px; background-color: #eef6fb; border-radius: 8px; text-align: center;">
            <p style="margin: 0; font-size: 28px; font-weight: 700; color: #005696;">
                {{ overall_score|default:_("N/A") }}
            </p>
            <p style="margin: 5px 0 0 0; font-size: 13px; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;">
                {% trans "Overall Score" %}
            </p>
        </td>
        
        <td width="33%" style="padding: 15px; background-color: #eef6fb; border-radius: 8px; text-align: center; margin: 0 10px;">
            <p style="margin: 0; font-size: 28px; font-weight: 700; color: #007bbd;">
                {{ total_responses|default:_("N/A") }}
            </p>
            <p style="margin: 5px 0 0 0; font-size: 13px; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;">
                {% trans "Responses" %}
            </p>
        </td>
        
        <td width="33%" style="padding: 15px; background-color: #eef6fb; border-radius: 8px; text-align: center;">
            <p style="margin: 0; font-size: 28px; font-weight: 700; color: #005696;">
                {{ response_rate|default:_("N/A") }}
            </p>
            <p style="margin: 5px 0 0 0; font-size: 13px; color: #64748b; text-transform: uppercase; letter-spacing: 0.5px;">
                {% trans "Response Rate" %}
            </p>
        </td>
    </tr>
</table>

<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
    <tr>
        <td>
            <h3 style="margin: 0 0 15px 0; font-size: 18px; font-weight: 600; color: #005696;">
                {% trans "Key Highlights:" %}
            </h3>
        </td>
    </tr>
    <tr>
        <td>
            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin-bottom: 12px;">
                <tr>
                    <td width="40" valign="top" style="padding-right: 10px;">
                        <span style="display: inline-block; width: 32px; height: 32px; background-color: #eef6fb; border-radius: 50%; text-align: center; line-height: 32px; font-size: 18px;">&#11014;</span>
                    </td>
                    <td>
                        <p style="margin: 0; font-size: 15px; color: #1e293b; line-height: 1.5;">
                            <strong>{% trans "Strengths:" %}</strong> {{ strengths|default:_("Patient care and communication received high ratings") }}
                        </p>
                    </td>
                </tr>
            </table>
            
            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin-bottom: 12px;">
                <tr>
                    <td width="40" valign="top" style="padding-right: 10px;">
                        <span style="display: inline-block; width: 32px; height: 32px; background-color: #eef6fb; border-radius: 50%; text-align: center; line-height: 32px; font-size: 18px;">!</span>
                    </td>
                    <td>
                        <p style="margin: 0; font-size: 15px; color: #1e293b; line-height: 1.5;">
                            <strong>{% trans "Areas for Improvement:" %}</strong> {{ improvements|default:_("Wait times and facility comfort can be enhanced") }}
                        </p>
                    </td>
                </tr>
            </table>
            
            <table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
                <tr>
                    <td width="40" valign="top" style="padding-right: 10px;">
                        <span style="display: inline-block; width: 32px; height: 32px; background-color: #eef6fb; border-radius: 50%; text-align: center; line-height: 32px; font-size: 18px;">📊</span>
                    </td>
                    <td>
                        <p style="margin: 0; font-size: 15px; color: #1e293b; line-height: 1.5;">
                            <strong>{% trans "Survey Period:" %}</strong> {{ survey_period|default:_("Last 30 days") }}
                        </p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%" style="margin-top: 25px;">
    <tr>
        <td style="padding: 20px; background-color: #eef6fb; border-radius: 8px; border-left: 4px solid #005696;">
            <p style="margin: 0 0 10px 0; font-size: 14px; font-weight: 600; color: #005696;">
                ⚠️ {% trans "Action Required:" %}
            </p>
            <p style="margin: 0; font-size: 14px; color: #1e293b; line-height: 1.6;">
                {% blocktrans with deadline=deadline|default:_("end of month") %}Please review the detailed results and prepare an action plan to address identified areas for improvement by {{ deadline }}.{% endblocktrans %}
            </p>
        </td>
    </tr>
</table>
{% endblock %}

{% block cta_url %}{{ results_link|default:'#' }}{% endblock %}
{% block cta_text %}{% trans "View Full Report" %}{% endblock %}

{% block info_title %}{% trans "Report Details" %}{% endblock %}
{% block info_content %}
<strong>{% trans "Report Generated:" %}</strong> {{ report_date|default:_("Today") }}<br>
<strong>{% trans "Survey Type:" %}</strong> {{ survey_type|default:_("Patient Experience Survey") }}<br>
<strong>{% trans "Access Level:" %}</strong> {{ access_level|default:_("Department Manager") }}
{% endblock %}

{% block footer_address %}
{% trans "Patient Experience Management Department" %}<br>
{% trans "Al Hammadi Hospital" %}
{% endblock %}