@extends('layouts.frontend-layout')
@section('content')


    <section class="title-bar">
        <div class="container">
            <div class="row">
                <div class="col-md-6">
                    <div class="left-title-text">
                        <h3>Restaurant Detail </h3>
                    </div>
                </div>
                <div class="col-md-6">
                    <div class="right-title-text">
                        <ul>
                            <li class="breadcrumb-item"><a href="{{ route('main-site.index') }}">Home</a></li>
                            <li class="breadcrumb-item active" aria-current="page">Restaurant Detail</li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </section>


    <section class="all-partners">
        <div class="container">
            <div class="row">
                <div class="col-lg-8 col-md-12">
                    @if($shops->gallery)
                    <div id="sync1" class="owl-carousel owl-theme">
                        @foreach($shops->gallery as $key)
                        <div class="item">
                            <img src="{{ asset($key->image) }}" alt="" style="height: 400px; width: 100%; object-fit: fill">
                        </div>
                        @endforeach
                    </div>
                    <div id="sync2" class="owl-carousel owl-theme">
                        @foreach($shops->gallery as $key)
                        <div class="item">
                            <img src="{{ asset($key->image) }}" alt="" style="width: 100%; object-fit: fill">
                        </div>
                        @endforeach
                    </div>
                    @endif
                    <div class="profile-toolbar padding-b padding-t">
                        <div class="resto-detail" style="width: 100%;float: left;">
                            <div class="resto-picy" style="width: 30%;">
                                <a href="#"><img
                                        src="{{ asset($shops->shop_name_logo->logo) }}" alt="" style="width: 100%; object-fit: fill; height: 80px"></a>
                            </div>
                            <div class="name-location" style="width: 70%;">
                                <a href="#"><h1>{{ $shops->shop_name_logo->name }}</h1></a>
                                <p style="margin-bottom: 5px"><span><i class="fas fa-map-marker-alt"></i></span>
                                    @if($shops->contacts)
                                        @foreach($shops->contacts as $key2)
                                            @if ($loop->index == 0)
                                                {{ $key2->address }}
                                            @endif
                                        @endforeach
                                    @endif
                                </p>

                                <a href="https://{{$shops->sub_domain}}.xfoodonline.com" target="_blank" style="float: right;background: #ffa803;border: 1px solid #ffa803;color: #fff;margin: 0px 5px;padding: 10px;"><i class="fa fa-globe"></i> Go To Website</a>
                                @if($shops->category=="FOODCATERING")
                                    <a href="https://{{$shops->sub_domain}}.xfoodonline.com/reservation" target="_blank" style="float: right;background: #ffa803;border: 1px solid #ffa803;color: #fff;margin: 0px 5px;padding: 10px;"><i class="fa fa-shopping-cart"></i>  Reservation Now</a>
                                @else
                                <a href="https://{{$shops->sub_domain}}.xfoodonline.com/foods" target="_blank" style="float: right;background: #ffa803;border: 1px solid #ffa803;color: #fff;margin: 0px 5px;padding: 10px;"><i class="fa fa-shopping-cart"></i>  Order Now</a>
                                @endif
                            </div>
                        </div>
                    </div>
                    <div class="all-tabs">
                        <ul class="nav nav-tabs">
                            <li class="nav-item">
                                <a href="#overview" class="nav-link active" data-toggle="tab">Overview</a>
                            </li>
                            <li class="nav-item">
                                <a href="#menu" class="nav-link" data-toggle="tab">Menu</a>
                            </li>
{{--                            <li class="nav-item">--}}
{{--                                <a href="#reviews" class="nav-link" data-toggle="tab">Reviews</a>--}}
{{--                            </li>--}}
                            <li class="nav-item">
                                <a href="#map" class="nav-link" data-toggle="tab">Map</a>
                            </li>
                        </ul>
                        <div class="tab-content">
                            <div class="tab-pane active" id="overview">
                                <div class="restaurants-detail-bg " >
                                    <h4>About Restaurant</h4>
                                    <div class="overview-details">
                                        <div class="container">
                                            <div class="row">
                                                <div class="col-md-12 table-responsive">
                                                    <table class="table">
                                                        <tr>
                                                            <th>Name</th>
                                                            <td>:</td>
                                                            <td>
                                                                <p>{{ $shops->shop_name_logo->name }}</p>
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <th>Phone Number</th>
                                                            <td>:</td>
                                                            <td>
                                                                @foreach($shops->contacts as $key)
                                                                    <p>{{ $key->phone }}, {{ $key->phone2 }}</p>
                                                                @endforeach
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <th>Email</th>
                                                            <td>:</td>
                                                            <td>
                                                                @foreach($shops->contacts as $key)
                                                                    <p>{{ $key->email }}, {{$key->email2 }}</p>
                                                                @endforeach
                                                            </td>
                                                        </tr>
                                                        <tr>
                                                            <th>Address</th>
                                                            <td>:</td>
                                                            <td>
                                                                @foreach($shops->contacts as $key)
                                                                    <p >{{ $key->address }}</p>
                                                                @endforeach
                                                            </td>
                                                        </tr>
                                                    </table>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                <div class="restaurants-detail-bg mb-5">
                                    <h4>Description</h4>
                                    <p>{{ $shops->shop_name_logo->short_description }}</p>
                                </div>
                            </div>
                            <div class="tab-pane" id="menu">
                                <div class="restaurants-order-bg m-bottom">
                                    <h4>Restaurant Order Online Meals</h4>
                                    <div class="order-tabs">
                                        <ul class="nav nav-tabs">
                                            @foreach($shops->menus_category as $key)
                                            <li>
                                                <a href="#menuCategory{{$key->id}}" data-toggle="tab" class="{{ $loop->index==0?"active":"" }}">
                                                    <div class="meal-tab-icons">
                                                        <img src="{{ asset($key->image) }}"
                                                             class="img-responsive" alt="">
                                                        <p> {{ $key->name }} </p>
                                                    </div>
                                                </a>
                                            </li>
                                            @endforeach
                                        </ul>
                                    </div>
                                    <div class="tab-content">
                                        @foreach($shops->menus_category as $key)
                                        <div class="tab-pane {{ $loop->index==0?"active":"" }}" id="menuCategory{{$key->id}}">
                                            <div class="all-meals-tab">
                                                <h6>{{ $key->name }}</h6>
                                                <div class="all-meal-dt">
                                                    <div class="row">
                                                        @foreach($key->menus as $item)
                                                        <div class="col-md-12">
                                                            <div class="meals-dt">
                                                                <div class="meal-list">
                                                                    <ul class="list-unstyled">
                                                                        <li>
                                                                            <div class="caption-meal mb-2">
                                                                                <a href="#">
                                                                                    <h2 style="font-size: 22px">{{ $item->name }}</h2></a>
                                                                                <p style="color: #000; font-size: 16px">{{ $item->short_description }}</p>
                                                                                <p>৳{{ $item->price }}</p>
                                                                            </div>
                                                                        </li>
                                                                    </ul>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        @endforeach
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        @endforeach

                                    </div>
                                </div>
                            </div>
{{--                            <div class="tab-pane" id="reviews">--}}
{{--                                <div class="comment-post">--}}
{{--                                    <div class="post-items">--}}
{{--                                        <a href="https://www.gambolthemes.net/natto-new-demo/my_dashboard.html">--}}
{{--                                            <div class="img-dp">--}}
{{--                                                <i class="fas fa-user"></i>--}}
{{--                                            </div>--}}
{{--                                        </a>--}}
{{--                                        <div class="select-rating">--}}
{{--                                            <h4>Your Rating :</h4>--}}
{{--                                            <ul class="rating-stars">--}}
{{--                                                <li><i class="fas fa-star"></i></li>--}}
{{--                                                <li><i class="fas fa-star"></i></li>--}}
{{--                                                <li><i class="fas fa-star"></i></li>--}}
{{--                                                <li><i class="fas fa-star"></i></li>--}}
{{--                                                <li><i class="fas fa-star"></i></li>--}}
{{--                                            </ul>--}}
{{--                                        </div>--}}
{{--                                        <form>--}}
{{--                                        <textarea class="description-area" name="post"--}}
{{--                                                  placeholder="Please describe the reason for your rating to help the restaurant (150 words)"></textarea>--}}
{{--                                            <input type="text" class="rating-input" name="search"--}}
{{--                                                   placeholder="@ Tags with friends">--}}
{{--                                        </form>--}}
{{--                                        <div class="add-image">--}}
{{--                                            <input type="file" id="file">--}}
{{--                                            <label for="file"><i class="far fa-image"></i> Add Photo</label>--}}
{{--                                        </div>--}}
{{--                                        <div class="images">--}}
{{--                                            <div class="select-images">--}}
{{--                                                <ul>--}}
{{--                                                    <li class="image-select">--}}
{{--                                                        <img src="frontend/images/restaurant-detail/add-1.jpg" alt="">--}}
{{--                                                        <div class="close-icon">--}}
{{--                                                            <i class="fas fa-window-close"></i>--}}
{{--                                                        </div>--}}
{{--                                                    </li>--}}
{{--                                                    <li class="image-select">--}}
{{--                                                        <img src="frontend/images/restaurant-detail/add-2.jpg" alt="">--}}
{{--                                                        <div class="close-icon">--}}
{{--                                                            <i class="fas fa-window-close"></i>--}}
{{--                                                        </div>--}}
{{--                                                    </li>--}}
{{--                                                    <li class="image-select">--}}
{{--                                                        <img src="frontend/images/restaurant-detail/add-3.jpg" alt="">--}}
{{--                                                        <div class="close-icon">--}}
{{--                                                            <i class="fas fa-window-close"></i>--}}
{{--                                                        </div>--}}
{{--                                                    </li>--}}
{{--                                                </ul>--}}
{{--                                            </div>--}}
{{--                                        </div>--}}
{{--                                        <div class="publish">--}}
{{--                                            <form>--}}
{{--                                                <input class="rating-btn btn-link" type="submit" value="Publish Review">--}}
{{--                                            </form>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                </div>--}}
{{--                                <div class="main-comments">--}}
{{--                                    <div class="rating-1">--}}
{{--                                        <div class="user-detail-heading">--}}
{{--                                            <a href="user_profile_view.html"><img--}}
{{--                                                    src="frontend/images/recipe-details/comment-5.png"--}}
{{--                                                    alt=""></a>--}}
{{--                                            <h4> Joy Cutler</h4><br>--}}
{{--                                            <div class="rate-star">--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="far fa-star"></i>--}}
{{--                                                <span>4.5</span>--}}
{{--                                            </div>--}}
{{--                                        </div>--}}
{{--                                        <div class="reply-time">--}}
{{--                                            <p><i class="far fa-clock"></i>12 hours ago</p>--}}
{{--                                        </div>--}}
{{--                                        <div class="comment-description">--}}
{{--                                            <p>Morbi hendrerit ipsum vel feugiat maximus. Duis posuere justo neque, sit--}}
{{--                                                amet--}}
{{--                                                efficitur quam aliquam non. Integer gravida ex quis lacinia--}}
{{--                                                consectetur.</p>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                    <div class="review-tags">--}}
{{--                                        <p>--}}
{{--                                            <ins>Tags :</ins>--}}
{{--                                            <a href="#">Johnson,</a> <a href="#"> Jasica,</a><a href="#"> Joy--}}
{{--                                                William,</a>--}}
{{--                                            <a href="#"> Johnson,</a><a href="#"> Jass Singh,</a>&nbsp;--}}
{{--                                            <span> and</span>&nbsp;--}}
{{--                                            <a href="#">8 others</a></p>--}}
{{--                                    </div>--}}
{{--                                    <div class="post-images">--}}
{{--                                        <div class="select-images">--}}
{{--                                            <ul>--}}
{{--                                                <li class="image-select">--}}
{{--                                                    <img src="frontend/images/restaurant-detail/add-1.jpg" alt="">--}}
{{--                                                </li>--}}
{{--                                                <li class="image-select">--}}
{{--                                                    <img src="frontend/images/restaurant-detail/add-2.jpg" alt="">--}}
{{--                                                </li>--}}
{{--                                                <li class="image-select">--}}
{{--                                                    <img src="frontend/images/restaurant-detail/add-3.jpg" alt="">--}}
{{--                                                </li>--}}
{{--                                            </ul>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                    <div class="like-comment-dt">--}}
{{--                                        <ul>--}}
{{--                                            <li>--}}
{{--                                                <span class="views" data-toggle="tooltip" data-placement="top" title="Likes">--}}
{{--                                                <i class="fas fa-heart"></i>--}}
{{--                                                <ins>Like 562</ins>--}}
{{--                                                </span>--}}
{{--                                            </li>--}}
{{--                                            <li>--}}
{{--                                                <span class="views" data-toggle="tooltip" data-placement="top" title="Comments">--}}
{{--                                                <i class="fas fa-comment-alt"></i>--}}
{{--                                                <ins>Comments 01</ins>--}}
{{--                                                </span>--}}
{{--                                            </li>--}}
{{--                                        </ul>--}}
{{--                                    </div>--}}
{{--                                    <div class="reply-review-1">--}}
{{--                                        <div class="user-detail-heading">--}}
{{--                                            <a href="user_profile_view.html"><img--}}
{{--                                                    src="frontend/images/recipe-details/reply-1.png"--}}
{{--                                                    alt=""></a>--}}
{{--                                            <h4>Rock Smith</h4>--}}
{{--                                        </div>--}}
{{--                                        <div class="reply-time">--}}
{{--                                            <p><i class="far fa-clock"></i>2 hours ago</p>--}}
{{--                                        </div>--}}
{{--                                        <div class="comment-description">--}}
{{--                                            <p> Thank you</p>--}}
{{--                                        </div>--}}
{{--                                        <div class="like-report">--}}
{{--                                            <ul>--}}
{{--                                                <li>--}}
{{--                                                    <span class="views" data-toggle="tooltip" data-placement="top" title="Likes">--}}
{{--                                                    <i class="fas fa-heart"></i>--}}
{{--                                                    <ins>Like 1</ins>--}}
{{--                                                    </span>--}}
{{--                                                </li>--}}
{{--                                                <li>--}}
{{--                                                    <span class="views" data-toggle="tooltip" data-placement="top" title="Comments">--}}
{{--                                                    <ins>Report</ins>--}}
{{--                                                    </span>--}}
{{--                                                </li>--}}
{{--                                            </ul>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                    <div class="reply-comment">--}}
{{--                                        <div class="post-items">--}}
{{--                                            <div class="reply-dp">--}}
{{--                                                <a href="https://www.gambolthemes.net/natto-new-demo/my_dashboard.html"><img--}}
{{--                                                        src="frontend/images/recipe-details/reply-1.png" alt=""></a>--}}
{{--                                            </div>--}}
{{--                                            <form>--}}
{{--                                                <input type="text" class="comment-input" name="post"--}}
{{--                                                       placeholder="Write a comment - @tag friends">--}}
{{--                                                <input class="reply-btn btn-link" type="submit" value="Post Comment">--}}
{{--                                            </form>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                </div>--}}
{{--                                <div class="main-comments">--}}
{{--                                    <div class="rating-1">--}}
{{--                                        <div class="user-detail-heading">--}}
{{--                                            <a href="user_profile_view.html"><img--}}
{{--                                                    src="frontend/images/recipe-details/comment-4.png"--}}
{{--                                                    alt=""></a>--}}
{{--                                            <h4> Rock Smith</h4><br>--}}
{{--                                            <div class="rate-star">--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="fas fa-star"></i>--}}
{{--                                                <i class="far fa-star"></i>--}}
{{--                                                <span>4.5</span>--}}
{{--                                            </div>--}}
{{--                                        </div>--}}
{{--                                        <div class="reply-time">--}}
{{--                                            <p><i class="far fa-clock"></i>13 hours ago</p>--}}
{{--                                        </div>--}}
{{--                                        <div class="comment-description">--}}
{{--                                            <p>Duis posuere justo neque, sit amet efficitur quam aliquam non. Integer--}}
{{--                                                gravida ex quis lacinia consectetur.</p>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                    <div class="review-tags">--}}
{{--                                        <p>--}}
{{--                                            <ins>Tags :</ins>--}}
{{--                                            <a href="#">Johnson,</a> <a href="#"> Jasica,</a><a href="#"> Joy--}}
{{--                                                William,</a>--}}
{{--                                            <a href="#"> Johnson,</a><a href="#"> Jass Singh,</a>&nbsp;--}}
{{--                                            <span> and</span>&nbsp;--}}
{{--                                            <a href="#">8 others</a></p>--}}
{{--                                    </div>--}}
{{--                                    <div class="like-comment-dt">--}}
{{--                                        <ul>--}}
{{--                                            <li>--}}
{{--<span class="views" data-toggle="tooltip" data-placement="top" title="Likes">--}}
{{--<i class="fas fa-heart"></i>--}}
{{--<ins>Like 562</ins>--}}
{{--</span>--}}
{{--                                            </li>--}}
{{--                                            <li>--}}
{{--<span class="views" data-toggle="tooltip" data-placement="top" title="Comments">--}}
{{--<i class="fas fa-comment-alt"></i>--}}
{{--<ins>Comments 0</ins>--}}
{{--</span>--}}
{{--                                            </li>--}}
{{--                                        </ul>--}}
{{--                                    </div>--}}
{{--                                    <div class="reply-comment">--}}
{{--                                        <div class="post-items">--}}
{{--                                            <div class="reply-dp">--}}
{{--                                                <a href="https://www.gambolthemes.net/natto-new-demo/my_dashboard.html"><img--}}
{{--                                                        src="frontend/images/recipe-details/reply-1.png" alt=""></a>--}}
{{--                                            </div>--}}
{{--                                            <form>--}}
{{--                                                <input type="text" class="comment-input" name="post"--}}
{{--                                                       placeholder="Write a comment - @tag friends">--}}
{{--                                                <input class="reply-btn btn-link" type="submit" value="Post Comment">--}}
{{--                                            </form>--}}
{{--                                        </div>--}}
{{--                                    </div>--}}
{{--                                </div>--}}
{{--                                <div class="spinner m-bottom">--}}
{{--                                    <div class="d-flex justify-content-center">--}}
{{--                                        <a href="#">--}}
{{--                                            <div class="spinner-border" role="status">--}}
{{--                                                <span class="sr-only">Loading...</span>--}}
{{--                                            </div>--}}
{{--                                        </a>--}}
{{--                                    </div>--}}
{{--                                </div>--}}
{{--                            </div>--}}
                            <div class="tab-pane" id="map">
                                <div class="restaurants-detail-bg m-bottom p-2">
                                    <h4>Our Location</h4>
                                    @foreach($shops->contacts as $key2)
                                        @if ($loop->index == 0)
                                            @php $address =  $key2->address @endphp
                                        @endif
                                    @endforeach
                                    <iframe width="100%" height="480" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="https://maps.google.it/maps?q=&output=embed"></iframe>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-4 col-md-4">
                    <div class="popular-restaurants">
                        <h4>Related Sister Concern </h4>
                        <div class="popular-restaurants-items">
                            <ul class="list-unstyled">

                                @foreach($shopList as $key)
                                    @if($key->shop_name_logo)
                                        <li>
                                            <a href="{{ route('main-site.restaurant-details',['id'=>$key->sub_domain]) }}">
                                                <img src="{{ asset($key->shop_name_logo->logo) }}" class="img-responsive" alt="image" title="{{ $key->shop_name_logo->name }}"></a>
                                            <div class="caption">
                                                <a href="{{ route('main-site.restaurant-details',['id'=>$key->sub_domain]) }}"><h4>{{ $key->shop_name_logo->name }}</h4></a>
                                                @if($key->contacts)
                                                    @foreach($key->contacts as $key2)
                                                        @if ($loop->index == 0)
                                                            <p>{{ $key2->address }}</p>
                                                        @endif
                                                    @endforeach
                                                @endif
                                            </div>
                                        </li>
                                    @endif
                                @endforeach
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <script
        src="https://code.jquery.com/jquery-3.6.0.min.js"
        integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
        crossorigin="anonymous"></script>
@endsection