<table class='tabel table-borderless w-100 my-3'>
	<!-- thsi is another tab show order page -->
	<tr>
		<td>
			<nav class="nav border bg-light rounded align-items-center">
				<ul class="nav " id="myTab2">
					<li class="nav-item clear" data-value=""> <a class="nav-link text-muted active fw-bolder text-dark " data-toggle='pill2' aria-current="page" href="#all">All ({{$orders_statistics['total']}})</a> </li>
					<li class="nav-item category" data-value="0"> <a class="nav-link text-muted" data-toggle='pill2' href="#ac">Cancelled({{$orders_statistics['cancelled']}})</a> </li>
					<li class="nav-item category" data-value="1"> <a class="nav-link text-muted" data-toggle='pill2' href="#pe">Active ({{$orders_statistics['active']}})</a> </li>
					<li class="nav-item category" data-value="2"> <a class="nav-link text-muted" data-toggle='pill2' href="#com">Completed({{$orders_statistics['complete']}})</a> </li>
					<li class="nav-item category" data-value="3"> <a class="nav-link text-muted" data-toggle='pill2' href="#com">Pending for Gift ({{$orders_statistics['pending']}})</a> </li>

					{{-- <li class="nav-item category" data-value="3"> <a class="nav-link text-muted" data-toggle='pill2' href="#canc">waiting for gift ({{$orders_statistics['cancelled']}})</a> </li> --}}
				</ul>
			</nav>
		</td>
	</tr>
</table>
<div class='tab-content'>
	<div id='all' class='tab-pane fade show oneshow active '>
		<div class='overflow-auto table-responsive'>
			<table class='table table-border orders-table w-100'>
				<thead>
					<th>#</th>
					<th>Customer</th>
					<th>Order ID</th>
					<th>Order at</th>
					<th>Status</th>
					<th class="float-end">Action</th>
				</thead>
				<tbody class='border-top'>

				</tbody>
			</table>
		</div>
	</div>
</div>
