<link rel="canonical" href="<?php echo base_url(''); ?>menu">
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/gh/kenwheeler/slick@1.8.1/slick/slick-theme.css" />
<link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.css" />
<style>
    .col-md-3.col-xs-4.border.category-list {
        position: sticky !important;
        top: 5px;
    }

    .items {
        width: 85%;
        margin: 0px auto;
        margin-top: 15px;
    }

    .slick-prev:before,
    .slick-next:before {
        font-size: 40px;
        left: -19px;
        line-height: 0.1;
        position: relative;
    }

    .slick-prev {
        left: -55px;
    }

    .slick-next {
        right: -55px;
    }

    .slick-slide {
        margin: 10px;
    }

    #btn-slick,
    #btn-slick1 {
        background-color: #dd4b39;
        outline: 0;
        border: 0;
        float: right;
    }

    .slick-prev,
    .slick-next,
    .slick-prev:hover,
    .slick-next:hover,
    .slick-prev:focus,
    .slick-next:focus {
        padding: 25px;
        background-color: #dd4b39;
        z-index: 10;
    }

    .slick-slide img {
        width: 100px;
        border: 0px solid #fff;
        height: 150px;

    }

    .item-list img {
        width: 100%;
        height: 135px;
        border-radius: 5px 5px 0 0;
    }

    .item-list {
        height: 300px;
        width: 500px;
        background-color: #fff;
        text-align: center;
        margin-right: 10px;
        box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
        border-radius: 5px;
    }

   
    .cart-btn {
        background-color: transparent;
        color: #000;
        border: 1px solid #000;
        border-radius: 20px;
    }

    .prod-price {
        font-weight: bolder;
        margin: 10px 0 20px;
    }

    .top-menu-wrapper{
        z-index: unset !important;
    }

    .prod-price b {
        color: red;
        margin-left: 5px;
    }

    .prod-title {
        font-weight: lighter;
        height: 30px;
        font-size: 20px;
    }


    .btn-menu {

        width: 90%;
        background: red;
        color: #fff;
        font-size: 16px;
        margin: 0 auto;
        line-height: 2;
        height: 30px;
        border-radius: 5px;
    }

    .item-list a {
        text-decoration: none;
        cursor: pointer;
        /* background: #ff4e41; */
        /* border: 1px solid #ff4e41; */
    }

    .item-mob-list {
        text-align: center;
        background-color: #fff;
        padding-bottom: 30px;
        width: 90%;
        border-radius: 20px;
        margin: 0 auto;
        margin-bottom: 50px;
        box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
    }

    .items-mob .item-mob-list img {
        height: 200px;
        border-radius: 20px 20px 0 0;
    }

    .modal-title {
        width: 100%;
        text-align: center;
        position: relative;

    }

    /* .mobile-modal {
        width: 340px;
    } */

    .mobile-modal span {
        position: absolute;
        top: 4px;
        right: 10px;
        font-size: 28px;
    }

    .mobile-modal .modal-content .modal-header {
        margin-bottom: 15px;
    }

    .mobile-modal .modal-title::before {
        display: none;
    }

    .item-mob-list a {
        text-decoration: none;
    }

    .modal-title::before {
        content: "";
        margin-bottom: 22px;
        position: absolute;
        bottom: -31px;
        height: 15px;
        margin-left: 30px;
        width: 100px;
        border-bottom: 3px solid #dd4b39;
        border-width: thick;
    }

    .alert {
        line-height: 2;
    }

    /* .marker{
        border: 5px solid #92cb32;
    } */

    .modal-feature .modal-body,
    .mobile-modal .modal-body {
        padding: 0;
    }

    #btn-slick1 {
        display: none;
    }
    .side-btns{
        transform: rotate(270deg);
        /*writing-mode: vertical-rl;*/
        position: fixed;
        top: 30%;
        font-size: 14px;
        left: -55px;
        z-index: 110;

    
    
    }
     .side-btns button{
        color: #fff;
        background-color: #dd4b39;
        padding: 8px;
        font-weight:bold;
        border-radius: 10px;
        border: 2px solid #000;
        margin-bottom: 10px;
        z-index: 110;
     }
	 .mobopshow{display:none;}
	 
    @media (max-width: 768px) {
		.mobopshow{display:block}.desktopshow{display:none}
        .btn-div {display: none;}
        #btn-slick1 {display: inline-block;}

    }
    body{overflow:scroll!important}
</style>
<?php //p($data); 
?>
<?php
$merchantInfo = $this->session->userdata('merchantInfo');
if (isset($merchantInfo['merchant_photo_bg']) &&  $merchantInfo['merchant_photo_bg']) {
     $bg_img = $merchantInfo['merchant_photo_bg'];
} else {
    $bg_img = 'https://www.loveeatery.co.nz/assets/images/banner.jpg';
}
$resturantInfo = $this->session->userdata('resturantInfo');
//p($resturantInfo);

//echo $_SESSION['transaction_type'];

//echo $merchantInfo['services'];
//echo 'bbbb';



    if($merchantInfo['services']=='pickup' || $merchantInfo['services']=='Pickup'){
          $_SESSION['transaction_type']='pickup';
        
    }else if ($merchantInfo['services']=='delivery' || $merchantInfo['services']=='Delivery'){   
        $_SESSION['transaction_type']='delivery';
    }else if ($merchantInfo['services']=='Delivery,Dinein'){
        if($_SESSION['transaction_type']=='delivery' || $_SESSION['transaction_type']=='dinein' ){}else{
            
         $_SESSION['transaction_type']='delivery';     
        }
        
        
    }else if ($merchantInfo['services']=='Pickup,Dinein'){
        if($_SESSION['transaction_type']=='pickup' || $_SESSION['transaction_type']=='dinein' ){}else{
            
         $_SESSION['transaction_type']='pickup';     
        }
        
        
    }
    
    


?>

