{% extends "email_sender/base_email.html" %}
{% load i18n %}
{% block title %}{{ main_title }}{% endblock %}
{% block preheader %}{% if pre_header %}{{ pre_header }}{% else %}{{ message_1 }}{% endif %}{% endblock %}

{% block header %}
    {# The appointment day as a calendar leaf, next to the title #}
    <table role="presentation" border="0" cellpadding="0" cellspacing="0">
        <tr>
            <td valign="middle" style="padding-right: 18px;">
                <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="72" style="border-collapse: separate;">
                    <tr>
                        <td align="center" style="padding: 5px 4px; background-color: #c53030; border-radius: 8px 8px 0 0; font-size: 11px; font-weight: 700; letter-spacing: 1px; color: #ffffff;">{{ month_year }}</td>
                    </tr>
                    <tr>
                        <td align="center" style="padding: 6px 4px 8px; background-color: #ffffff; border-radius: 0 0 8px 8px; font-size: 30px; font-weight: 700; line-height: 1.1; color: #0c1b33;">{{ day }}</td>
                    </tr>
                </table>
            </td>
            <td valign="middle">
                <h1 style="margin: 0; font-size: 22px; line-height: 1.3; font-weight: 700; color: #ffffff;">{{ main_title }}</h1>
                <p style="margin: 6px 0 0; font-size: 14px; color: #dbe4f3;">{% trans 'Thank you for choosing us.' %}</p>
            </td>
        </tr>
    </table>
{% endblock %}

{% block content %}
    <p style="margin: 0 0 12px;">{% if first_name %}{% blocktrans trimmed %}Hi {{ first_name }},{% endblocktrans %}{% else %}{% trans "Hi" %},{% endif %}</p>
    {% if message_1 %}
        <p style="margin: 0 0 24px;">{{ message_1 }}</p>
    {% endif %}

    {% if more_details %}
        <h2 style="margin: 0 0 10px; font-size: 16px; font-weight: 700; color: #0c1b33;">{% trans "Appointment Details" %}</h2>
        {% include "email_sender/details_table.html" with details=more_details %}
    {% endif %}

    {% if account_details %}
        <h2 style="margin: 0 0 10px; font-size: 16px; font-weight: 700; color: #0c1b33;">{% trans "Account Information" %}</h2>
        {% if message_2 %}
            <p style="margin: 0 0 12px;">{{ message_2 }}</p>
        {% endif %}
        {% include "email_sender/details_table.html" with details=account_details %}
        {% if activation_link %}
            <p style="margin: 0 0 12px;">
                {% blocktranslate trimmed %}
                    To activate your account and set your password, use the link below. For your security, it
                    expires in 2 days.
                {% endblocktranslate %}
            </p>
            <p style="margin: 0 0 24px;">
                <a href="{{ activation_link }}" style="display: inline-block; padding: 12px 22px; background-color: #00307c; border-radius: 8px; font-weight: 600; color: #ffffff; text-decoration: none;">{% trans 'Set Your Password' %}</a>
            </p>
        {% endif %}
    {% endif %}

    {% if reschedule_link %}
        <h2 style="margin: 0 0 10px; font-size: 16px; font-weight: 700; color: #0c1b33;">{% trans 'Rescheduling' %}</h2>
        <p style="margin: 0 0 12px;">{% translate 'If your plans change and you need to reschedule your appointment, you can easily do so by following this link: ' %}</p>
        <p style="margin: 0 0 24px;">
            <a href="{{ reschedule_link }}" style="display: inline-block; padding: 11px 20px; border: 1px solid #00307c; border-radius: 8px; font-weight: 600; color: #00307c; text-decoration: none;">{% translate 'Reschedule Appointment' %}</a>
        </p>
    {% endif %}

    <p style="margin: 0 0 12px; color: #33415c;">
        {% blocktranslate trimmed %}
            Should you have any inquiries or require further assistance, our support team is here to help. You can
            reach us anytime.
        {% endblocktranslate %}
        {% trans "We look forward to serving you and ensuring that your experience with us is both rewarding and satisfactory." %}
    </p>
    <p style="margin: 0;">{% trans "Warm regards" %},<br>{% if company %}{{ company }}{% else %}{% trans "The Team" %}{% endif %}</p>
{% endblock %}

{% block footer %}
    &copy; {{ current_year }} {{ company }}. {% trans "All rights reserved" %}.
{% endblock %}