<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <title>
        {{trans('admin.POS')}}
    </title>
    <meta name="description" content="Analytics Dashboard">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no, minimal-ui">
    <!-- Call App Mode on ios devices -->
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <!-- Remove Tap Highlight on Windows Phone IE -->
    <meta name="msapplication-tap-highlight" content="no">
    <!-- base css -->
    <link id="vendorsbundle" rel="stylesheet" media="screen, print" href="{{asset('Admin/css/vendors.bundle.css')}}">
    <link id="appbundle" rel="stylesheet" media="screen, print" href="{{asset('Admin/css/app.bundle.css')}}">
    <link id="mytheme" rel="stylesheet" media="screen, print" href="#">
    <link id="myskin" rel="stylesheet" media="screen, print" href="{{asset('Admin/css/skins/skin-master.css')}}">


    <link rel="stylesheet" media="screen, print" href="{{asset('Admin/css/style.css')}}">
    <link rel="stylesheet" media="screen, print" href="{{asset('Admin/css/style-ar.css')}}">
    <link rel="stylesheet" media="screen, print" href="{{asset('Admin/keyboard/keyboard.css')}}">
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons"
          rel="stylesheet">
    <!-- Place favicon.ico in the root directory -->
    <link rel="apple-touch-icon" sizes="180x180" href="{{URL::to($Default->Icon)}}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{URL::to($Default->Icon)}}">
    <link rel="mask-icon" href="{{URL::to($Default->Icon)}}" color="#5bbad5">
    <link rel="stylesheet" media="screen, print" href="{{asset('Admin/css/miscellaneous/reactions/reactions.css')}}">
    <link rel="stylesheet" media="screen, print" href="{{asset('Admin/css/formplugins/select2/select2.bundle.css')}}">

</head>
<style>

    .bt{
        background: none;
        border: none;
        color: red;
    }

    #data{
        position: absolute;
        z-index: 2;
        border: 1px solid black;
        padding: 10px;
        background: #886ab5;
        color: white;
        margin-top: 37px;
        text-align: center;
        margin-left:13px;
        max-height: 497px;
        overflow: auto;
        /*margin-right: 50px;*/
    }

    .BUT{

        background: none;
        color: white;
        border: none;

    }

    .BUT:hover{
        cursor: pointer;
        background: #d5cee0;

    }
    .second-section table .form-control{
        padding: 0.5rem 0.3rem;
    }

</style>
<style>
    body{
        direction: rtl!important;
        overflow: hidden;
        /* height: 100%; */
    }
    @media(max-width:600px){

        body{
            overflow:auto;
        }
    }
</style>

@if(app()->getLocale() == 'en')
    <style>
        .ENGLISH{

            direction: ltr;
        }

        .TABLEENGLISH{

            text-align: left;
        }


        .modal-header, .modal-body {
            direction: ltr !important;
            text-align: left !important;
        }

        .modal-footer{
            direction: rtl !important;
        }
    </style>
@endif


<body class="mod-bg-1 mod-nav-link ">

<script>

    'use strict';

    var classHolder = document.getElementsByTagName("BODY")[0],
        /**
         * Load from localstorage
         **/
        themeSettings = (localStorage.getItem('themeSettings')) ? JSON.parse(localStorage.getItem('themeSettings')) :
            {},
        themeURL = themeSettings.themeURL || '',
        themeOptions = themeSettings.themeOptions || '';
    /**
     * Load theme options
     **/
    if (themeSettings.themeOptions)
    {
        classHolder.className = themeSettings.themeOptions;
        console.log("%c✔ Theme settings loaded", "color: #148f32");
    }
    else
    {
        console.log("%c✔ Heads up! Theme settings is empty or does not exist, loading default settings...", "color: #ed1c24");
    }
    if (themeSettings.themeURL && !document.getElementById('mytheme'))
    {
        var cssfile = document.createElement('link');
        cssfile.id = 'mytheme';
        cssfile.rel = 'stylesheet';
        cssfile.href = themeURL;
        document.getElementsByTagName('head')[0].appendChild(cssfile);

    }
    else if (themeSettings.themeURL && document.getElementById('mytheme'))
    {
        document.getElementById('mytheme').href = themeSettings.themeURL;
    }
    /**
     * Save to localstorage
     **/
    var saveSettings = function()
    {
        themeSettings.themeOptions = String(classHolder.className).split(/[^\w-]+/).filter(function(item)
        {
            return /^(nav|header|footer|mod|display)-/i.test(item);
        }).join(' ');
        if (document.getElementById('mytheme'))
        {
            themeSettings.themeURL = document.getElementById('mytheme').getAttribute("href");
        };
        localStorage.setItem('themeSettings', JSON.stringify(themeSettings));
    }
    /**
     * Reset settings
     **/
    var resetSettings = function()
    {
        localStorage.setItem("themeSettings", "");
    }

</script>