<div class="side-btns desktopshow">
    <button data-toggle="modal" class="blinking" id="btn-slick" data-target="#exampleModalCenter">You have free items</button>
</div>

<div class="side-btns mobopshow" >
    <button data-toggle="modal" class="blinking" id="btn-slick1" data-target="#exampleModalCenter1">You have free items</button>
</div>



<div class="mobile-banner-wrap relative">
    <div class="layer"></div>
    <img class="mobile-banner" src="<?= $bg_img; ?>" style="height: 200px; object-fit: cover;">
</div>
<div id="parallax-wrap" class="parallax-search parallax-menu" data-parallax="scroll" data-position="top" data-bleed="10" data-image-src="/assets/images/b-2.jpg" style="background-image:url('<?= $bg_img; ?>');">
    <div class="name-label">
       <h1>You are ordering from "<?= @$this->session->merchantInfo['restaurant_name']; ?>" </h1>
    </div>
</div>
<!--parallax-container-->
<div class="search-wraps center menu-header">
    <img style="display:none" class="logo-medium bottom15" src="<?= @$merchantInfo['merchant_logo']; ?>">
    <!--new search-wraps------------------------------------------------------------->
    <div id="res_title" class="hidden-xs">
        <!--<h1><?= $merchantInfo['restaurant_name']; ?></h1>-->
        <div class="mycol restatus">
            <?php 
            $status = [];
            if (isset($resturantInfo) && !empty($resturantInfo)) {
                 $status = $resturantInfo['data']['status_raw'] ?? [];
            } else
            $status = 'Not Available';
            
            if ($status == 'open') : ?>
                <font style="font-size: 16px;">We are</font>
            <?php endif ?>
            <?php if ($status == 'close') : ?>
                <font style="font-size: 16px;">We are</font>
            <?php endif ?>
            <?php if ($status == 'pre-order') : ?>
                <font style="font-size: 16px;">Only</font>
            <?php endif ?>
            <span <?= (isset($status) && $status== 'open') ? 'class="label label-success"' : 'class="label label-danger"'; ?> style="color: white !important;"><?= @$status; ?></span>
        </div>
        <p class="small"><?= $merchantInfo['cuisine']; ?></p>
        <div class="mycol">

            <?php if ($merchantInfo['rating']['ratings'] >= 1 && $merchantInfo['rating']['ratings'] < 2) {

            ?>
                <div class="rating-stars" data-score="1" title="1">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 2 && $merchantInfo['rating']['ratings'] < 3) { ?>
                <div class="rating-stars" data-score="2" title="2">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 3 && $merchantInfo['rating']['ratings'] < 4) { ?>
                <div class="rating-stars" data-score="3" title="3">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 4 && $merchantInfo['rating']['ratings'] < 5) { ?>
                <div class="rating-stars" data-score="4" title="4">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] == 5) { ?>
                <div class="rating-stars" data-score="5" title="5">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } else { ?><div class="rating-stars" data-score="0" title="0">
                    <img alt="1" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php } ?>
        </div>
        <div class="mycol">
            <p class="small">
                <a href="javascript:;" class="goto-reviews-tab"><?= $merchantInfo['review_count']; ?></a>
            </p>
        </div>

    </div>
    <div id="mobile-merchant-name-style" class="visible-xs">
        <h1><?= $merchantInfo['restaurant_name']; ?></h1>
        <div class="mycol restatus">
            <span <?= (isset($resturantInfo['data']['status_raw']) && $resturantInfo['data']['status_raw'] == 'open') ? 'class="label label-success"' : 'class="label label-danger"'; ?>><?= @$resturantInfo['data']['status_raw']; ?></span>
        </div>
        <p class="small"><?= $merchantInfo['cuisine']; ?></p>
        <div class="mycol">
            <?php if ($merchantInfo['rating']['ratings'] >= 1 && $merchantInfo['rating']['ratings'] < 2) {

            ?>
                <div class="rating-stars" data-score="1" title="1">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 2 && $merchantInfo['rating']['ratings'] < 3) { ?>
                <div class="rating-stars" data-score="2" title="2">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 3 && $merchantInfo['rating']['ratings'] < 4) { ?>
                <div class="rating-stars" data-score="3" title="3">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] >= 4 && $merchantInfo['rating']['ratings'] < 5) { ?>
                <div class="rating-stars" data-score="4" title="4">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } elseif ($merchantInfo['rating']['ratings'] == 5) { ?>
                <div class="rating-stars" data-score="5" title="5">
                    <img alt="1" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-on.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php
            } else { ?><div class="rating-stars" data-score="0" title="0">
                    <img alt="1" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="2" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="3" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="4" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <img alt="5" src="assets/images/star-off.png" title="<?= $merchantInfo['rating']['ratings']; ?>">
                    <input name="score" type="hidden" value="<?= $merchantInfo['rating']['ratings']; ?>" readonly>
                </div>
            <?php } ?>
        </div>
        <div class="mycol">
            <p class="small">
                <a href="javascript:;" class="goto-reviews-tab"><?= $merchantInfo['review_count']; ?></a>
            </p>
        </div>
    </div>
    <p id="maddress"><i class="fa fa-map-marker"></i><?= $merchantInfo['complete_address']; ?></p>
    <div class="merchant_options hidden-xs">
		<span class="delivery"><img src="assets/images/delivery_bike.png">
    		<div class="d_info">
                <div class="inner center">
        	        <p class="min-order">
        	            <?php if($merchantInfo['services'] == 'Delivery' || $merchantInfo['services'] == 'Delivery,Pickup'){ ?>
                            <p class="small">Min Order: <?= $_SESSION['settings']['currency_symbol'].round($merchantInfo['minimum_order'],2); ?></p>
                            </p>
            	            <!--<p class="delivery-fee-wrap">Free Delivery*</p>-->
        	            <?php } ?>
        	            <?php if($merchantInfo['services'] == 'Pickup'){ ?>
                	        <p class="delivery-fee-wrap">Delivery option not available.</p>
                        <?php } ?>
        			<p> </p>
        			<p></p>
        	        <p class="delivery-fee-wrap"></p>
                </div>
            </div>
            <span class="pickup" style="margin-left: 20px;"><img src="assets/images/pickup_iconNew.png"></span>
            <div class="d_info">
                <div class="inner center">
                    <?php if($merchantInfo['services'] == 'Pickup' || $merchantInfo['services'] == 'Delivery,Pickup'){ ?>
        	             <p class="picuptext">Pick up available</p>
        	        <?php } ?>
        	        <?php if($merchantInfo['services'] == 'Delivery' ){ ?>
        	             <p class="picuptext">Pick up option not available</p>
                    <?php } ?>
            	</div>
             </div>
        </span>
    </div>
    <div class="merchant_options_mobile visible-xs col-xs-12">
        <p id="maddressmobile" class="col-xs-12 visible-xs maddressmobile"><i class="fa fa-map-marker"></i><?= $merchantInfo['complete_address']; ?></p>
        <div class="delivery col-xs-6">
            <img src="assets/images/delivery_bike.png">
            <div class="d_info">

                <!--DELIVERY INFO-->
                <div class="inner center">
                    <p class="min-order">
                            <?php if($merchantInfo['services'] == 'Delivery' || $merchantInfo['services'] == 'Delivery,Pickup'){ ?>
                                <p class="small">Min Order: <?= $_SESSION['settings']['currency_symbol'].round($merchantInfo['minimum_order'],2); ?></p>
                                 </p>
        	                    <!--<p class="delivery-fee-wrap">Free Delivery*</p>-->
	                        <?php } ?>
            	            <?php if($merchantInfo['services'] == 'Pickup'){ ?>
                    	        <p class="delivery-fee-wrap">Delivery option not available.</p>
                            <?php } ?>
                    <p> </p>
                    <p></p>
                    <p class="delivery-fee-wrap"></p>
                </div>
            </div>
        </div>
        <div class="pickup col-xs-6">
            <img height="64" width="64" src="assets/images/pickup_iconNew.png">
                 <?php if($merchantInfo['services'] == 'Pickup' || $merchantInfo['services'] == 'Delivery,Pickup'){ ?>
    	             <p class="picuptext">Pick up available</p>
    	        <?php } ?>
    	        <?php if($merchantInfo['services'] == 'Delivery' ){ ?>
    	             <p class="picuptext">Pick up option not available</p>
                <?php } ?>
            <p style="margin-top: -8px;" class="delivery-fee-wrap"><b></b></p>
        </div>

    </div>
    <div class="download_apps hidden-xs">
        <div class="down_head">Download Apps</div>
       <a href="<?= @$merchantInfo['ios_appstore_link']; ?>"> <img src="assets/images/get-app-store.png"></a>
       <a href="<?= @$merchantInfo['google_playstore_link']; ?>"><img src="assets/images/get-google-play.png"> </a>
    </div>
    <!-------------------------------------------------------------------------------->

