
<?php session_start();
?>

<?php 




if (isset($_COOKIE['number'])) {

$number=$_COOKIE['number'];
$_SESSION['number']=$_COOKIE['number'];

   $login_status=1; 
   

    $sql = "SELECT * FROM customers WHERE number='$number'";

$result=mysqli_query($conn,$sql);

   $row=mysqli_fetch_array($result);

   $_SESSION['status']=$row["status"];
   $_SESSION['fname']=$row["fname"];
$_SESSION['customers_id']=$row["customer_id"];


}
if(!isset($_SESSION['number'])){
   $login_status=0;

}


?>
<?php 
$color_mod='';
$color_mod=2; 
    


   

$sql="select * from store_details order by id desc";
$result = mysqli_query($conn,$sql)or die( mysqli_error($conn));
while ($row=mysqli_fetch_array($result)) {
 $data=$row['id'];
   $store_name=$row['name'];
   $c1=$row['first_contact'];
   $c2=$row['second_contact'];
   $store_email=$row['email'];
   $logo=$row['logo'];
   $location=$row['location'];
   $w_H=$row['working_hours'];
   $website=$row['website'];
   $store_image=$row['logo'];

   




}
?>

<head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <!-- Latest compiled and minified CSS -->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css">

        <!--Table cdn-->
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
        <!-- Bootstrap DataTable CSS -->
        <link rel="stylesheet" href="https://cdn.datatables.net/1.10.21/css/dataTables.bootstrap4.min.css">
        <link rel="stylesheet" href="https://cdn.datatables.net/2.0.5/css/dataTables.dataTables.css">
        <link rel="stylesheet" href="https://cdn.datatables.net/buttons/3.0.2/css/buttons.dataTables.css">
    
        <!---Fontawesome CDN-->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
        <!-- jQuery library -->
        <script src="https://cdn.jsdelivr.net/npm/jquery@3.7.1/dist/jquery.slim.min.js"></script>
    
        <!-- Popper JS -->
        <script defer src="https://cdn.jsdelivr.net/npm/popper.js@1.16.1/dist/umd/popper.min.js"></script>
    
        <!-- Latest compiled JavaScript -->
        <script defer src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"></script>
       


        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@500&display=swap" rel="stylesheet">
        <link href='https://fonts.googleapis.com/css?family=Convergence' rel='stylesheet'>


        <!--JS AOS-->
        <link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
    
    
          <!-- owl carousel css link -->
        <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
      
       <!-- owl carousel theme.css link -->
       <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">  
    
       <!-- owl carousel js file -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
    

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>  
          
           <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script>  
        <!--video play button cdn-->
          <!-- Icon Font Stylesheet -->
    <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.10.0/css/all.min.css" rel="stylesheet">
    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.4.1/font/bootstrap-icons.css" rel="stylesheet">
        <!--graph cdn-->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script>
        <script src="https://www.gstatic.com/charts/loader.js"></script>
    <!---Fontawesome CDN-->
    <script src='https://kit.fontawesome.com/a076d05399.js' crossorigin='anonymous'></script>
        <!-- google font--->
        <link rel="preconnect" href="https://fonts.gstatic.com">
        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap" rel="stylesheet">
        
       <!--google geolocation AIP CDN--->
 

        <title> <?php echo $store_name ?> <?php echo $page ?></title>
        <link rel="icon" href="logo/gatprol.png" type="image/x-icon">

<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="keywords" content="Restaurant,Food,Lunch">
<meta property="og:image" content="https://gatpros.com/demo/pos/logo/food_delivery_app.jpg" />
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="googlebot" content="translate">
<meta name="description" content="This is an online demo version of our food delivery app. 

contact as for free demo version">



<meta property="og:type"               content="article" />
<meta property="og:title"              content=" Food delivery app" />
<meta property="og:description"        content="This is an online demo version of our food delivery app. 

