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

{% load static %}

{% block content %}


{% if messages %}
<ul class="messages">
    {% for message in messages %}
    <li class="text-danger">{% if message.tags %}{% endif %}{{ message }}</li>
    {% endfor %}
</ul>
{% else %}
    <div class="modal-body row">
    <div class="col-md-12">
        {% for r in response %}
            <h3 class="login-heading mb-4 text-left" style="color: #793D01;">Your Booking</h3>
            <div class="login-heading mb-4 text-left">Status: <span class="text-danger"><b style="color: green;">{{ r.confirmed }}</b></span></div>
            <div class="login-heading mb-4 text-left">Booking reference: <span class="text-danger"><b style="color: green;">{{ r.reference }}</b></span></div>
            <div class="login-heading mb-4 text-left">Document issued at: <b style="color: green;">{{ r.created }}</b></div>
            <div class="login-heading mb-4 text-left">Price: <b style="color: green;">${{ r.price }}</b></div>
            {% if r.0firstFlightDepartureDate %}
                <div class="card mb-3 text-center" style="max-width: 40rem;">
                    <div class="card-body">
                        <div class="card-text">
                            Departure at {{r.0departureDate}}
                                <h4><img src={{ r.0firstFlightAirlineLogo }} alt={{ r.0firstFlightAirline }}> {{ r.0firstFlightDepartureDate }} {{ r.0firstFlightDepartureAirport }}
                                            &#10230 {{ r.0firstFlightArrivalAirport }} {{ r.0firstFlightArrivalDate }}</h4>
                                {% if r.0secondFlightDepartureAirport %}
                                    <h4><img src={{ r.0secondFlightAirlineLogo }} alt={{ r.0secondFlightAirline }}> {{ r.0secondFlightDepartureDate }} {{ r.0secondFlightDepartureAirport }}
                                            &#10230 {{ r.0secondFlightArrivalAirport }} {{ r.0secondFlightArrivalDate }}</h4>
                                {% endif %}
                                {% if r.1firstFlightDepartureAirport %}
                            <hr class="newstyle">
                            Return at {{r.1departureDate}}
                                    <h4><img src={{ r.1firstFlightAirlineLogo }} alt={{ r.1firstFlightAirline }}> {{ r.1firstFlightDepartureDate }} {{ r.1firstFlightDepartureAirport }}
                                            &#10230 {{ r.1firstFlightArrivalAirport }} {{ r.1firstFlightArrivalDate }}</h4>
                                    {% if r.1secondFlightDepartureAirport %}
                                        <h4><img src={{ r.1secondFlightAirlineLogo }} alt={{ r.1secondFlightAirline }}> {{ r.1secondFlightDepartureDate }} {{ r.1secondFlightDepartureAirport }}
                                            &#10230 {{ r.1secondFlightArrivalAirport }} {{ r.1secondFlightArrivalDate }}</h4>
                                    {% endif %}
                            {% endif %}
                        </div>
                    </div>
                </div>
            {% endif %}
        {% endfor %}
    </div>
</div>
{% endif %}


{% endblock %}