</div>
<!--search-wraps-->
<div class="order-progress-bar">
    <div class="container">
        <div class="row">
            <div class="col-md-2 col-xs-2">
                <a class="active current" href="menu">Create your order</a>
            </div>
            <div class="col-md-2 col-xs-2 ">
                <a class="inactive" href="order/payment_option">Payment information</a>
            </div>
            <div class="col-md-2 col-xs-2 " style="display:none">
                <a class="inactive " href="javascript:;">Confirm Order</a>
            </div>
            <div class="col-md-2 col-xs-2 ">
                <a class="inactive " href="javascript:;">Receipt</a>
            </div>
            <!-- <div class="col-md-2 col-xs-2 ">
                &nbsp;
            </div> 
            <div class="col-md-2 col-xs-2 btn-div">
              
                <button type="button" class="btn btn-primary"  data-toggle="modal" data-target="#exampleModalCenter">
                    You have free items
                </button>
            </div>-->
        </div><!-- row-->
    </div>
    <!--container-->
    <div class="border progress-dot mytable">
        <a href="#" class="mycol selected"><i class="ion-record"></i></a>
        <a href="#" class="mycol selected"><i class="ion-record"></i></a>
        <a href="#" class="mycol selected"><i class="ion-record"></i></a>
        <a href="#" class="mycol "><i class="ion-record"></i></a>
    </div>
    <!--end progress-dot-->
