{% extends "layout.html" %}

{% set title = 'Confirm Reservation' %}

{% block content %}

<section class="sec-pad">
    <div class="container">
        <div class="shop-head">
            <h3 class="no-margin text-bold">Reservation Details</h3>
        </div>
        <div class="reservation-details plxxlg mtxlg">
            <h4 class="d-inline text-bold">Dr. Husein El Sayed</h4>
            <p>Speciality Name</p>
            <div class="row mtlg">
                <div class="col-sm-6">
                    <div class="reservation-data">
                        <div class="re-info mbmd">
                            <span class="text-bold">Address: </span>
                            <span>Mohandessin, Giza</span>
                        </div>
                        <div class="re-info mbmd">
                            <span class="text-bold">Date: </span>
                            <span>Tuesday - 26/3/2019</span>
                        </div>
                    </div>
                </div>
                <div class="col-sm-6">
                    <div class="reservation-data">
                        <div class="re-info mbmd">
                            <span class="text-bold">Fees: </span>
                            <span>300 EGP</span>
                        </div>
                        <div class="re-info mbmd">
                            <span class="text-bold">Time: </span>
                            <span>From 7:00 pm To 10:00 pm</span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="re-info mbmd">
                <span class="text-bold">User: </span>
                <ul class="users mtmd">
                    <li class="user selected cover mrlg" style="background-image: url('_assets/img/doctors/01.jpg')"></li>
                    <li class="user cover mrlg" style="background-image: url('_assets/img/doctors/02.jpg')"></li>
                    <li class="user text-center">
                        <a href="#"><i class="fas fa-plus"></i></a>
                    </li>
                </ul>
            </div>
            <div class="reservation-btn mtxxlg pull-right">
                <a href="#" class="btn btn-blue text-upper d-inline mrlg">confirm reservation</a>
                <a href="#" class="btn btn-outline text-upper d-inline">cancel</a>
            </div>
        </div>
    </div>
</section>

{% endblock content %}