@extends('layouts.main')

@section('content')

<div class="container-fluid py-4">

<div class="card shadow-sm">

<div class="card-header">
<h5 class="mb-0">Booking Reports</h5>
</div>

<div class="card-body">

<div class="row mb-3">

<div class="col-md-4">
<label>From Date</label>
<input type="date" class="form-control">
</div>

<div class="col-md-4">
<label>To Date</label>
<input type="date" class="form-control">
</div>

<div class="col-md-4 d-flex align-items-end">
<button class="btn btn-primary w-100">Generate Report</button>
</div>

</div>

<table class="table table-bordered">

<tr>
<th>Date</th>
<th>Total Bookings</th>
<th>Completed</th>
<th>Cancelled</th>
</tr>

<tr>
<td>20 June</td>
<td>10</td>
<td>7</td>
<td>3</td>
</tr>

<tr>
<td>21 June</td>
<td>8</td>
<td>6</td>
<td>2</td>
</tr>

</table>

</div>

</div>

</div>

@endsection