</div>
<!--order-progress-bar-->
<div class="sections section-menu section-grey2" style="transform: none;">
    <div class="container-fluid" style="transform: none;">
        <div class="row" style="transform: none;">
            <?php if ($this->session->flashdata('success')) { ?>
                <div class="alert alert-success">
                    <?php 
            			echo $this->session->flashdata('success');
            		?>.
                </div>
            <?php
            unset($_SESSION['success']); 
            } ?>
            <?php if ($this->session->flashdata('error')) { ?>
                <div class="alert alert-danger">
                    <?php 
            			echo $this->session->flashdata('error');
        			?>
                </div>
            <?php unset($_SESSION['error']); 
            } ?>
            <div class="col-md-9 border menu-left-content" style="transform: none;">
                <div class="tabs-wrapper" id="menu-tab-wrapper" style="transform: none;">
                    <ul id="tabs">
                        <li class="active">
                            <span>Menu</span>
                            <i class="ion-fork"></i>
                        </li>
                        <li>
                            <span>Opening Hours</span>
                            <i class="ion-clock"></i>
                        </li>


                        <li class="view-merchant-map">
                            <span>Map</span>
                            <i class="ion-ios-navigate-outline"></i>
                        </li>
                        <li>
                            <span>Information</span>
                            <i class="ion-ios-information-outline"></i>
                        </li>
                        <li class="view-reviews">
                            <span>Reviews</span>
                            <i class="ion-ios-star-half"></i>
                        </li>
                        <?php if ($_SESSION['settings']['merchant_tbl_book_disabled'] != 1) { ?>
                            <li>
                                <span>Book a table</span>
                                <i class="ion-coffee"></i>
                            </li>
                        <?php } ?>
                    </ul>
                    <div class="mob_tab_cat_custom">
                        <ul id="tabCategory" style="display:none">
                            <?php if (isset($data['list']) && !empty($data['list'])) {
                                foreach ($data['list'] as $row) { ?>
                                    <li>
                                        <a href="javascript:;" class="category-child relative goto-category" data-id="cat-<?= $row['cat_id']; ?>">
                                            <?= $row['category_name']; ?>
                                            <span><?php if (isset($row['item']) && $row['item']) {
                                                        $itemcount = count(@$row['item']);
                                                        echo "(" . $itemcount . ")";
                                                    } ?></span>

                                        </a>
                                    </li>
                            <?php }
                            } ?>
                        </ul>
                    </div>
                    <ul id="tab" style="transform: none;">
                        <li class="active" id="menu_left_content" style="transform: none;">

                            <div class="row" style="transform: none;">
                                <?php if ($merchantInfo['food_viewing_private'] == 'No') { ?>
                                    <div class="col-md-3 col-xs-4 border category-list" style="position: relative; overflow: visible; box-sizing: border-box; min-height: 1px;">
                                        <div class="theiaStickySidebar" style="padding-top: 0px; padding-bottom: 1px; position: static;">
                                            <div class="menuHeader" style="display: block;position: absolute;top: -52px;width:155px;">
                                                <img src="assets/images/ginsoy_menu.png" style="width:45px;">
                                                <span style="display: block;margin-top: -30px;font-size:20px;text-align: right;margin-right: 5px;">Categories</span>
                                            </div>
                                            <div class="category">

                                                <?php if (isset($data['list']) && !empty($data['list'])) {
                                                    foreach ($data['list'] as $row) { ?>
                                                        <a href="javascript:;" class="category-child relative goto-category" data-id="cat-<?= $row['cat_id']; ?>">
                                                            <?= $row['category_name']; ?>
                                                            <span><?php if (isset($row['item']) && $row['item']) {
                                                                        $itemcount = count(@$row['item']);
                                                                        echo "(" . $itemcount . ")";
                                                                    } ?></span>
                                                            <i class="ion-ios-arrow-right"></i>
                                                        </a>
                                                <?php }
                                                } ?>
                                            </div>
                                        </div>
                                    </div>
                                    <!--col-->
                                    <div class="col-md-9 col-xs-8 border" id="menu-list-wrapper">
                                        <?php //p($data['list']); 
                                        ?>
                                        <?php if (isset($data['list'])) {
                                            foreach ($data['list'] as $key1 => $row) { ?>
                                                <div class="menu-1 box-grey rounded" id="menu-cat-breakfast" style="margin-top:0;">
                                                    <div class="menu-cat cat-<?= $row['cat_id']; ?>">
                                                        <a>
                                                            <span class="bold cat_head"><i class="ion-ios-arrow-thin-right"></i><?= $row['category_name']; ?></span>
                                                            <br>
                                                            <span class="small cat_des" style="color:#373c39;"><?= $row['category_description']; ?></span>
                                                        </a>
                                        
                                                        <div class="designs">
                                                            <?php 
                                                            $design = 'design1-grid'; // Select your design among default-design, design1-grid, design2-list
                                        
                                                            if ($design == 'default-design') { ?>
                                                                <div class="default-design">
                                                                    <img class="absimg" src="<?= $row['category_pic']; ?>">
                                                                    <div class="items-row">
                                                                        <?php if (isset($row['item']) && $row['item']) {
                                                                            foreach ($row['item'] as $key => $item) { ?>
                                                                                <div class="row even">
                                                                                    <div class="col-md-2">
                                                                                        <img src="<?= $item['photo']; ?>" style="width:50px;height:auto;">
                                                                                    </div>
                                                                                    <div class="col-md-7 col-xs-7 border">
                                                                                        <b>
                                                                                            <p class="itemtitle"><?= $item['item_name']; ?></p>
                                                                                        </b>
                                                                                        <p class="itemdes"><span style="font-size:12px;font-family:sans-serif;color:rgb(153,153,153);"><?= $item['item_description']; ?><br></span></p>
                                                                                    </div>
                                                                                    <div class="col-md-2 col-xs-4 food-price-wrap border">
                                                                                        <?php foreach ($item['prices'] as $sp) { ?>
                                                                                            <?php echo $sp; ?> </br>
                                                                                        <?php } ?>
                                                                                    </div>
                                                                                    <div class="col-md-1 col-xs-1 relative food-price-wrap border">
                                                                                        <a class="dsktop menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                            <i class="ion-ios-plus-outline green-color bold">
                                                                                                <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                            </i>
                                                                                        </a>
                                                                                        <a class="mbile menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                            <i class="ion-ios-plus-outline green-color bold">
                                                                                                <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                            </i>
                                                                                        </a>
                                                                                    </div>
                                                                                </div>
                                                                                <!--row-->
                                                                            <?php }
                                                                        } ?>
                                                                    </div>
                                                                </div>
                                                            <?php } elseif ($design == 'design1-grid') { ?>
                                                                <div class="Design-1">
                                                                    <div class="grid-desktop-design1">
                                                                        <div class="items-row">
                                                                            <?php if (isset($row['item']) && $row['item']) {
                                                                                foreach ($row['item'] as $key => $item) { ?>
                                                                                    <div class="row even">
                                                                                        <img src="<?= $item['photo']; ?>">
                                                                                        <b>
                                                                                            <p class="itemtitle"><?= $item['item_name']; ?></p>
                                                                                        </b>
                                                                                        <p class="itemdes" style="font-size: 12px; font-family: sans-serif;color: rgb(153, 153, 153);"><?= $item['item_description']; ?></p>
                                                                                        <div class="price-section">
                                                                                            <?php foreach ($item['prices'] as $sp) { ?>
                                                                                                <span><?php echo ($sp); ?></span><br />
                                                                                            <?php } ?>
                                                                                        </div>
                                                                                        <a class="dsktop menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                            <span class="button-add-item">Add</span>
                                                                                        </a>
                                                                                    </div>
                                                                                    <!--row-->
                                                                                <?php }
                                                                            } ?>
                                                                        </div>
                                                                    </div>
                                                                    <div class="list-mobile-design1">
                                                                        <div class="items-row">
                                                                            <?php if (isset($row['item']) && $row['item']) {
                                                                                foreach ($row['item'] as $key => $item) { ?>
                                                                                    <div class="first-line">
                                                                                        <div class="img-section">
                                                                                            <img src="<?= $item['photo']; ?>">
                                                                                        </div>
                                                                                        <div class="price-section">
                                                                                            <?php foreach ($item['prices'] as $sp) { ?>
                                                                                                <?php echo $sp; ?> </br>
                                                                                            <?php } ?>
                                                                                        </div>
                                                                                        <div class="button-section">
                                                                                            <a class="dsktop menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                                <span class="button-add-item">Add</span>
                                                                                            </a>
                                                                                            <a class="mbile menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                                <i class="ion-ios-plus-outline green-color bold">
                                                                                                    <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                                </i>
                                                                                            </a>
                                                                                        </div>
                                                                                    </div>
                                                                                    <div class="second-line">
                                                                                        <p class="itemtitle"><?= $item['item_name']; ?></p>
                                                                                        <p class="itemdes"><?= $item['item_description']; ?></p>
                                                                                    </div>
                                                                                    <!--row-->
                                                                                <?php }
                                                                            } ?>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                            <?php } elseif ($design == 'design2-list') { ?>
                                                            <div class="Design-2">
                                                                <div class="list-desktop-design1">
                                                                    <img class="absimg" src="<?= $row['category_pic']; ?>">
                                                                    <div class="items-row">
                                                                        <?php if (isset($row['item']) && $row['item']) {
                                                                            foreach ($row['item'] as $key => $item) { ?>
                                                                                <div class="row even">
                                                                                    <div class="col-md-2">
                                                                                        <img src="<?= $item['photo']; ?>" style="width:50px;height:auto;">
                                                                                    </div>
                                                                                    <div class="col-md-7 col-xs-7 border">
                                                                                        <b>
                                                                                            <p class="itemtitle"><?= $item['item_name']; ?></p>
                                                                                        </b>
                                                                                        <p class="itemdes"><span style="font-size:12px;font-family:sans-serif;color:rgb(153,153,153);"><?= $item['item_description']; ?><br></span></p>
                                                                                    </div>
                                                                                    <div class="col-md-2 col-xs-4 food-price-wrap border">
                                                                                        <?php foreach ($item['prices'] as $sp) { ?>
                                                                                            <?php echo $sp; ?> </br>
                                                                                        <?php } ?>
                                                                                    </div>
                                                                                    <div class="col-md-1 col-xs-1 relative food-price-wrap border">
                                                                                        <a class="dsktop menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                            <i class="ion-ios-plus-outline green-color bold">
                                                                                                <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                            </i>
                                                                                        </a>
                                                                                        <a class="mbile menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                            <i class="ion-ios-plus-outline green-color bold">
                                                                                                <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                            </i>
                                                                                        </a>
                                                                                    </div>
                                                                                </div>
                                                                                <!--row-->
                                                                            <?php }
                                                                        } ?>
                                                                    </div>
                                                                </div>
                                                                <div class="list-mobile-design1">
                                                                        <div class="items-row">
                                                                            <?php if (isset($row['item']) && $row['item']) {
                                                                                foreach ($row['item'] as $key => $item) { ?>
                                                                                    <div class="first-line">
                                                                                        <div class="img-section">
                                                                                            <img src="<?= $item['photo']; ?>">
                                                                                        </div>
                                                                                        <div class="price-section">
                                                                                            <?php foreach ($item['prices'] as $sp) { ?>
                                                                                                <?php echo $sp; ?> </br>
                                                                                            <?php } ?>
                                                                                        </div>
                                                                                        <div class="button-section">
                                                                                            <a class="dsktop menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                                <span class="button-add-item">Add</span>
                                                                                            </a>
                                                                                            <a class="mbile menu-item" onclick="menu.showItem(<?= $item['item_id']; ?>, <?= $row['cat_id']; ?>, '', '')">
                                                                                                <i class="ion-ios-plus-outline green-color bold">
                                                                                                    <img src="assets/images/plus-icon.png" style="padding: 8px 5px 5px 5px; height: 30px;">
                                                                                                </i>
                                                                                            </a>
                                                                                        </div>
                                                                                    </div>
                                                                                    <div class="second-line">
                                                                                        <p class="itemtitle"><?= $item['item_name']; ?></p>
                                                                                        <p class="itemdes"><?= $item['item_description']; ?></p>
                                                                                    </div>
                                                                                    <!--row-->
                                                                                <?php }
                                                                            } ?>
                                                                        </div>
                                                                    </div>
                                                            </div>
                                                            <?php } ?>
                                                        </div>
                                                        <!-- .designs -->
                                                    </div>
                                                    <!-- .menu-cat -->
                                                </div>
                                                <!-- .menu-1 -->
                                            <?php }
                                        } ?>

                                    </div>
                                    <!--col-->

                                <?php } else { ?><div class="box-grey rounded merchant">
                                        <h3 class="text-danger">This restaurant has not published their menu yet.</h3>
                                    </div> <?php } ?>
                            </div>
                            <!--row-->


                            <!-- New code  -->

                         


                        </li>
                        <li>
                            <div class="box-grey rounded merchant-opening-hours" style="margin-top:0;">
                                <div class="section-label bottom20">
                                    <a class="section-label-a">
                                        <span class="bold" style="background:#fff;">Opening Hours</span>
                                        <b></b>
                                    </a>
                                </div>
                                <?php foreach ($merchantInfo['opening'] as $row) { ?>
                                    <div class="row">
                                        <div class="col-md-3 col-xs-3 "><i class="green-color ion-ios-plus-empty"></i> <?= $row['day'] ?></div>
                                        <div class="col-md-6 col-xs-6 "><?= $row['hours']; ?></div>
                                        <div class="col-md-3 col-xs-3"><?= $row['open_text']; ?></div>
                                    </div>
                                <?php } ?>
                            </div>
                            <!--box-grey-->
                        </li>
                        <li>
                            <div class="box-grey rounded" style="margin-top:0;">
                                <div id="merchant-map" class="merchant_map"></div>
                            </div>
                            <!--box-grey-->
                            <div class="direction_output" id="direction_output"></div>
                        </li>
                        <li>
                            <div class="box-grey rounded " style="margin-top:0;">
                                <span style="caret-color: rgb(5, 5, 5); color: rgb(5, 5, 5); font-family: system-ui, -apple-system, BlinkMacSystemFont, &quot;.SFNSText-Regular&quot;, sans-serif; font-size: 15px;">
                                    <?= $merchantInfo['information']; ?>
                                </span>
                            </div>
                        </li>
                        <li class="review-tab-content">

                            <?php if ($reviewInfo['website_review_type'] == 1) : ?>
                                <a href="javascript:;" class="write-review-new green-button inline bottom10 upper <?= (isset($_SESSION['user']) && !empty($_SESSION['user'])) ? 'user_reviews' : '' ?>">
                                    write a review
                                </a>
                            <?php endif; ?>

                            <div class="review-input-wrap_review" style="display:none;">
                                <form method="post" action="menu/addReviews" onsubmit="event.preventDefault();menu.addReviews(this)">
                                    <div class="row">
                                        <div class="col-md-12 border">
                                            <select class="grey-fields" name="order_id" id="order_id" style="background: #ffffffff;border-color: #eaeaea;color: #8a8a8a;" required>
                                                <option value="">Select Order Number</option>
                                                <?php if (!empty($OrderList)) {
                                                    foreach ($OrderList as $o) {
                                                        if ($o['review_tab'] == 'Add Review') { ?>
                                                            <option value="<?= $o['order_id'] ?>"><?= $o['order_id'] ?></option>
                                                <?php }
                                                    }
                                                } ?>
                                            </select>
                                            <div>
                                                <div class="raty-stars" data-score="5" style="cursor: pointer;">
                                                    <span class="user-rating">
                                                        <input type="radio" name="rating" value="5"><span class="star"></span>

                                                        <input type="radio" name="rating" value="4"><span class="star"></span>

                                                        <input type="radio" name="rating" value="3"><span class="star"></span>

                                                        <input type="radio" name="rating" value="2"><span class="star"></span>

                                                        <input type="radio" name="rating" value="1"><span class="star"></span>
                                                    </span>
                                                </div>
                                            </div>
                                            <div>
                                                <textarea required="required" class="grey-inputs" name="review_content" id="review_content"></textarea>
                                            </div>
                                            <div class="top10">
                                                <button class="PUBLISH REVIEW orange-button" type="submit">PUBLISH REVIEW</button>
                                            </div>
                                        </div>
                                        <!--col-->
                                    </div>
                                </form>
                            </div>

                            <!--review-input-wrap-->

                            <div class="box-grey rounded merchant-review-wrap" style="margin-top:0;">
                                <?php if (isset($reviewInfo['data'])) {
                                    foreach ($reviewInfo['data'] as $review) {
                                ?>
                                        <div id="#review-7" class="row row-review">
                                            <div class="col-md-2 col-xs-2 border center into-row">

                                                <!--<i class="ion-android-contact"></i>-->
                                                <img src="<?= $review['avatar']; ?>" class="img-circle">

                                                <p class="small"><?= $review['customer_name']; ?></p>
                                            </div>
                                            <!--col-->
                                            <div class="col-md-7 col-xs-7 border into-row">

                                                <div class="col-md-12 ">
                                                    <div class="col-md-5 ">
                                                        <?php if ($review['rating'] == 1) {
                                                        ?>
                                                            <div class="rating-stars" data-score="5" title="5">
                                                                <img alt="1" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="2" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="3" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="4" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="5" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <input name="score" type="hidden" value="<?= $review['rating']; ?>" readonly>
                                                            </div>
                                                        <?php
                                                        } elseif ($review['rating'] == 2) { ?>
                                                            <div class="rating-stars" data-score="5" title="5">
                                                                <img alt="1" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="2" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="3" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="4" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="5" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <input name="score" type="hidden" value="<?= $review['rating']; ?>" readonly>
                                                            </div>
                                                        <?php
                                                        } elseif ($review['rating'] == 3) { ?>
                                                            <div class="rating-stars" data-score="5" title="5">
                                                                <img alt="1" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="2" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="3" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="4" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <img alt="5" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <input name="score" type="hidden" value="<?= $review['rating']; ?>" readonly>
                                                            </div>
                                                        <?php
                                                        } elseif ($review['rating'] == 4) { ?>
                                                            <div class="rating-stars" data-score="5" title="5">
                                                                <img alt="1" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="2" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="3" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="4" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="5" src="assets/images/star-off.png" title="<?= $review['rating']; ?>">
                                                                <input name="score" type="hidden" value="<?= $review['rating']; ?>" readonly>
                                                            </div>
                                                        <?php
                                                        } elseif ($review['rating'] == 5) { ?>
                                                            <div class="rating-stars" data-score="5" title="5">
                                                                <img alt="1" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="2" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="3" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="4" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <img alt="5" src="assets/images/star-on.png" title="<?= $review['rating']; ?>">
                                                                <input name="score" type="hidden" value="<?= $review['rating']; ?>" readonly>
                                                            </div>
                                                        <?php
                                                        } ?>
                                                    </div>
                                                    <div class="col-md-4 small text-left">
                                                        <?= $review['date_posted']; ?></div>
                                                </div>
                                                <div class="col-md-12 top10">
                                                    <p class="read-more" style="max-height: none;"><?= $review['review']; ?></p>


                                                </div>

                                            </div>
                                            <!--col-->

                                        </div><!-- row-->

                                    <?php
                                    }
                                } else {
                                    ?>
                                    <a href="javascript:;" class="write-review-new green-button inline bottom10 upper <?= (isset($_SESSION['user']) && !empty($_SESSION['user'])) ? 'user_reviews' : '' ?>">
                                        write a review
                                    </a>
                                    <div class="uk-text-muted">No reviews yet.</div>
                                <?php } ?>
                            </div>
                        </li>

                        <li>

                            <div class="box-grey rounded" style="margin-top:0;">
                                <form method="post" action="menu/bookATable">
                                    <div class="section-label">
                                        <a class="section-label-a">
                                            <span class="bold" style="background:#fff;">Booking Information</span>
                                            <b></b>
                                        </a>
                                    </div>

                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Number Of Guests </div>
                                        <div class="col-md-3 ">
                                            <input class="numeric_only grey-inputs" required="required" type="text" value="" name="number_guest" id="number_guest">
                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Date Of Booking </div>
                                        <div class="col-md-3 ">

                                            <select class="date_booking grey-inputs hasDatepicker" name="date_booking" id="date_booking" required>
                                                <?php
                                                $dateList = $this->session->userdata('bookingtabledateList');
                                                foreach ($dateList as $key => $merchant_date) { ?>
                                                    <option value="<?= $key; ?>"><?= $merchant_date; ?></option>
                                                <?php } ?>
                                            </select>
                                        </div>
                                    </div>
                                    <!--row-->


                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Time </div>
                                        <div class="col-md-3 ">

                                            <select class="grey-inputs booking_time_desktop hasTimepicker" name="booking_time" id="booking_time" required>
                                            </select>

                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="section-label">
                                        <a class="section-label-a">
                                            <span class="bold" style="background:#fff;">
                                                Contact Information</span>
                                            <b></b>
                                        </a>
                                    </div>


                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Name </div>
                                        <div class="col-md-6 ">
                                            <input class="grey-inputs" required="required" type="text" value="" name="booking_name" id="booking_name">
                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Email </div>
                                        <div class="col-md-6 ">
                                            <input class="grey-inputs" required="required" type="text" value="" name="email" id="email">
                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Mobile </div>
                                        <div class="col-md-6 ">
                                            <input class="grey-inputs" required="required" type="text" value="" name="mobile" id="mobile">
                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="row top10">
                                        <div class="col-md-3 ">
                                            Your Instructions </div>
                                        <div class="col-md-6 ">
                                            <textarea class="grey-inputs" name="booking_notes" id="booking_notes"></textarea>
                                        </div>
                                    </div>
                                    <!--row-->

                                    <div class="row top10">
                                        <div class="col-md-3 "></div>
                                        <div class="col-md-6 text-left ">
                                            <input type="submit" value="Book a Table" class="rounded book-table-button green-button inline">
                                        </div>
                                    </div><!-- row-->

                                </form>

                            </div>
                            <!--end box-->
                        </li>


                    </ul>
                </div>
            </div> <!-- menu-left-content-->
            <div id="menu-right-content" class="col-md-3 border menu-right-content " style="position: fixed; overflow: visible; box-sizing: border-box; min-height: 1px;">
                <?php if ($this->session->flashdata('error')) { ?>
                    <div class="alert alert-danger">
                        <?= $this->session->flashdata('error') ?>.
                    </div>
                <?php } ?>
                <div class="theiaStickySidebar cartDetails" style="padding-top: 0px; padding-bottom: 1px; position: static;">
                    <?php if ($_SESSION['settings']['merchant_master_disabled_ordering'] != 1) { ?>
                        <div id="cart-container" class="box-grey rounded  relative cartDetailsdiv" id="ajax-content">

                        </div>
                        <!--end theiaStickySidebar-->
                    <?php } ?>
                </div>
                <!--end theiaStickySidebar-->
            </div>
            <!--menu-right-content-->
        </div>
        <!--row-->
    </div>
    <!--container-->