contact as for free demo version " />
<meta property="og:image" content="https://gatpros.com/demo/pos/logo/food_delivery_app.jpg"/>
        <?php
        $color=1;
        $color=$color_mod;

        if ($color==1) {
            $body_color='black';
            $body_text='antiquewhite';
            $nav_color=' #1D211C';
            $nav_text='antiquewhite';
            $menu_b_color=' #1C0601';
        }
        elseif($color==2){
            $body_color='#EDF2F1FF';
            $body_text='black';
            $nav_color='#982BAD';
            $nav_text='antiquewhite';
            $menu_color='#982BAD';
            $menu_b_color='#044763';
        }
       
        
        ?>
        <style>
            body{
                background-color:<?php echo $body_color ?>;
                color: <?php echo $body_text?>;
                     font-family: 'Convergence'!important;
                
                }
img{
   /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);*/
}
a:hover {
    text-decoration: none;
  }

/* nav bar start */
nav{
    background-color:<?php echo $nav_color;?>;
    overflow: hidden;
   

}

/* nav bar end */


/*menu start*/

.menu-list{
    background-color:<?php echo $nav_color;?>;
    position: relative;
    padding: 10px;
    color:white !important;
    
}
.menu-list .design{
    position: absolute;
    bottom: 0;
    left: 0;
    text-align: center;

}
.nav,.invoice{
    background-color:<?php echo $nav_color;?>;
}
.menu-list-item a {
color: white !important ;
}

.menu-list-item{
    font-size: 12px;
    margin: 0px;
   
}

   


.btn-order{
   background-color: <?php echo $nav_color;?>;
    border-style: solid;
    color: antiquewhite;
    text-align:center;
   overflow: auto;
   
}

.order-cat{
    overflow: scroll;
    height:100vh;
}

.order-text{font-size: 12px;}
.order-text-order-managment{font-size: 15px;}
.btn-order:hover{

color: antiquewhite;
}


/* search */
.input-group{
    width: 200px;
}
/* categories*/


/*invoice*/

.invoice{

    color: <?php echo  $nav_text ?>
}
.invoice-item{
    margin-bottom: 5px;
    background-color: <?php echo $menu_b_color ?>;
    width: 400px;
   
    border-radius:10px;
   
}
.img-invoice{
    margin: 2px;
}
.img-invoice img{
    width: 100px;
}
.text-invoice{
    width: 400px;
    height: 100%;
    font-size:15px;
}

/*ordes*/
.menu{
    overflow: auto;
    height: 100vh !important;
  margin:0px;
  font-size:15px;
}

/* Min-width */
@media only screen and (max-width: 1200px)  {

    .menu{
  
    height: 100vh !important;
  margin:0px;
} 
}

.menu-cat{
    height: 100%!important;
    overflow: scroll;
}


.menu-analytics{
    overflow: scroll;
    height: 100vh !important;
    background-color: aliceblue;
    font-family: 'Roboto', sans-serif ! important;
}
.menu-items{
    background-color:white; 
    border-radius: 10px;
  padding:10px;
    
    
 
}

@media (min-width: 600px) {
  .menu-items{
   margin: 0px !important;
  }
  }

.menu-items-order-managment{
    background-color:<?php echo $nav_color;?>; 
    width: 100%;
    border-radius: 10px;
    margin: 10px;
    color:<?php echo $nav_text;?>;
}

.menu-items:hover{
    background-color:;
  
    cursor: pointer;
}
.menu-dis{
    margin: 0px;
    font-size: 12px;
}

.menu-price{
    margin-right: 90px;

  background-color: rgb(119, 10, 10);
  border-radius: 5px;
  height: 100%;
  padding: 2px;
}

.counter {
  

    display: flex;
   
}
.counter input {
    width: 20px;
   border-radius: 20px;
    border: 0;
    font-size: 20px;
    text-align: center;
    background: #e0e2e5;
    color: #322f2f;
    appearance: none;
    outline: 0;
    margin-bottom: 5px;
}
.counter span {
    display: block;
    font-size: 15px;
    padding: 0 5px;
    cursor: pointer;

    user-select: none;
}

/* payment method*/
.pament-button{
    margin: 20px;
}
.btn-payment{
    color: bisque;
    margin: 5px;
    font-size: 15px;

}
.receipt{
    
    padding:5px;
   font-size:20px;
   
}
.reciept-items{
    display:flex;

}
.reciept-items p{
    font-size: 18px;
}
.reciept-item-list{
    margin-right: 20px;
}
.receipt-list1{
    float: right;

}

