<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <nav class="navbar navbar-expand-lg" style="background-color: #e3f2fd;">
            <div class="container-fluid">
              <a class="navbar-brand" href="/book_movies?user=<%=user%>&user_id=<%=user_id%>">Movie Booking System</a>
              <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation">
                <span class="navbar-toggler-icon"></span>
              </button>
            </div>
        </nav>
        <meta name="viewport" content="width=device-width,initial-scale=1">
        <title>Delete Booking</title>
        <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous">
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script>
    </head>
    <body>
        <div class="row" style="margin-left: 20px;margin-right: 10px;">
                <div class="col-sm-6 card mb-3 flex-column mx-auto" style="max-width:18rem;margin-top: 2em;">
                    <div class="card-header">Current Booking</div>
                    <div class="card-body d-flex flex-column">
                        <h5 class="card-title"><%=movie_name%></h5>
                        <h6 class="card-subtitle"><%=movie_type%></h6>
                        <p class="card-text">
                            Runtime : <%=movie_length%> minutes
                        </p>
                        <br>
                        <p class="card-text">
                            Show Date : <%=show_date%>
                        </p>
                        <br>
                        <p class="card-text">
                            Show Time : <%=show_time%>
                        </p>
                        <br>
                        <p class="card-text">
                            Total seats booked : <%=admits%>
                        </p>
                        <br>
                        <p class="card-text">
                            Seat Type : <%=seat_type%>
                        </p>
                        <br>
                        <h5 class="card-text">Total Spent : â‚¹ <%=total_bill%></h5>
                        <br>
                        <div class="alert alert-info" role="alert">
                            <a href="/booked_tickets?user_id=<%=user_id%>&user=<%=user%>" class="btn btn-success" role="button">Go Back</a>
                        </div>
                        <form class="validated-form" method="post" action="/delete_booking?_method=DELETE&user_id=<%=user_id%>&user=<%=user%>&movie_id=<%=movie_id%>" novalidate>
                            <div class="alert alert-warning" role="alert">
                                Are you sure you want to delete this booking?
                            </div>
                            <div class="d-flex justify-content-center">
                                <button type="submit" class="btn btn-danger">Delete</button>
                            </div>
                        </form>
                    </div>
                </div>
        </div>
    </body>