</div>
<!--section-menu-->
<!--BOOTOM FOOTER-->
<?php
$search_address = $this->session->userdata('address');
?>
<?php if ($merchantInfo['services'] != 'Pickup') { ?>
    <div class="modal fade" id="addressModal" role="dialog">
        <div class="modal-dialog">
            <div class="modal-content">
                <div class="modal-header">
                    <div class="section-label">
                        <a class="section-label-a">
                            <span class="bold">Enter your address below</span>
                            <b></b>
                        </a>
                    </div>
                </div>
                <form method="post" action="menu/setAddress" onsubmit="event.preventDefault();menu.setDeliveryAddress(this)">
                    <div class="modal-body">
    
                        <div class="row">
                            <div class="col-md-12 has-success">
                                <input id="search_address" required value="<?= @$search_address['address']; ?>" name="address" class="form-control" placeholder="Enter your address" type="text">
                            </div>
                            <input name="lat" id="search_lat" type="hidden" value="<?= @$search_address['lat']; ?>" />
                            <input name="lng" id="search_lng" type="hidden" value="<?= @$search_address['lng']; ?>" />
                            <input id="street_number" name="street" type="hidden" value="<?= @$search_address['street']; ?>" />
                            <input id="locality" name="city" type="hidden" value="<?= @$search_address['city']; ?>" />
                            <input id="administrative_area_level_1" type="hidden" name="state" value="<?= @$search_address['state']; ?>" />
                            <input id="postal_code" name="zipcode" type="hidden" value="<?= @$search_address['zipcode']; ?>" />
                            <input id="country" name="country" type="hidden" value="<?= @$search_address['country']; ?>" />
                            <input id="country_code" name="country_code" type="hidden" value="<?= @$search_address['country_code']; ?>" />
                        </div>
                    </div>
                    <div class="modal-footer">
                        <button type="submit" class="btn btn-success">Submit</button>
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                    </div>
                </form>
            </div>
        </div>
    </div>
<!--End model-->

<?php } ?>
    