.receipt-list1 p{
    text-align-last:left;
}

.receipt-list2 p{
    text-align-last: right;
}


.invoice-quantity input{
width: 2rem;
border-radius: 10px;
appearance: none;
text-align: center;
}

.invoice-quantity{
    margin-bottom: 5px;
}
.invoice-quantity span{
    
    font-size: 20px;
    cursor: pointer;

    user-select: none;
}

/* Order Section */
.menu-oders{
    
    height:400px !important;
    margin: 30px;
}

/* analytics section*/
.daily-report{
    display: flex;
    overflow: auto;
   
}


/* customer feedback*/
.costumer-feedback{
    background-color:<?php echo $nav_color;?>;
    margin-top: 5px;


}
.customer-name{
    margin: 10px;
    font-size: 15px;
}
/*cus massage*/
.cus-massage{
    background-color: <?php echo $nav_color;?>;
    height: 1000px;
    color:antiquewhite;
    margin-top: 10px;
    overflow:scroll;
}
.cus-massage-tittle{
    color: antiquewhite;
}

.cus-massage-head{
    margin: 10px;
    background-color:<?php echo $menu_color;?>;
    color: antiquewhite;
    margin-bottom: 10px;
    padding: 10px;
    border-radius: 10px;
    font-size: 15px;
}
.massage-feedback{
    border-radius: 10px;
    margin: 10px;
    color: antiquewhite;
    background-color:<?php echo $menu_color;?>;
}

.table-customer{
   width: 100% !important;
    overflow: scroll;
}
.table-customer tr:hover{
    cursor: pointer;

}
.table-customer tr{
    text-align: center;
 
}

p{
    margin: 0;
    padding: 0;
}
.cart{
    display:;
    font-size: 15px;
    
}

table{
    overflow:scroll !important;
}
div.fixed {
  display:none;
  position: fixed;
  width: 100%;
  bottom: 0px;
  border-radius: 0px 0px 30px 30px;

}
div.tit{
    border-radius: 0px 0px 30px 30px;
    position: sticky;
    top: 0;
  width: 100%;
  background-color:#982BAD;
}

.pad{
    margin-bottom: 90px;
}
.nav_bi{
    font-size: 20px;
    font-weight: 800;
    
}

@media (max-width: 600px) {
  div.fixed{
    display:block;
  }
  .nav_top{
    display:none;
  }
  }


/*** Section Title ***/
.section-title::before {
    position: absolute;
    content: "";
    width: 150px;
    height: 5px;
    left: 0;
    bottom: 0;
    background: var(--primary);
    border-radius: 2px;
}

.section-title.text-center::before {
    left: 50%;
    margin-left: -75px;
}

.section-title.section-title-sm::before {
    width: 90px;
    height: 3px;
}

.section-title::after {
    position: absolute;
    content: "";
    width: 6px;
    height: 5px;
    bottom: 0px;
    background: #FFFFFF;
    -webkit-animation: section-title-run 5s infinite linear;
    animation: section-title-run 5s infinite linear;
}

.section-title.section-title-sm::after {
    width: 4px;
    height: 3px;
}

.section-title.text-center::after {
    -webkit-animation: section-title-run-center 5s infinite linear;
    animation: section-title-run-center 5s infinite linear;
}

.section-title.section-title-sm::after {
    -webkit-animation: section-title-run-sm 5s infinite linear;
    animation: section-title-run-sm 5s infinite linear;
}

@-webkit-keyframes section-title-run {
    0% {left: 0; } 50% { left : 145px; } 100% { left: 0; }
}

@-webkit-keyframes section-title-run-center {
    0% { left: 50%; margin-left: -75px; } 50% { left : 50%; margin-left: 45px; } 100% { left: 50%; margin-left: -75px; }
}

@-webkit-keyframes section-title-run-sm {
    0% {left: 0; } 50% { left : 85px; } 100% { left: 0; }
}



        </style>
    </head>