<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title><%= title %></title>

    <!-- fontawesome cdn  -->
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.2.1/css/all.min.css" />

    <!-- dataTable css  -->
    <link rel="stylesheet" href="https://cdn.datatables.net/1.13.1/css/jquery.dataTables.min.css">

    <!-- custom style link  -->
    <link rel="stylesheet" href="/admin/css/style.css">
    <!-- package recipt styling -->
     <link rel="stylesheet" href="/admin/css/receipt.css">
     <!-- htm2pdf cdn  -->

     <script src="https://cdnjs.cloudflare.com/ajax/libs/html2pdf.js/0.10.1/html2pdf.bundle.min.js" integrity="sha512-GsLlZN/3F2ErC5ifS5QtgpiJtWd43JWSuIgh7mbzZ8zBps+dvLusV+eNQATqgA/HdeKFVgA5v3S/cIrLF7QnIg==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

     <!-- sweetalert cdn  -->
     <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>


     <style>
        .myspinner {
            width: 50px;
            height: 50px;
            /* border: 4px solid #2a7178; */
            border-top: 2px solid #2a7178;
            border-bottom: 2px solid #76b9bf;
            border-left: 2px transparent;
            border-right: 2px transparent;
            border-radius: 50%;
            animation: animateMySpinner 1s linear infinite;
        }
        @keyframes animateMySpinner {
            0% {
                transform: rotate(0deg);
            }

            100% {
                transform: rotate(360deg)
            }
        }
     </style>
     <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.7.2/css/all.min.css" integrity="sha512-Evv84Mr4kqVGRNSgIGL/F/aIDqQb7xQ2vcrdIwxfjThSH8CSR7PBEakCr51Ck+w+/U6swU2Im1vVX0SVk9ABhg==" crossorigin="anonymous" referrerpolicy="no-referrer" />
     <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet">

     <link rel="stylesheet" href="/admin/css/style.css">
     <script src="https://cdn.jsdelivr.net/npm/qrcode/build/qrcode.min.js"></script>

</head>
<body>
    <%- include("mobileMenu") %> 
    <%- include("notification") %> 
    <div class="overlay"></div>
    <div class="modal-overlay"></div>
    <div class="loading-spinner"><img src="/images/loadingspinner.gif" alt=""></div>
    <div class="loading-overlay">
        <div class="myspinner"></div>
    </div>
    