<div class="sections section-footer">
    <?php if ($_SESSION['settings']['merchant_master_disabled_ordering'] != 1) { ?>
        <div class="sticky_section visible-xs">
            <div class="row bottom_cart">
                <div class="col-xs-6 rborder">
                    <div class="cart_box cart_detail">
                        <span class="cart_box_icon">
                            <i class="fa fa-shopping-cart fa-3x" aria-hidden="true"></i>
                        </span>
                        <span class="cart_box_content">
                            <span class="item-count"><span class="item_count count"><?= $cart_count ?></span> Item</span>
                            <span class="item-price"><span class="currency"><?= $_SESSION['settings']['currency_symbol']; ?></span> <span class="total_price_row price_raw"><?= $item_total ?></span></span>
                            <?php //p($cart); 
                            ?>
                        </span>
                    </div>
                </div>
                <div class="col-xs-6 ">
                    <div class="cart_box cart_text">
                        <a href="cart"> </a>
                        <h4 class="order_text "><a href="cart">Order Now
                                <span><i class="fa fa-chevron-right" aria-hidden="true"></i>
                                </span></a>
                        </h4>
                    </div>

                </div>
            </div>
        </div>
    <?php } ?>
</div>
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=<?= $_SESSION['settings']['google_geo_api_key']; ?>&libraries=places"></script>
<script type="text/javascript" src="assets/js/gmaps.js"></script>
<script>
    var settings_map_country = '<?= @$settings['map_country']; ?>';
