@extends('layouts.front', ['class' => ''])

@section('extrameta')
<title>{{ $restorant->name }}</title>
<meta property="og:image" itemprop="image" content="{{ $restorant->logom }}">
<meta property="og:image:type" content="image/png">
<meta property="og:image:width" content="590">
<meta property="og:image:height" content="400">
<meta name="og:title" property="og:title" content="{{ $restorant->name }}">
<meta name="description" content="{{ $restorant->description }}">
@if (\Akaunting\Module\Facade::has('googleanalytics'))
    @include('googleanalytics::index') 
@endif

<style>
    {{ $restorant->getConfig('custom_menu_css','') }}
</style>

{!! $restorant->getConfig('custom_menu_js','') !!}

@endsection



@section('addiitional_button_3')
    @include('restorants.partials.itemsearch')
    @if (\Akaunting\Module\Facade::has('cards')&&$restorant->getConfig('enable_loyalty', false))

        <li class="web-menu mr-1">
            <a href="{{ route('loyalty.landing',['alias'=>$restorant->subdomain])}}" class="btn btn-neutral btn-icon btn-cart" style="cursor:pointer;">
                <span class="btn-inner--icon">
                    <i class="fa fa-id-card-o"></i>
                </span>
                <span class="nav-link-inner--text">{{ __('loyalty.loyalty_program') }}</span>
            </a>
        </li>
        <li class="mobile-menu">
            <a href="{{ route('loyalty.landing',['alias'=>$restorant->subdomain])}}" class="nav-link" >
                <span class="btn-inner--icon">
                  <i class="fa fa-id-card-o"></i>
                </span>
                <span class="nav-link-inner--text">{{  __('loyalty.loyalty_program') }}</span>
            </a>
        </li>
    @endif
@endsection



@section('content') 

