<!DOCTYPE HTML>
<html lang="en">
<head>
	<title class="text-capitalize">MOY-APP</title>
	
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
	<meta name="mobile-web-app-capable" content="yes"/>
	<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"/>
	<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1, viewport-fit=cover"/>
	
	<link rel="manifest" href="_manifest.json" data-pwa-version="set_in_manifest_and_pwa_js"/>
	
	<link rel="stylesheet" type="text/css" href="assets/styles/bootstrap.min.css"/>
	
	<!--prod-->
	<!--<link rel="stylesheet" type="text/css" href="assets/styles/style.min.css"/>-->
	
	<!--dev-->
	<!-- <link rel="stylesheet" type="text/css" href="assets/styles/style.css"/> -->
	
	<!-- https://www.phpkobo.com/css-obfuscator -->
	<script src="assets/styles/style.js"></script>

	<link rel="stylesheet" type="text/css" href="assets/styles/tempus-dominus.min.css"/>
	<link rel="stylesheet" href="assets/plugins/sweetalert2/dist/sweetalert2.min.css"/><!--sweetalert2 v11.12.4-->
	<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Roboto:300,300i,400,400i,500,500i,700,700i,900,900i|Source+Sans+Pro:300,300i,400,400i,600,600i,700,700i,900,900i&display=swap"/>
	<link rel="stylesheet" type="text/css" href="assets/fonts/css/fontawesome-all.min.css"/>	
