{% extends "email/base.html" %}

{% block title %}Support Ticket Updated | Praxicraft{% endblock %}

{% block body_radius %}border-radius:8px;{% endblock %}

{% block content %}
<p class="text-main" style="margin:0 0 16px;font-size:16px;font-weight:400;line-height:26px;color:#171717;">Hi {{ first_name }},</p>
<p class="text-main" style="margin:0 0 16px;font-size:16px;font-weight:400;line-height:26px;color:#171717;">
  The status of your ticket{% if ticket_subject %} &ldquo;{{ ticket_subject }}&rdquo;{% endif %} changed to
  <strong style="font-weight:700;">{{ new_status }}</strong>.
</p>

<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="margin-bottom:16px;background-color:#FFFFFF;border-radius:8px;">
  <tr>
    <td class="email-surface" style="padding:16px;background-color:#FFFFFF;border-radius:8px;" bgcolor="#FFFFFF">
      <p class="text-main" style="margin:0 0 12px;font-size:16px;font-weight:500;line-height:26px;color:#01071A;word-break:break-word;">{{ ticket_subject }}</p>
      {% if new_status == "Resolved" or new_status == "Closed" %}
      <div class="email-pill" style="display:inline-block;padding:4px 10px;border-radius:36px;background-color:#E8F6ED;">
        <span class="email-pill-text" style="font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:500;line-height:18px;white-space:nowrap;color:#16A34A;">{{ new_status }}</span>
      </div>
      {% elif new_status == "Pending" %}
      <div class="email-pill" style="display:inline-block;padding:4px 10px;border-radius:36px;background-color:#E7ECFF;">
        <span class="email-pill-text" style="font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:500;line-height:18px;white-space:nowrap;color:#0D41FF;">{{ new_status }}</span>
      </div>
      {% else %}
      <div class="email-pill" style="display:inline-block;padding:4px 10px;border-radius:36px;background-color:#E8F6ED;">
        <span class="email-pill-text" style="font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:500;line-height:18px;white-space:nowrap;color:#16A34A;">{{ new_status }}</span>
      </div>
      {% endif %}
    </td>
  </tr>
</table>

{% include "email/partials/_cta.html" with cta_url=dashboard_url cta_label="View Ticket" %}
{% endblock %}