{% extends "emails/base_email.html" %}

{% block title %}Nueva cita agendada{% endblock %}

{% block content %}
<p style="font-size: 15px; color: #4a4a4a; line-height: 1.6; margin: 0 0 20px 0;">
    Se ha agendado una nueva cita en <strong style="color: #1a1a1a;">{{ business.name }}</strong>.
</p>

<div style="background-color: #f0f0d8; border-radius: 8px; padding: 20px; margin: 0 0 24px 0;">
    <table width="100%" cellpadding="0" cellspacing="0">
        <tr>
            <td style="padding: 6px 0;">
                <span style="font-size: 12px; color: #999999;">Cliente</span><br>
                <span style="font-size: 15px; font-weight: 700; color: #1a1a1a;">{{ appointment.full_name }}</span>
            </td>
        </tr>
        <tr>
            <td style="padding: 6px 0;">
                <span style="font-size: 12px; color: #999999;">Fecha</span><br>
                <span style="font-size: 15px; font-weight: 700; color: #1a1a1a;">{{ appointment.date|date:"d F Y" }}</span>
            </td>
        </tr>
        <tr>
            <td style="padding: 6px 0;">
                <span style="font-size: 12px; color: #999999;">Hora</span><br>
                <span style="font-size: 15px; font-weight: 700; color: #1a1a1a;">{{ appointment.start_time|time:"H:i" }}</span>
            </td>
        </tr>
        <tr>
            <td style="padding: 6px 0;">
                <span style="font-size: 12px; color: #999999;">Servicio</span><br>
                <span style="font-size: 15px; font-weight: 700; color: #1a1a1a;">{{ appointment.appointment_type.name }}</span>
            </td>
        </tr>
    </table>
</div>
{% endblock %}