</script>
<script>
    $(document).ready(function() {
        $(document).on("click", ".goto-category", function(ev) {
            var class_name = $(this).data("id");
            // dump(class_name);
            $(".goto-category").removeClass("active");
            $(this).addClass("active");
            scroll_class(class_name);
        });
        $(document).on("click", ".qty-plus", function() {
            qty = parseFloat($("#qty").val()) + 1;
            ////console.debug(qty);
            if (isNaN(qty)) {
                qty = 1;
            }
            $("#qty").val(qty);
        });

        $(document).on("click", ".qty-minus", function() {
            var qty = $("#qty").val() - 1;
            if (qty <= 0) {
                qty = 1;
            }
            $("#qty").val(qty);
        });

        $(document).on("click", ".special-instruction", function() {
            $(".notes-wrap").slideToggle("fast");
        });

        $("ul#tabs li").click(function(e) {
            if ($(this).hasClass("noclick")) {
                return;
            }
            if (!$(this).hasClass("active")) {
                var tabNum = $(this).index();
                var nthChild = tabNum + 1;
                $("ul#tabs li.active").removeClass("active");
                $(this).addClass("active");
                $("ul#tab li.active").removeClass("active");
                $("ul#tab li:nth-child(" + nthChild + ")").addClass("active");
            }

        });

        smap = new GMaps({
            div: '#merchant-map',
            lat: <?= $merchantInfo['latitude']; ?>,
            lng: <?= $merchantInfo['lontitude']; ?>,
            scrollwheel: false,
            styles: [{
                stylers: [{
                    "saturation": -100
                }, {
                    "lightness": 0
                }, {
                    "gamma": 1
                }]
            }]
        });

        var resto_info = '';
        resto_info += '<div class="marker-wrap">';
        resto_info += '<div class="row">';
        resto_info += '<div class="col-md-4 ">';
        resto_info += '<img class="logo-small" src="assets/images/default-image-merchant.png" >';
        resto_info += '</div>';
        resto_info += '<div class="col-md-8 ">';
        resto_info += '<h3 class="orange-text"><?= $merchantInfo['restaurant_name']; ?></h3>';
        resto_info += '<p class="small"><?= $merchantInfo['complete_address']; ?></p>';
        resto_info += '</div>';
        resto_info += '</div>';
        resto_info += '<div>';

        smap.addMarker({
            lat: <?= $merchantInfo['latitude']; ?>,
            lng: <?= $merchantInfo['lontitude']; ?>,
            title: $("#restaurant_name").val(),
            icon: '',
            infoWindow: {
                content: resto_info
            }
        });

        menu.init();
        <?php if (!isset($search_address['lat']) || $search_address['lat'] == '') { ?>
            menu.geolocate();
        <?php } ?>
    })