@include('restorants.partials.modals')

    <section class="section-profile-cover section-shaped grayscale-05 d-none d-md-none d-lg-block d-lx-block">
      <!-- Circles background -->
      <img class="bg-image" loading="lazy" src="{{ $restorant->coverm }}" style="width: 100%;">
      <!-- SVG separator -->
      <div class="separator separator-bottom separator-skew">
        <svg x="0" y="0" viewBox="0 0 2560 100" preserveAspectRatio="none" version="1.1" xmlns="http://www.w3.org/2000/svg">
          <polygon class="fill-white" points="2560 0 2560 100 0 100"></polygon>
        </svg>
      </div>
    </section>

    <section class="section pt-lg-0 mb--5 mt--9 d-none d-md-none d-lg-block d-lx-block">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    <div class="title white"   >
                        <h1 class="display-3 text-white notranslate" data-toggle="modal" data-target="#modal-restaurant-info" style="cursor: pointer;">{{ $restorant->name }}</h1>
                        
                        <p class="display-4" style="margin-top: 120px">{{ $restorant->description }}</p>
                        @include('restorants.partials.social_links')

                        <p><i class="ni ni-watch-time"></i> @if(!empty($openingTime))<span class="closed_time">{{__('Opens')}} {{ $openingTime }}</span>@endif @if(!empty($closingTime))<span class="opened_time">{{__('Opened until')}} {{ $closingTime }}</span> @endif |   @if(!empty($restorant->address))<i class="ni ni-pin-3"></i></i> <a target="_blank" href="https://www.google.com/maps/search/?api=1&query={{ urlencode($restorant->address) }}"><span class="notranslate">{{ $restorant->address }}</span></a>  | @endif @if(!empty($restorant->phone)) <i class="ni ni-mobile-button"></i> <a href="tel:{{$restorant->phone}}">{{ $restorant->phone }} </a> @endif</p>
                    </div>
                </div>
            </div>

            <div class="row">
                <div class="col-lg-12">
                    @include('partials.flash')
                </div>
                @if (auth()->user()&&auth()->user()->hasRole('admin'))
                    @include('restorants.admininfo')
                @endif
            </div>
        </div>

    </section>
    <section class="section section-lg d-md-block d-lg-none d-lx-none" style="padding-bottom: 0px">
        <div class="container">
            <div class="row">
                <div class="col-lg-12">
                    @include('partials.flash')
                </div>
            </div>
            <div class="row">
                <div class="col-lg-12">
                    <div class="title text-center">
                        <h1 class="display-3 text notranslate" style="font-size: 30px;" data-toggle="modal" data-target="#modal-restaurant-info" style="cursor: pointer;">{{ $restorant->name }}</h1>
                        <p class="display-4 text" style="font-size: 18px;">{{ $restorant->description }}</p>
                        @include('restorants.partials.social_links')
                        <p class="mb-2"> <i class="ni ni-watch-time"></i> @if(!empty($openingTime))<span class="closed_time">{{__('Opens')}} {{ $openingTime }}</span>@endif @if(!empty($closingTime))<span class="opened_time">{{__('Opened until')}} {{ $closingTime }}</span> </p> <p class="mb-2"> @endif   @if(!empty($restorant->address))<i class="ni ni-pin-3"></i></i> <a target="_blank" href="https://www.google.com/maps/search/?api=1&query={{ urlencode($restorant->address) }}">{{ $restorant->address }}</a></p> <p class="mb-2">@endif @if(!empty($restorant->phone)) <i class="ni ni-mobile-button"></i> <a href="tel:{{$restorant->phone}}">{{ $restorant->phone }} </a></p> @endif</p>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <section class="section pt-lg-0" id="restaurant-content" style="padding-top: 0px">
        <input type="hidden" id="rid" value="{{ $restorant->id }}"/>
        <div class="container container-restorant">

            
            
            @if(!$restorant->categories->isEmpty())
            <nav class="tabbable sticky" style="top: {{ config('app.isqrsaas') ? 64:88 }}px;">
                <ul class="nav nav-pills bg-white mb-2">
                    <li class="nav-item nav-item-category ">
                        <a class="nav-link  mb-sm-3 mb-md-0 active" data-toggle="tab" role="tab" href="">{{ __('All categories') }}</a>
                    </li>
                    @foreach ( $restorant->categories as $key => $category)
                        @if(!$category->aitems->isEmpty())
                            <li class="nav-item nav-item-category" id="{{ 'cat_'.clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}">
                                <a class="nav-link mb-sm-3 mb-md-0" data-toggle="tab" role="tab" id="{{ 'nav_'.clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}" href="#{{ clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}">{{ $category->name }}</a>
                            </li>
                        @endif
                    @endforeach
                </ul>

                
            </nav>

            
            @endif

            


            @if(!$restorant->categories->isEmpty())
            @foreach ( $restorant->categories as $key => $category)
                @if(!$category->aitems->isEmpty())
                <div id="{{ clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}" class="{{ clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}">
                    <h3 class="text-center text-2xl">{{ $category->name }}</h3><br />
                </div>
                @endif
                <div class="row {{ clean(str_replace(' ', '', strtolower($category->name)).strval($key)) }}">
                    @foreach ($category->aitems as $item)
                        <div class="col-xl-3 col-lg-6 col-md-6 col-sm-6">
                            <div class="strip">
                                @if(!empty($item->image))
                                <figure>
                                    <a  @if (!($item->qty_management==1&&$item->qty<1)) onClick="setCurrentItem({{ $item->id }})" @endif href="javascript:void(0)"><img src="{{ $item->logom }}" loading="lazy" data-src="{{ config('global.restorant_details_image') }}" class="img-fluid lazy" alt=""></a>
                                </figure>
                                @endif
                                
                                @if ($item->qty_management==1&&$item->qty<1)
                                    [{{ __('Out of stock')}}] - {{ $item->name }}
                                @else
                                    <div class="res_title"><b><a onClick="setCurrentItem({{ $item->id }})" href="javascript:void(0)">{{ $item->name }}</a></b></div>
                                @endif

                                <div class="res_description">{{ $item->short_description}}</div>
                                <div class="row">
                                    <div class="col-6">
                                        <div class="res_mimimum">
                                            @if ($item->discounted_price>0)
                                                <span class="text-muted" style="text-decoration: line-through;">@money($item->discounted_price, config('settings.cashier_currency'),config('settings.do_convertion'))</span>
                                            @endif
                                            @money($item->price, config('settings.cashier_currency'),config('settings.do_convertion'))
                                        </div>
                                    </div>
                                    <div class="col-6">
                                        <div class="allergens" style="text-align: right;">
                                            @foreach ($item->allergens as $allergen)
                                             <div class='allergen' data-toggle="tooltip" data-placement="bottom" title="{{$allergen->title}}" >
                                                 <img  src="{{$allergen->image_link}}" />
                                             </div>
                                            @endforeach
                                             
                                        </div>
                                    </div>
                                </div>
                                
                                
                           
                            </div>
                        </div>
                    @endforeach
                </div>
            @endforeach
            @else
                <div class="row">
                    <div class="col-xl-12 col-lg-12 col-md-12 col-sm-12">
                        <p class="text-muted mb-0">{{ __('Hmmm... Nothing found!')}}</p>
                        <br/><br/><br/>
                        <div class="text-center" style="opacity: 0.2;">
                            <img src="https://www.jing.fm/clipimg/full/256-2560623_juice-clipart-pizza-box-pizza-box.png" width="200" height="200"></img>
                        </div>
                    </div>
                </div>
            @endif
            <!-- Check if is installed -->
            @if (isset($doWeHaveImpressumApp)&&$doWeHaveImpressumApp)
                
                <!-- Check if there is value -->
                @if (strlen($restorant->getConfig('impressum_value',''))>5)
                    <h3>{{  __(htmlspecialchars($restorant->getConfig('impressum_title',''))) }}</h3>