

          <!-- BEGIN Shortcuts -->
               <div class="modal fade modal-backdrop-transparent" id="modal-shortcut" tabindex="-1" role="dialog" aria-labelledby="modal-shortcut" aria-hidden="true">
                  <div class="modal-dialog modal-dialog-top modal-transparent" role="document">
                     <div class="modal-content">
                        <div class="modal-body">
                           <ul class="app-list w-auto h-auto p-0 text-left">
                              <li>
                                 <a href="<?php echo e(url('KlarAdmin')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-home icon-stack-1x opacity-100 color-white"></i>
                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.Home')); ?>

                                    </span>
                                 </a>
                              </li>


                               <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('قائمة الزوار')): ?>
                                        <li>
                                 <a href="<?php echo e(url('GUESTLIST')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-shopping-bag icon-stack-1x opacity-100 color-white"></i>
                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.GUESTLIST')); ?>

                                    </span>
                                 </a>
                              </li>
                               <?php endif; ?>

                                        <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('قائمه الاسعار')): ?>

                                                     <li>
                                 <a href="<?php echo e(url('StorePriceList')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-shopping-bag icon-stack-1x opacity-100 color-white"></i>
                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.StorePriceList')); ?>

                                    </span>
                                 </a>
                              </li>


                    <?php endif; ?>

                                                  <li>
                                 <a href="<?php echo e(url('BriefsAdmin')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-briefcase icon-stack-1x opacity-100 color-white"></i>

                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.Briefs')); ?>

                                    </span>
                                 </a>
                              </li>


                              <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('الاحصائيات')): ?>
                                                             <li>
                                 <a href="<?php echo e(url('StatisticsTotal')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-th icon-stack-1x opacity-100 color-white"></i>
                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.Statistics_Total')); ?>

                                    </span>
                                 </a>
                              </li>
                            <?php endif; ?>


                                 <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('الاحصائيات')): ?>
                                                  <li>
                                 <a href="<?php echo e(url('StatisticsGraph')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-chart-bar icon-stack-1x opacity-100 color-white"></i>


                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.Statistics_Graph')); ?>

                                    </span>
                                 </a>
                              </li>
                               <?php endif; ?>

                                 <?php if (app(\Illuminate\Contracts\Auth\Access\Gate::class)->check('جدول المواعيد')): ?>

                                                                                 <li>
                                 <a href="<?php echo e(url('CalendarMeet')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-calendar icon-stack-1x opacity-100 color-white"></i>


                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.Calendar')); ?>

                                    </span>
                                 </a>
                              </li>
                               <?php endif; ?>

                               <?php if(auth()->guard('admin')->user()->emp != 0): ?>

                                                                                 <li>
                                 <a href="<?php echo e(url('EmpMailInbox')); ?>" class="app-list-item text-white border-0 m-0">
                                    <div class="icon-stack">
                                       <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                       <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                       <i class="fal fa-inbox icon-stack-1x opacity-100 color-white"></i>


                                    </div>
                                    <span class="app-list-name">
                                    <?php echo e(trans('admin.EmpMailInbox')); ?>

                                    </span>
                                 </a>
                              </li>

                               <?php endif; ?>


                               <?php if(auth()->guard('admin')->user()->emp == 0): ?>

                                   <li>
                                       <a href="<?php echo e(url('SendMails')); ?>" class="app-list-item text-white border-0 m-0">
                                           <div class="icon-stack">
                                               <i class="base base-7 icon-stack-3x opacity-100 color-primary-500 "></i>
                                               <i class="base base-7 icon-stack-2x opacity-100 color-primary-300 "></i>
                                               <i class="fal fa-envelope icon-stack-1x opacity-100 color-white"></i>


                                           </div>
                                           <span class="app-list-name">
                                    <?php echo e(trans('admin.SendMails')); ?>

                                    </span>
                                       </a>
                                   </li>

                               <?php endif; ?>



                           </ul>
                        </div>
                     </div>
                  </div>
               </div>
               <!-- END Shortcuts -->


               <!-- BEGIN Color profile -->
               <!-- this area is hidden and will not be seen on screens or screen readers -->
               <!-- we use this only for CSS color refernce for JS stuff -->
               <p id="js-color-profile" class="d-none">
                  <span class="color-primary-50"></span>
                  <span class="color-primary-100"></span>
                  <span class="color-primary-200"></span>
                  <span class="color-primary-300"></span>
                  <span class="color-primary-400"></span>
                  <span class="color-primary-500"></span>
                  <span class="color-primary-600"></span>
                  <span class="color-primary-700"></span>
                  <span class="color-primary-800"></span>
                  <span class="color-primary-900"></span>
                  <span class="color-info-50"></span>
                  <span class="color-info-100"></span>
                  <span class="color-info-200"></span>
                  <span class="color-info-300"></span>
                  <span class="color-info-400"></span>
                  <span class="color-info-500"></span>
                  <span class="color-info-600"></span>
                  <span class="color-info-700"></span>
                  <span class="color-info-800"></span>
                  <span class="color-info-900"></span>
                  <span class="color-danger-50"></span>
                  <span class="color-danger-100"></span>
                  <span class="color-danger-200"></span>
                  <span class="color-danger-300"></span>
                  <span class="color-danger-400"></span>
                  <span class="color-danger-500"></span>
                  <span class="color-danger-600"></span>
                  <span class="color-danger-700"></span>
                  <span class="color-danger-800"></span>
                  <span class="color-danger-900"></span>
                  <span class="color-warning-50"></span>
                  <span class="color-warning-100"></span>
                  <span class="color-warning-200"></span>
                  <span class="color-warning-300"></span>
                  <span class="color-warning-400"></span>
                  <span class="color-warning-500"></span>
                  <span class="color-warning-600"></span>
                  <span class="color-warning-700"></span>
                  <span class="color-warning-800"></span>
                  <span class="color-warning-900"></span>
                  <span class="color-success-50"></span>
                  <span class="color-success-100"></span>
                  <span class="color-success-200"></span>
                  <span class="color-success-300"></span>
                  <span class="color-success-400"></span>
                  <span class="color-success-500"></span>
                  <span class="color-success-600"></span>
                  <span class="color-success-700"></span>
                  <span class="color-success-800"></span>
                  <span class="color-success-900"></span>
                  <span class="color-fusion-50"></span>
                  <span class="color-fusion-100"></span>
                  <span class="color-fusion-200"></span>
                  <span class="color-fusion-300"></span>
                  <span class="color-fusion-400"></span>
                  <span class="color-fusion-500"></span>
                  <span class="color-fusion-600"></span>
                  <span class="color-fusion-700"></span>
                  <span class="color-fusion-800"></span>
                  <span class="color-fusion-900"></span>
               </p>
               <!-- END Color profile -->
            </div>
         </div>
      </div>
  <nav class="shortcut-menu d-none d-sm-block">
         <input type="checkbox" class="menu-open" name="menu-open" id="menu_open" />
         <label for="menu_open" class="menu-open-button ">
         <span class="app-shortcut-icon d-block"></span>
         </label>
         <a href="#" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Scroll Top">
         <i class="fal fa-arrow-up"></i>
         </a>
         <a href="<?php echo e(url('Logout')); ?>" class="menu-item btn" data-toggle="tooltip" data-placement="left" title="Logout">
         <i class="fal fa-sign-out"></i>
         </a>
         <a href="#" class="menu-item btn" data-action="app-fullscreen" data-toggle="tooltip" data-placement="left" title="Full Screen">
         <i class="fal fa-expand"></i>
         </a>
         <a href="#" class="menu-item btn" data-action="app-print" data-toggle="tooltip" data-placement="left" title="Print page">
         <i class="fal fa-print"></i>
         </a>
         <a href="#" class="menu-item btn" data-action="app-voice" data-toggle="tooltip" data-placement="left" title="Voice command">
         <i class="fal fa-microphone"></i>
         </a>
      </nav>

   <div class="modal fade js-modal-settings modal-backdrop-transparent" tabindex="-1" role="dialog" aria-hidden="true">
         <div class="modal-dialog modal-dialog-left modal-md">
            <div class="modal-content">
               <div class="dropdown-header bg-trans-gradient d-flex justify-content-center align-items-center w-100">
                  <h4 class="m-0 text-center color-white">
                     Layout Settings
                     <small class="mb-0 opacity-80">User Interface Settings</small>
                  </h4>
                  <button type="button" class="close text-white position-absolute pos-top pos-right p-2 m-1 mr-2" data-dismiss="modal" aria-label="Close">
                  <span aria-hidden="true"><i class="fal fa-times"></i></span>
                  </button>
               </div>
               <div class="modal-body p-0">
                  <div class="settings-panel">
                     <div class="mt-4 d-table w-100 px-5">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0">
                              App Layout
                           </h5>
                        </div>
                     </div>
                     <div class="list" id="fh">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="header-function-fixed"></a>
                        <span class="onoffswitch-title">Fixed Header</span>
                        <span class="onoffswitch-title-desc">header is in a fixed at all times</span>
                     </div>
                     <div class="list" id="nff">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-fixed"></a>
                        <span class="onoffswitch-title">Fixed Navigation</span>
                        <span class="onoffswitch-title-desc">left panel is fixed</span>
                     </div>
                     <div class="list" id="nfm">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-minify"></a>
                        <span class="onoffswitch-title">Minify Navigation</span>
                        <span class="onoffswitch-title-desc">Skew nav to maximize space</span>
                     </div>
                     <div class="list" id="nfh">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-hidden"></a>
                        <span class="onoffswitch-title">Hide Navigation</span>
                        <span class="onoffswitch-title-desc">roll mouse on edge to reveal</span>
                     </div>
                     <div class="list" id="nft">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-function-top"></a>
                        <span class="onoffswitch-title">Top Navigation</span>
                        <span class="onoffswitch-title-desc">Relocate left pane to top</span>
                     </div>
                     <div class="list" id="fff">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="footer-function-fixed"></a>
                        <span class="onoffswitch-title">Fixed Footer</span>
                        <span class="onoffswitch-title-desc">page footer is fixed</span>
                     </div>
                     <div class="list" id="mmb">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-main-boxed"></a>
                        <span class="onoffswitch-title">Boxed Layout</span>
                        <span class="onoffswitch-title-desc">Encapsulates to a container</span>
                     </div>
                     <div class="expanded">
                        <ul class="mb-3 mt-1">
                           <li>
                              <div class="bg-fusion-50" data-action="toggle" data-class="mod-bg-1"></div>
                           </li>
                           <li>
                              <div class="bg-warning-200" data-action="toggle" data-class="mod-bg-2"></div>
                           </li>
                           <li>
                              <div class="bg-primary-200" data-action="toggle" data-class="mod-bg-3"></div>
                           </li>
                           <li>
                              <div class="bg-success-300" data-action="toggle" data-class="mod-bg-4"></div>
                           </li>
                           <li>
                              <div class="bg-white border" data-action="toggle" data-class="mod-bg-none"></div>
                           </li>
                        </ul>
                        <div class="list" id="mbgf">
                           <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-fixed-bg"></a>
                           <span class="onoffswitch-title">Fixed Background</span>
                        </div>
                     </div>
                     <div class="mt-4 d-table w-100 px-5">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0">
                              Mobile Menu
                           </h5>
                        </div>
                     </div>
                     <div class="list" id="nmp">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-push"></a>
                        <span class="onoffswitch-title">Push Content</span>
                        <span class="onoffswitch-title-desc">Content pushed on menu reveal</span>
                     </div>
                     <div class="list" id="nmno">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-no-overlay"></a>
                        <span class="onoffswitch-title">No Overlay</span>
                        <span class="onoffswitch-title-desc">Removes mesh on menu reveal</span>
                     </div>
                     <div class="list" id="sldo">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="nav-mobile-slide-out"></a>
                        <span class="onoffswitch-title">Off-Canvas <sup>(beta)</sup></span>
                        <span class="onoffswitch-title-desc">Content overlaps menu</span>
                     </div>
                     <div class="mt-4 d-table w-100 px-5">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0">
                              Accessibility
                           </h5>
                        </div>
                     </div>
                     <div class="list" id="mbf">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-bigger-font"></a>
                        <span class="onoffswitch-title">Bigger Content Font</span>
                        <span class="onoffswitch-title-desc">content fonts are bigger for readability</span>
                     </div>
                     <div class="list" id="mhc">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-high-contrast"></a>
                        <span class="onoffswitch-title">High Contrast Text (WCAG 2 AA)</span>
                        <span class="onoffswitch-title-desc">4.5:1 text contrast ratio</span>
                     </div>
                     <div class="list" id="mcb">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-color-blind"></a>
                        <span class="onoffswitch-title">Daltonism <sup>(beta)</sup> </span>
                        <span class="onoffswitch-title-desc">color vision deficiency</span>
                     </div>
                     <div class="list" id="mpc">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-pace-custom"></a>
                        <span class="onoffswitch-title">Preloader Inside</span>
                        <span class="onoffswitch-title-desc">preloader will be inside content</span>
                     </div>
                     <div class="list" id="mpi">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-panel-icon"></a>
                        <span class="onoffswitch-title">SmartPanel Icons (not Panels)</span>
                        <span class="onoffswitch-title-desc">smartpanel buttons will appear as icons</span>
                     </div>
                     <div class="mt-4 d-table w-100 px-5">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0">
                              Global Modifications
                           </h5>
                        </div>
                     </div>
                     <div class="list" id="mcbg">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-clean-page-bg"></a>
                        <span class="onoffswitch-title">Clean Page Background</span>
                        <span class="onoffswitch-title-desc">adds more whitespace</span>
                     </div>
                     <div class="list" id="mhni">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-hide-nav-icons"></a>
                        <span class="onoffswitch-title">Hide Navigation Icons</span>
                        <span class="onoffswitch-title-desc">invisible navigation icons</span>
                     </div>
                     <div class="list" id="dan">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-disable-animation"></a>
                        <span class="onoffswitch-title">Disable CSS Animation</span>
                        <span class="onoffswitch-title-desc">Disables CSS based animations</span>
                     </div>
                     <div class="list" id="mhic">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-hide-info-card"></a>
                        <span class="onoffswitch-title">Hide Info Card</span>
                        <span class="onoffswitch-title-desc">Hides info card from left panel</span>
                     </div>
                     <div class="list" id="mlph">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-lean-subheader"></a>
                        <span class="onoffswitch-title">Lean Subheader</span>
                        <span class="onoffswitch-title-desc">distinguished page header</span>
                     </div>
                     <div class="list" id="mnl">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-nav-link"></a>
                        <span class="onoffswitch-title">Hierarchical Navigation</span>
                        <span class="onoffswitch-title-desc">Clear breakdown of nav links</span>
                     </div>
                     <div class="list" id="mdn">
                        <a href="#" onclick="return false;" class="btn btn-switch" data-action="toggle" data-class="mod-nav-dark"></a>
                        <span class="onoffswitch-title">Dark Navigation</span>
                        <span class="onoffswitch-title-desc">Navigation background is darkend</span>
                     </div>
                     <hr class="mb-0 mt-4">
                     <div class="mt-4 d-table w-100 pl-5 pr-3">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0">
                              Global Font Size
                           </h5>
                        </div>
                     </div>
                     <div class="list mt-1">
                        <div class="btn-group btn-group-sm btn-group-toggle my-2" data-toggle="buttons">
                           <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-sm" data-target="html">
                           <input type="radio" name="changeFrontSize"> SM
                           </label>
                           <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text" data-target="html">
                           <input type="radio" name="changeFrontSize" checked=""> MD
                           </label>
                           <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-lg" data-target="html">
                           <input type="radio" name="changeFrontSize"> LG
                           </label>
                           <label class="btn btn-default btn-sm" data-action="toggle-swap" data-class="root-text-xl" data-target="html">
                           <input type="radio" name="changeFrontSize"> XL
                           </label>
                        </div>
                        <span class="onoffswitch-title-desc d-block mb-0">Change <strong>root</strong> font size to effect rem
                        values (resets on page refresh)</span>
                     </div>
                     <hr class="mb-0 mt-4">


                     <div class="mt-4 d-table w-100 pl-5 pr-3">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0 pr-2 d-flex">
                              Theme colors
                              <a href="#" class="ml-auto fw-400 fs-xs" data-toggle="popover" data-trigger="focus" data-placement="top" title="" data-html="true" data-content="The settings below uses <code>localStorage</code> to load the external <strong>CSS</strong> file as an overlap to the base css. Due to network latency and <strong>CPU utilization</strong>, you may experience a brief flickering effect on page load which may show the intial applied theme for a split second. Setting the prefered style/theme in the header will prevent this from happening." data-original-title="<span class='text-primary'><i class='fal fa-exclamation-triangle mr-1'></i> Heads up!</span>" data-template="<div class=&quot;popover bg-white border-white&quot; role=&quot;tooltip&quot;><div class=&quot;arrow&quot;></div><h3 class=&quot;popover-header bg-transparent&quot;></h3><div class=&quot;popover-body fs-xs&quot;></div></div>"><i class="fal fa-info-circle mr-1"></i> more info</a>
                           </h5>
                        </div>
                     </div>
                     <div class="expanded theme-colors pl-5 pr-3">
                        <ul class="m-0">
                           <li>
                              <a href="#" id="myapp-0" data-action="theme-update" data-themesave data-theme="" data-toggle="tooltip" data-placement="top" title="Wisteria (base css)" data-original-title="Wisteria (base css)" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-1" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-1.css')); ?>" data-toggle="tooltip" data-placement="top" title="Tapestry" data-original-title="Tapestry" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-2" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-2.css')); ?>" data-toggle="tooltip" data-placement="top" title="Atlantis" data-original-title="Atlantis" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-3" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-3.css')); ?>" data-toggle="tooltip" data-placement="top" title="Indigo" data-original-title="Indigo" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-4" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-4.css')); ?>" data-toggle="tooltip" data-placement="top" title="Dodger Blue" data-original-title="Dodger Blue" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-5" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-5.css')); ?>" data-toggle="tooltip" data-placement="top" title="Tradewind" data-original-title="Tradewind" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-6" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-6.css')); ?>" data-toggle="tooltip" data-placement="top" title="Cranberry" data-original-title="Cranberry" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-7" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-7.css')); ?>" data-toggle="tooltip" data-placement="top" title="Oslo Gray" data-original-title="Oslo Gray" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-8" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-8.css')); ?>" data-toggle="tooltip" data-placement="top" title="Chetwode Blue" data-original-title="Chetwode Blue" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-9" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-9.css')); ?>" data-toggle="tooltip" data-placement="top" title="Apricot" data-original-title="Apricot" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-10" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-10.css')); ?>" data-toggle="tooltip" data-placement="top" title="Blue Smoke" data-original-title="Blue Smoke" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-11" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-11.css')); ?>" data-toggle="tooltip" data-placement="top" title="Green Smoke" data-original-title="Green Smoke" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-12" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-12.css')); ?>" data-toggle="tooltip" data-placement="top" title="Wild Blue Yonder" data-original-title="Wild Blue Yonder" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-13" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-13.css')); ?>" data-toggle="tooltip" data-placement="top" title="Emerald" data-original-title="Emerald" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-14" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-14.css')); ?>" data-toggle="tooltip" data-placement="top" title="Supernova" data-original-title="Supernova" onclick="ChangeColor()"></a>
                           </li>
                           <li>
                              <a href="#" id="myapp-15" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-15.css')); ?>" data-toggle="tooltip" data-placement="top" title="Hoki" data-original-title="Hoki" onclick="ChangeColor()"></a>
                           </li>
                            <li>
                              <a href="#" id="myapp-16" data-action="theme-update" data-themesave data-theme="<?php echo e(asset('Admin/css/themes/cust-theme-16.css')); ?>" data-toggle="tooltip" data-placement="top" title="Rabih" data-original-title="Rabih" onclick="ChangeColor()"></a>
                           </li>
                        </ul>
                     </div>

                     <hr class="mb-0 mt-4">
                     <div class="mt-4 d-table w-100 pl-5 pr-3">
                        <div class="d-table-cell align-middle">
                           <h5 class="p-0 pr-2 d-flex">
                              Theme Modes (beta)
                              <a href="#" class="ml-auto fw-400 fs-xs" data-toggle="popover" data-trigger="focus" data-placement="top" title="" data-html="true" data-content="This is a brand new technique we are introducing which uses CSS variables to infiltrate color options. While this has been working nicely on modern browsers without much issues, some users <strong>may still face issues on Internet Explorer </strong>. Until these issues are resolved or Internet Explorer improves, this feature will remain in Beta" data-original-title="<span class='text-primary'><i class='fal fa-question-circle mr-1'></i> Why beta?</span>" data-template="<div class=&quot;popover bg-white border-white&quot; role=&quot;tooltip&quot;><div class=&quot;arrow&quot;></div><h3 class=&quot;popover-header bg-transparent&quot;></h3><div class=&quot;popover-body fs-xs&quot;></div></div>"><i class="fal fa-question-circle mr-1"></i> why beta?</a>
                           </h5>
                        </div>
                     </div>
                     <div class="pl-5 pr-3 py-3">
                        <div class="ie-only alert alert-warning d-none">
                           <h6>Internet Explorer Issue</h6>
                           This particular component may not work as expected in Internet Explorer. Please use with caution.
                        </div>
                        <div class="row no-gutters">
                           <div class="col-4 pr-2 text-center">
                              <div id="skin-default" data-action="toggle-replace" data-replaceclass="mod-skin-light mod-skin-dark" data-class="" data-toggle="tooltip" data-placement="top" title="" class="d-flex bg-white border border-primary rounded overflow-hidden text-success js-waves-on" data-original-title="Default Mode" style="height: 80px">
                                 <div class="bg-primary-600 bg-primary-gradient px-2 pt-0 border-right border-primary"></div>
                                 <div class="d-flex flex-column flex-1">
                                    <div class="bg-white border-bottom border-primary py-1"></div>
                                    <div class="bg-faded flex-1 pt-3 pb-3 px-2">
                                       <div class="py-3" style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;"></div>
                                    </div>
                                 </div>
                              </div>
                              Default
                           </div>
                           <div class="col-4 px-1 text-center">
                              <div id="skin-light" data-action="toggle-replace" data-replaceclass="mod-skin-dark" data-class="mod-skin-light" data-toggle="tooltip" data-placement="top" title="" class="d-flex bg-white border border-secondary rounded overflow-hidden text-success js-waves-on" data-original-title="Light Mode" style="height: 80px">
                                 <div class="bg-white px-2 pt-0 border-right border-"></div>
                                 <div class="d-flex flex-column flex-1">
                                    <div class="bg-white border-bottom border- py-1"></div>
                                    <div class="bg-white flex-1 pt-3 pb-3 px-2">
                                       <div class="py-3" style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;"></div>
                                    </div>
                                 </div>
                              </div>
                              Light
                           </div>
                           <div class="col-4 pl-2 text-center">
                              <div id="skin-dark" data-action="toggle-replace" data-replaceclass="mod-skin-light" data-class="mod-skin-dark" data-toggle="tooltip" data-placement="top" title="" class="d-flex bg-white border border-dark rounded overflow-hidden text-success js-waves-on" data-original-title="Dark Mode" style="height: 80px">
                                 <div class="bg-fusion-500 px-2 pt-0 border-right"></div>
                                 <div class="d-flex flex-column flex-1">
                                    <div class="bg-fusion-600 border-bottom py-1"></div>
                                    <div class="bg-fusion-300 flex-1 pt-3 pb-3 px-2">
                                       <div class="py-3 opacity-30" style="background:url('img/demo/s-1.png') top left no-repeat;background-size: 100%;"></div>
                                    </div>
                                 </div>
                              </div>
                              Dark
                           </div>
                        </div>
                     </div>
                     <hr class="mb-0 mt-4">
                     <div class="pl-5 pr-3 py-3 bg-faded">
                        <div class="row no-gutters">
                           <div class="col-6 pr-1">
                              <a href="#" class="btn btn-outline-danger fw-500 btn-block" data-action="app-reset">Reset Settings</a>
                           </div>
                           <div class="col-6 pl-1">
                              <a href="#" class="btn btn-danger fw-500 btn-block" data-action="factory-reset">Factory Reset</a>
                           </div>
                        </div>
                     </div>
                  </div>
                  <span id="saving"></span>
               </div>
            </div>
         </div>
      </div>















<?php /**PATH /home/klarapps/public_html/test.klarapps.com/resources/views/admin/layouts/afterNav.blade.php ENDPATH**/ ?>