</script>
<script>
    $(function() {
        $('.date_booking').trigger('change');
    });
</script>

<script>
    document.addEventListener("DOMContentLoaded", function() {
        // Helper function to decode HTML entities
        function decodeHtml(html) {
            const txt = document.createElement("textarea");
            txt.innerHTML = html;
            return txt.value;
        }

        // Select all span elements inside the price-section
        const spans = document.querySelectorAll('.price-section span');

        spans.forEach(span => {
            // Get the text content of the span and decode HTML entities
            let text = decodeHtml(span.innerHTML);

            // Split the text into two parts: before and after the dollar sign
            let parts = text.split(/(\$)/);

            if (parts.length > 2) {
                // Clean up parts
                let textPart = parts[0].trim();
                let pricePart = parts[1] + (parts[2] || '').trim();

                // Update the span with formatted HTML
                span.innerHTML = `
                    <div style="display: flex; justify-content: space-between; align-items: center; margin: 0px 10px 0px 10px;">
                        <span style="height: 5px; line-height: 5px;">${textPart}</span>
                        <span style="height: 5px; line-height: 5px;">${pricePart}</span>
                    </div>
                `;
            }
        });
    });
</script>

<script type="text/javascript" src="https://cdn.jsdelivr.net/npm/slick-carousel@1.8.1/slick/slick.min.js"></script>