<h2 style="color: #333; font-size: 18px; margin-bottom: 15px;">Reservation Details</h2>

<p style="color: #51545E; font-size: 15px; line-height: 1.8; margin-bottom: 20px;">
    <strong>Check-In:</strong> {{ reservation.stay.checkInDate }} (from {{ policies.checkInTime }})<br/>
    <strong>Check-Out:</strong> {{ reservation.stay.checkOutDate }} (until {{ policies.checkOutTime }})<br/>
    <strong>Nights:</strong> {{ reservation.stay.los }} {{ reservation.stay.los == 1 ? 'night' : 'nights' }}<br/>
    <strong>Guests:</strong> {{ reservation.stay.guests.adults }} {{ reservation.stay.guests.adults == 1 ? 'adult' : 'adults' }}{% if reservation.stay.guests.children|length > 0 %}, {{ reservation.stay.guests.children|length }} {{ reservation.stay.guests.children|length == 1 ? 'child' : 'children' }}{% endif %}<br/>
    <strong>Rate plan:</strong> {{ reservation.accommodation.ratePlan.name }}<br/>
    <strong>Rental unit:</strong> {{ reservation.accommodation.type.name }}<br/>
    <strong>Payment type:</strong> {{ reservation.payment.method.name }}<br/>
    {% if reservation.specialRequest %}
        <strong>Customer request: </strong>{{ reservation.specialRequest }}
    {% endif %}
</p>

<table class="purchase" width="100%" cellpadding="0" cellspacing="0" role="presentation">
    <tr>
        <td colspan="2">
            <table class="purchase_content" width="100%" cellpadding="0" cellspacing="0">
                <tr>
                    <th class="purchase_heading" align="left">
                        <p class="f-fallback">Description</p>
                    </th>
                    <th class="purchase_heading" align="right">
                        <p class="f-fallback">Amount</p>
                    </th>
                </tr>
                {% set isCancelled = reservation.status == 'CANCELLED' %}
                {% if isCancelled and reservation.cancellation.penalties.current %}
                    <tr>
                        <td width="60%" class="purchase_item"><span class="f-fallback">Cancellation penalty</span></td>
                        <td class="align-right" width="20%" class="purchase_item"><span class="f-fallback">{{ reservation.cancellation.penalties.current / 100 }} {{ reservation.currency }}</span></td>
                    </tr>
                {% endif %}
                <tr>
                    <td width="60%" class="purchase_item"><span class="f-fallback">Accommodation</span></td>
                    <td class="align-right" width="20%" class="purchase_item">
                        <span class="f-fallback">
                            {% if isCancelled %}<s>{{ (totals.accommodationSubtotal / 100)|number_format(2) }} {{ totals.currency }}</s>{% else %}{{ (totals.accommodationSubtotal / 100)|number_format(2) }} {{ totals.currency }}{% endif %}
                        </span>
                    </td>
                </tr>
                {% if reservation.extras is defined and reservation.extras|length > 0 %}
                    {% for extra in reservation.extras %}
                        {% if not extra.neutral %}
                            <tr>
                                <td width="60%" class="purchase_item"><span class="f-fallback">{{ extra.name }} × {{ extra.quantity }}</span></td>
                                <td class="align-right" width="20%" class="purchase_item">
                                <span class="f-fallback">
                                    {% if isCancelled %}<s>{{ (extra.totalPrice / 100)|number_format(2) }} {{ totals.currency }}</s>{% else %}{{ (extra.totalPrice / 100)|number_format(2) }} {{ totals.currency }}{% endif %}
                                </span>
                                </td>
                            </tr>
                        {% endif %}
                    {% endfor %}
                {% endif %}
                {% for modifier in totals.modifiers %}
                    {% if modifier.type == 'taxes' %}
                        <tr>
                            <td width="60%" class="purchase_item"><span class="f-fallback">Tax ({{ modifier.value }}%)</span></td>
                            <td class="align-right" width="20%" class="purchase_item">
                            <span class="f-fallback">
                                {% if isCancelled %}<s>{{ (modifier.amount / 100)|number_format(2) }} {{ totals.currency }}</s>{% else %}{{ (modifier.amount / 100)|number_format(2) }} {{ totals.currency }}{% endif %}
                            </span>
                            </td>
                        </tr>
                    {% elseif modifier.type == 'charges' %}
                        <tr>
                            <td width="60%" class="purchase_item"><span class="f-fallback">{{ modifier.name ?? 'Fee' }}</span></td>
                            <td class="align-right" width="20%" class="purchase_item">
                            <span class="f-fallback">
                                {% if isCancelled %}<s>{{ (modifier.amount / 100)|number_format(2) }} {{ totals.currency }}</s>{% else %}{{ (modifier.amount / 100)|number_format(2) }} {{ totals.currency }}{% endif %}
                            </span>
                            </td>
                        </tr>
                    {% endif %}
                {% endfor %}
                <tr>
                    <td width="60%" class="purchase_footer" valign="middle">
                        <p class="f-fallback purchase_total purchase_total--label">Total</p>
                    </td>
                    <td width="40%" class="purchase_footer" valign="middle">
                        <p class="f-fallback purchase_total">
                            {% if isCancelled and reservation.cancellation.penalties.current %}
                                {{ (reservation.cancellation.penalties.current / 100)|number_format(2) }} {{ reservation.currency }}
                            {% else %}
                                {{ (totals.total / 100)|number_format(2) }} {{ totals.currency }}
                            {% endif %}
                        </p>
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

<!-- Separator -->
<hr style="border: none; border-top: 1px solid #EAEAEC; margin: 30px 0;" />