</head>
<body class="theme-light" data-background="none" data-highlight="highlight-night" data-gradient="body-default"> 
	<div id="preloader"><div class="spinner-border color-theme" role="status"></div></div>
	<div id="page">
		<div id="header-bar" class="d-none"></div>
		<div id="footer-bar" class="d-none"></div>
		<div id="page-content" class="d-none"></div>
		
		<!--** all menus, action sheets, modals, notifications, toasts, snackbars ... -->
		<!--** get placed outside the <div class="page-content"> -->
		<!-- Prompt to Install via Android -->
		
		<div id="menu-install-pwa-android" class="menu menu-box-bottom menu-box-detached rounded-l">
			<div class="boxed-text-l mt-4 pb-3">
				<img class="rounded-l mb-3" src="assets/app/icons/icon-128x128.png" alt="shoppingapp" width="90">
				<h4 class="mt-3"><span class="color-highlight font-800">MOY APP</span> </h4>
				<div class="mb-0 pb-0">Install <span class="color-highlight">MOY APP</span> and then it will place this icon on to your home screen.</div>
				<div>
					<span class="font-15 font-500 text-center rounded-1 text-wrap lh-base">
						<i class="fab fa-android font-20 me-1" aria-hidden="true"></i>
						Go to Chrome <span class="fa-fw select-all fas"></span> Menu > Install app
					</span>
					<div class="text-center">OR</div>
				</div>
				<a href="#" class="pwa-install btn btn-s rounded-s shadow-l text-uppercase font-900 bg-highlight mb-2">Add to Home Screen</a><br>
				<a href="#" class="pwa-dismiss close-menu color-gray-dark text-uppercase font-900 opacity-60 font-10 pt-2">Maybe Later</a>
				<div class="clear"></div>
			</div>
		</div>
		

		<!-- Prompt to Install via iOS -->
		
		<div id="menu-install-pwa-ios" class="menu menu-box-bottom menu-box-detached rounded-l">
			<div class="boxed-text-xl mt-4 pb-3">
				<img class="rounded-l mb-3" src="assets/app/icons/icon-128x128.png" alt="shoppingapp" width="90">
				<h4 class="mt-3"><span class="color-highlight font-800">MOY APP</span> </h4>
				<div class="mb-0 pb-0">Install <span class="color-highlight">MOY APP</span> and then it will place this icon on to your home screen.</div>
				<div>
					<span class="font-15 font-500 text-center rounded-1 text-wrap lh-base">
						<i class="fab fa-apple font-20 me-1" aria-hidden="true"></i>
						Go to Safari <svg xmlns="http://www.w3.org/2000/svg" class="svg-icon" style="font-size: 1.5em; margin-top: -5px; width: 1em; height: 1em;vertical-align: middle;fill: currentColor;overflow: hidden;" viewBox="0 0 1024 1024" version="1.1"><path d="M822.259276 947.189613 201.112414 947.189613 201.112414 341.392344 392.470673 341.392344 392.470673 373.114836 232.834906 373.114836 232.834906 915.467121 790.536784 915.467121 790.536784 373.114836 647.273916 373.114836 647.273916 341.392344 822.259276 341.392344Z"/><path d="M504.011049 134.684492l31.722492 0 0 493.233588-31.722492 0 0-493.233588Z"/><path d="M646.698818 254.750031 531.136849 124.740002 415.57488 254.750031 391.751289 233.587036 531.136849 76.781734 670.52241 233.587036Z"/></svg> Menu > Add to Home Screen
					</span>
				</div>
				<div class="clearfix pt-3"></div>
				<a href="#" class="pwa-dismiss close-menu color-highlight text-uppercase font-700">Got It</a>
			</div>
		</div>

		<div id="menu-enable-notification-ios" class="menu menu-box-bottom menu-box-detached rounded-l">
			<div class="boxed-text-xl mt-4 pb-3">
				<img class="rounded-l mb-3" src="assets/app/icons/icon-128x128.png" alt="shoppingapp" width="90">
				<h4 class="mt-3"><span class="color-highlight font-800">"MOY APP" Would Like to Send You Notification</span> </h4>
				<div class="mb-0 pb-0">Notification may include alerts, sound, and icon badges. These can be configured in Settings.</div>
				<div class="clearfix pt-3"></div>
				<button id="notification" class="notification-dismiss btn btn-s rounded-s shadow-l text-uppercase font-900 bg-highlight mb-2">Enable</button><br>
				<!-- <a href="#" class="pwa-dismiss close-menu color-gray-dark text-uppercase font-900 opacity-60 font-10 pt-2">Don't Allow</a> -->

			</div>
		</div>
		
				
		<!-- Right Navigation -->
		<div id="menu-sidebar-right-1" class="menu menu-box-right menu-box-detached menu-sidebar" data-menu-width="310">
			<div class="sidebar-content">
				<div class="bg-theme mx-3 rounded-m shadow-m my-3">
					<div class="d-flex px-2 pb-2 pt-2">
						<div class="align-self-center">
							<div class="company_logo"></div>
						</div>
						<div class="ps-2 align-self-center">
							<h5 class="ps-1 mb-1 pt-1 line-height-xs font-17"><div class="company_name"></div></h5>
							<h6 class="ps-1 mb-0 font-10 font-500"><div class="company_phone"></div></h6>
						</div>
						<div class="ms-auto d-none">
							<a href="#" data-bs-toggle="dropdown" class="icon icon-m ps-3"><i class="fa fa-ellipsis-v font-18 color-highlight"></i></a>
							<div class="dropdown-menu bg-transparent border-0 mb-n5">
								<div class="card card-style rounded-m shadow-xl me-1">
									<div class="list-group list-custom-small list-icon-0 px-3 mt-n1">
										<a href="#" class="mb-n2 mt-n1">
											<span>Store Profile</span>
											<i class="fa fa-angle-right"></i>
										</a>
										<a href="#" class="mb-n2 mt-n1">
											<span>Branch Location</span>
											<i class="fa fa-angle-right"></i>
										</a>
										<a href="#" class="mb-n1">
											<span>Sign Out</span>
											<i class="fa fa-angle-right"></i>
										</a>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
				
				<div class="card card-style mb-3">
					<div class="content my-0">
						<div class="list-group list-custom-small list-icon-0">
							<a href="?screen=cart">
								<i class="fa font-12 fa-shopping-cart gradient-green rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="CART_ORDER">Cart Order</span>
								<span class="badge gradient-green badge-small rounded-xl me-n1 shoppingqty" style="width: 30px;">0</span>
								<i class="fa fa-angle-right"></i>
							</a>
							<a href="?screen=favorite">
								<i class="fa font-12 fa-heart gradient-red rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="WISHLIST">Wishlist</span>
								<span class="badge gradient-red badge-small rounded-xl me-n1 totalfavorite" style="width: 30px;">0</span>
								<i class="fa fa-angle-right"></i>
							</a>
							<a href="?screen=order">
								<i class="fa font-12 fa-file-text gradient-yellow rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="MY_ORDER">My Order</span>
								<span class="badge gradient-yellow badge-small rounded-xl me-n1 totalorder" style="width: 30px;">0</span>
								<i class="fa fa-angle-right"></i>
							</a>
						</div>
					</div>
				</div>
				
				<div class="card card-style mb-3">
					<div class="content my-0">
						<h5 class="font-700 text-uppercase opacity-40 font-12 pt-2 mb-0" data-lang="CATEGORIES">Categories</h5>
						<div class="list-group list-custom-small list-icon-0 html_nav_category"></div>
					</div>
				</div>

				<div class="card card-style mb-3">
					<div class="content my-0">
						<h5 class="font-700 text-uppercase opacity-40 font-12 pt-2 mb-0" data-lang="SETTING">Settings</h5>
						<div class="list-group list-custom-small list-icon-0">
							<a href="#" data-menu="menu-highlights">
								<i class="fa font-12 fa-droplet gradient-blue rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="HIGHLIGHTS">Highlights</span>
								<i class="fa fa-angle-right"></i>
							</a>
							<a href="#" data-menu="menu-backgrounds">
								<i class="fa font-12 fa-paint-brush gradient-orange rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="BACKGROUNDS">Backgrounds</span>
								<i class="fa fa-angle-right"></i>
							</a>
							<a href="#" data-menu="menu-share" id="share_link">
								<i class="fa fa-share-alt font-12 gradient-pink rounded-sm color-white"></i>
								<span class="color-highlight" data-lang="SHARE">Share</span>
								<i class="fa fa-angle-right"></i>
							</a>
							<a href="#" data-toggle-theme data-trigger-switch="switch-dark2-mode" class="border-0">
								<i class="fa font-12 fa-moon gradient-dark color-white rounded-sm"></i>
								<span class="color-highlight" data-lang="DARK_MODE">Dark Mode</span>
								<div class="custom-control ios-switch">
									<input data-toggle-theme type="checkbox" class="ios-input" id="switch-dark2-mode">
									<label class="custom-control-label" for="switch-dark2-mode"></label>
								</div>
								<i class="fa fa-angle-right"></i>
							</a>
						</div>
					</div>
				</div>
			</div>
			<div class="w-100 bottom-0 end-0 pb-1">
				<div class="card card-style mb-3">
					<div class="content my-0 py-">
						<div class="list-group list-custom-small list-icon-0">
							<a href="#" data-menu="menu-modal-language">
								<i class="fa fa-language font-12 gradient-brown rounded-sm color-theme"></i>
								<span class="color-highlight" data-lang="LANGUAGES">Languages</span>
								<i class="fa fa-angle-right"></i>
							</a>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- End -->
		
		<!-- menu-language -->
		<div id="menu-modal-language" class="menu menu-box-modal menu-box-detached rounded-m modal-language">
			<div class="content mb-0 mt-0">
				<div class="list-group list-custom-small ps-1">
					<a href="#" class="langname border-0" data-langname="kh"><img class="me-3 mt-n1" width="20" src="assets/images/flags/cambodia.png"><span data-lang="KHMER">Khmer</span><i class="fa fa-angle-right"></i></a>
					<a href="#" class="langname border-0" data-langname="en"><img class="me-3 mt-n1" width="20"  src="assets/images/flags/United-States.png"><span class="ENGLISH">English</span><i class="fa fa-angle-right"></i></a>
				</div>
				<div class="clear"></div>
			</div>
		</div>
		
		<!-- Toast Notifications -->
		<div id="toast-processing-top" class="toast toast-tiny toast-top bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-sync fa-spin me-2"></i>Processing...</div>
		<div id="toast-done-top" class="toast toast-tiny toast-top bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-info me-2"></i>Done</div>
		<div id="toast-save-top" class="toast toast-tiny toast-top bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-floppy-disk me-2"></i>Saved</div>
		<div id="toast-confirm-top" class="toast toast-tiny toast-top bg-green-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-check me-2"></i>Confirmed</div>
		<div id="toast-error-top" class="toast toast-tiny toast-top bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-times me-2"></i>Something went wrong</div>
		<div id="toast-outofstock-top" class="toast toast-tiny toast-top bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-warning me-2"></i>Out of Stock</div>
		<div id="toast-required-top" class="toast toast-tiny toast-top bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-warning me-2"></i>Field is required</div>
		<div id="toast-negative-number-top" class="toast toast-tiny toast-top bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-warning me-2"></i>Number is smaller than zero</div>
		<div id="toast-zero-number-top" class="toast toast-tiny toast-top bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-warning me-2"></i>Number is zero</div>
		
		<div id="toast-processing" class="toast toast-tiny toast-bottom bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-sync fa-spin me-2"></i>Processing...</div>
		<div id="toast-done" class="toast toast-tiny toast-bottom bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-info me-2"></i>Done</div>
		<div id="toast-save" class="toast toast-tiny toast-bottom bg-blue-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-floppy-disk me-2"></i>Saved</div>
		<div id="toast-confirm" class="toast toast-tiny toast-bottom bg-green-dark text-nowrap" data-bs-delay="2000" data-autohide="true"><i class="fa fa-check me-2"></i>Confirmed</div>
		<div id="toast-error" class="toast toast-tiny toast-bottom bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-times me-2"></i>Something went wrong</div>
		<div id="toast-required" class="toast toast-tiny toast-bottom bg-red-dark text-nowrap w-auto" data-bs-delay="2000" data-autohide="true"><i class="fa fa-warning me-2"></i>Field is required</div>

		<!-- Setting Action Sheet -->
		<div id="menu-settings" class="menu menu-box-bottom menu-box-detached">
			<div class="menu-title mt-0 pt-0"><h1>Settings</h1><p class="color-highlight">change your style</p><a href="#" class="close-menu"><i class="fa fa-times"></i></a></div>
			<div class="divider divider-margins mb-n2 d-none"></div>
			<div class="content">
				<div class="list-group list-custom-small">
					<a data-menu="menu-highlights" href="#" class="pb-2 ms-n1">
						<i class="fa font-12 fa-droplet gradient-blue rounded-sm color-white"></i>
						<span>Highlights</span>
						<strong class="d-none">16 Colors Highlights</strong>
						<span class="badge bg-highlight color-white d-none"></span>
						<i class="fa fa-angle-right"></i>
					</a>
					<a data-menu="menu-backgrounds" href="#" class="pb-2 ms-n1">
						<i class="fa font-12 fa-paint-brush gradient-orange rounded-sm color-white"></i>
						<span>Backgrounds</span>
						<strong class="d-none">10 Screen Gradients</strong>
						<span class="badge bg-highlight color-white d-none"></span>
						<i class="fa fa-angle-right"></i>
					</a>
					<a href="#" data-menu="menu-share" class="border-0 pb-2 ms-n1">
						<i class="fa fa-share-alt font-12 gradient-pink rounded-sm color-white"></i>
						<span class="color-highlight">Share</span>
						<i class="fa fa-angle-right"></i>
					</a>
				</div>
				<div class="list-group list-custom-small">
					<a href="#" data-toggle-theme data-trigger-switch="switch-dark-mode" class="pb-2 ms-n1">
						<i class="fa font-12 fa-moon gradient-dark color-white rounded-sm"></i>
						<span>Dark Mode</span>
						<div class="custom-control scale-switch ios-switch">
							<input data-toggle-theme type="checkbox" class="ios-input" id="switch-dark-mode">
							<label class="custom-control-label" for="switch-dark-mode"></label>
						</div>
						<i class="fa fa-angle-right"></i>
					</a>
				</div>
			</div>
		</div>
		
		<!-- Highlights Action Sheet -->
		<div id="menu-highlights" class="menu menu-box-bottom menu-box-detached">
			<div class="menu-title"><h1>Highlights</h1><p class="color-highlight">choose favorite color</p><a href="#" class="close-menu"><i class="fa fa-times"></i></a></div>
			<div class="divider divider-margins mb-n2 d-none"></div>
			<div class="content">
				<div class="highlight-changer">
					<a href="#" data-change-highlight="blue"><i class="fa fa-circle color-blue-dark"></i><span class="color-blue-light">Default</span></a>
					<a href="#" data-change-highlight="red"><i class="fa fa-circle color-red-dark"></i><span class="color-red-light">Red</span></a>
					<a href="#" data-change-highlight="orange"><i class="fa fa-circle color-orange-dark"></i><span class="color-orange-light">Orange</span></a>
					<a href="#" data-change-highlight="pink2"><i class="fa fa-circle color-pink2-dark"></i><span class="color-pink-dark">Pink</span></a>
					<a href="#" data-change-highlight="magenta"><i class="fa fa-circle color-magenta-dark"></i><span class="color-magenta-light">Purple</span></a>
					<a href="#" data-change-highlight="aqua"><i class="fa fa-circle color-aqua-dark"></i><span class="color-aqua-light">Aqua</span></a>
					<a href="#" data-change-highlight="teal"><i class="fa fa-circle color-teal-dark"></i><span class="color-teal-light">Teal</span></a>
					<a href="#" data-change-highlight="mint"><i class="fa fa-circle color-mint-dark"></i><span class="color-mint-light">Mint</span></a>
					<a href="#" data-change-highlight="green"><i class="fa fa-circle color-green-light"></i><span class="color-green-light">Green</span></a>
					<a href="#" data-change-highlight="grass"><i class="fa fa-circle color-green-dark"></i><span class="color-green-dark">Grass</span></a>
					<a href="#" data-change-highlight="sunny"><i class="fa fa-circle color-yellow-light"></i><span class="color-yellow-light">Sunny</span></a>
					<a href="#" data-change-highlight="yellow"><i class="fa fa-circle color-yellow-dark"></i><span class="color-yellow-light">Goldish</span></a>
					<a href="#" data-change-highlight="brown"><i class="fa fa-circle color-brown-dark"></i><span class="color-brown-light">Wood</span></a>
					<a href="#" data-change-highlight="night"><i class="fa fa-circle color-dark-dark"></i><span class="color-dark-light">Night</span></a>
					<a href="#" data-change-highlight="dark"><i class="fa fa-circle color-dark-light"></i><span class="color-dark-light">Dark</span></a>
					<div class="clearfix"></div>
				</div>
				<a href="#" data-menu="menu-settings" class="mb-3 btn btn-full btn-m rounded-sm bg-highlight shadow-xl text-uppercase font-900 mt-4">Back to Settings</a>
			</div>
		</div>
		
		<!-- Backgrounds Action Sheet -->
		<div id="menu-backgrounds" class="menu menu-box-bottom menu-box-detached">
			<div class="menu-title"><h1>Backgrounds</h1><p class="color-highlight">choose background color</p><a href="#" class="close-menu"><i class="fa fa-times"></i></a></div>
			<div class="divider divider-margins mb-n2 d-none"></div>
			<div class="content">
				<div class="background-changer">
					<a href="#" data-change-background="default"><i class="bg-theme"></i><span class="color-dark-dark">Default</span></a>
					<a href="#" data-change-background="plum"><i class="body-plum"></i><span class="color-plum-dark">Plum</span></a>
					<a href="#" data-change-background="magenta"><i class="body-magenta"></i><span class="color-dark-dark">Magenta</span></a>
					<a href="#" data-change-background="dark"><i class="body-dark"></i><span class="color-dark-dark">Dark</span></a>
					<a href="#" data-change-background="violet"><i class="body-violet"></i><span class="color-violet-dark">Violet</span></a>
					<a href="#" data-change-background="red"><i class="body-red"></i><span class="color-red-dark">Red</span></a>
					<a href="#" data-change-background="green"><i class="body-green"></i><span class="color-green-dark">Green</span></a>
					<a href="#" data-change-background="sky"><i class="body-sky"></i><span class="color-sky-dark">Sky</span></a>
					<a href="#" data-change-background="orange"><i class="body-orange"></i><span class="color-orange-dark">Orange</span></a>
					<a href="#" data-change-background="yellow"><i class="body-yellow"></i><span class="color-yellow-dark">Yellow</span></a>
					<div class="clearfix"></div>
				</div>
				<a href="#" data-menu="menu-settings" class="mb-3 btn btn-full btn-m rounded-sm bg-highlight shadow-xl text-uppercase font-900 mt-4">Back to Settings</a>
			</div>
		</div>
		
		<!-- Current Location Action Sheet -->
		<div id="menu-current-location" class="menu menu-box-bottom rounded-m mb-n3" data-menu-height="60" data-menu-width="auto">
			<style>
			#map {height: 580px;width: 100%;margin: 0;padding: 0;}
			.custom-map-control-button {background-color: #fff; border: 0;border-radius: 2px;box-shadow: 0 1px 4px -1px rgba(0, 0, 0, 0.3);margin: 10px;padding: 0 0.5em;font: 400 18px Roboto, Arial, sans-serif;overflow: hidden;height: 40px; cursor: pointer;margin-left: 30%;}
			.custom-map-control-button:hover {background: rgb(235, 235, 235);}
			.gm-style-iw-chr{display: none !important;}
			.gm-style-iw-tc{display: none;}
			</style>
			<div class="rounded-0">
				<div class="card-top" style="margin-top: 6em !important;">
					<a href="#" class="float-end close-menu icon icon-s color-black mt-1 me-2 rounded-circle bg-white closecurrentmap"><i class="fa fa-times"></i></a>
				</div>
				<div id="map"></div>
				<div class="content">
					<button id="confirmcurrentlocation" class="close-menu btn bg-red-light btn-full rounded-l w-100 mt-n2 mb-4">Confirm</button>
				</div>
			</div>
		</div>
		
	</div>
	
	<script type="text/javascript" src="assets/scripts/bootstrap.min.js"></script>
	<!--<script type="module" src="assets/scripts/custom.min.js"></script>--><!--prod-->
	<script type="module" src="assets/scripts/custom.js"></script><!--dev-->
</body>
</html>