{% extends "notifications/email/_base.html" %}

{% block content %}
              <!-- Alert banner -->
              <table role="presentation" cellpadding="0" cellspacing="0" border="0" width="100%" style="margin-bottom: 20px;">
                <tr>
                  <td style="background-color: #FFF3CD; border-radius: 8px; padding: 12px 16px; border-left: 4px solid #F59E0B;">
                    <p style="margin: 0; font-family: Helvetica, Arial, sans-serif; font-size: 13px; font-weight: 600; color: #92400E;">
                      &#9888; Security alert
                    </p>
                  </td>
                </tr>
              </table>
              <h1 style="margin: 0 0 16px 0; font-family: Helvetica, Arial, sans-serif; font-size: 20px; font-weight: 600; line-height: 26px; color: {{ brand_text|default:"#1C1D20" }};">
                {{ heading }}
              </h1>
              <p style="margin: 0 0 24px 0; font-family: Helvetica, Arial, sans-serif; font-size: 15px; font-weight: 400; line-height: 22px; color: {{ brand_text|default:"#1C1D20" }}; white-space: pre-line;">
                {{ body }}
              </p>
              <table role="presentation" cellpadding="0" cellspacing="0" border="0" class="button-td" style="padding: 8px 0 0 0;">
                <tr>
                  <td align="left">
                    <table role="presentation" cellpadding="0" cellspacing="0" border="0">
                      <tr>
                        <td style="background-color: #DC2626; border-radius: 20px;">
                          <a href="{{ revoke_url }}" style="display: inline-block; padding: 12px 32px; font-family: Helvetica, Arial, sans-serif; font-size: 18px; font-weight: 400; line-height: 24px; color: #FFFFFF; text-decoration: none; border-radius: 20px;">
                            {{ cta }}
                          </a>
                        </td>
                      </tr>
                    </table>
                  </td>
                </tr>
              </table>
              {% if warning %}
              <p style="margin: 20px 0 0 0; font-family: Helvetica, Arial, sans-serif; font-size: 14px; font-weight: 400; line-height: 20px; color: #7D7E81;">
                {{ warning }}
              </p>
              {% endif %}
{% endblock %}