@extends('site.pages')

@section('title', $page_title)

@section('breadcrumb_content')
    <h1 class="mb-3">{{$page_title}}</h1>
    <nav aria-label="breadcrumb" class="d-block">
        <ul class="breadcrumb">
            <li class="breadcrumb-item"><a href="{{route('home')}}">{{__('pages.home')}}</a></li>
            <li class="breadcrumb-item active" aria-current="page">{{$page_title}}</li>
        </ul>
    </nav>
@endsection

@section('content')
    @include('site.partials.breadcrumb')
<!-- top Destination starts -->
<section class="trending pt-6 pb-0 bg-lgrey mb-5">
    <div class="container">
        <div class="text-center mb-4">
            <h2>Multi-Country Tours</h2>
            <p>{{ __('pages.multi_country_tours_content') }}</p>
        </div>
        <div class="row flex-row-reverse mb-5">
            <div class="col-lg-8">
                {{--
                <div class="list-results d-flex align-items-center justify-content-between">
                    <div class="list-results-sort">
                        <p class="m-0">Showing 1-5 of 80 results</p>
                    </div>
                    <div class="click-menu d-flex align-items-center justify-content-between">
                        <div class="sortby d-flex align-items-center justify-content-between ml-2">
                            <label>Sort by Duration</label>
                            <select class="niceSelect">
                                <option value="1">Sort By Duration</option>
                                <option value="2">Short to Long</option>
                                <option value="3">Long to Short</option>
                            </select>
                        </div>
                        <div class="sortby d-flex align-items-center justify-content-between ml-2">
                            <label>Sort by Price</label>
                            <select class="niceSelect">
                                <option value="1">Sort by Price</option>
                                <option value="2">Lowest price</option>
                                <option value="3">Highest price</option>
                            </select>
                        </div>
                    </div>
                </div>
                <!-- Gallery starts -->
                <div class="trending index-tags mb-3">
                    <ul class="section-tags">
                        <li><a href="#">Tour</a></li>
                        <li><a href="#">Rental</a></li>
                        <li><a href="#">City</a></li>
                        <li><a href="#">Yatch</a></li>
                        <li><a href="#">Activity</a></li>
                        <li><a href="#">Museum</a></li>
                        <li><a href="#">Beauty</a></li>
                        <li><a href="#">Programs</a></li>
                        <li><a href="#">Travel</a></li>
                    </ul>
                </div>
                <!-- Gallery Ends -->

                <div class="row">
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item rounded box-shadow">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending2.jpg" alt="image" class="">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Croatia</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Piazza Castello</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(12)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $170.00</span> | Per person
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending3.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Greece</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Santorini, Oia</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(38)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $180.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending4.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Maldives</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Hurawalhi Island</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(18)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $260.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending1.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 5 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Greece</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Santorini, Oia</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(38)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $180.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item rounded box-shadow">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending2.jpg" alt="image" class="">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Croatia</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Piazza Castello</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(12)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $170.00</span> | Per person
                                        </p>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending3.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Greece</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Santorini, Oia</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(38)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $180.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending5.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 9 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Maldives</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Hurawalhi Island</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(18)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $260.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>
                    <div class="col-lg-6 col-md-6 mb-4">
                        <div class="trend-item box-shadow rounded">
                            <div class="trend-image position-relative">
                                <img src="images/trending/trending6.jpg" alt="image">
                                <div class="color-overlay"></div>
                            </div>
                            <div class="trend-content p-4 pt-5 position-relative">
                                <div class="trend-meta bg-theme white px-3 py-2 rounded">
                                    <div class="entry-author">
                                        <i class="icon-calendar"></i>
                                        <span class="fw-bold"> 5 Days Tours</span>
                                    </div>
                                </div>
                                <h5 class="theme mb-1"><i class="flaticon-location-pin"></i> Greece</h5>
                                <h3 class="mb-1"><a href="tour-single1.html">Santorini, Oia</a></h3>
                                <div class="rating-main d-flex align-items-center pb-2">
                                    <div class="rating">
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                        <span class="fa fa-star checked"></span>
                                    </div>
                                    <span class="ms-2">(38)</span>
                                </div>
                                <p class=" border-b pb-2 mb-2">Duis aute irure dolor in reprehenderit in voluptate velit
                                    esse cillum</p>
                                <div class="entry-meta">
                                    <div class="entry-author d-flex align-items-center">
                                        <p class="mb-0"><span class="theme fw-bold fs-5"> $180.00</span> | Per person
                                        </p>
                                    </div>
                                </div>

                            </div>
                        </div>
                    </div>

                    <div class="col-lg-12">
                        <div class="text-center">
                            <!--<a href="#" class="nir-btn">Load More <i class="fa fa-long-arrow-alt-right"></i></a>-->

                            <nav aria-label="Page navigation example">
                                <ul class="pagination justify-content-center">
                                    <li class="page-item">
                                        <a class="page-link" href="#" aria-label="Previous">
                                            <span aria-hidden="true">&laquo;</span>
                                        </a>
                                    </li>
                                    <li class="page-item"><a class="page-link" href="#">1</a></li>
                                    <li class="page-item"><a class="page-link" href="#">2</a></li>
                                    <li class="page-item"><a class="page-link" href="#">3</a></li>
                                    <li class="page-item">
                                        <a class="page-link" href="#" aria-label="Next">
                                            <span aria-hidden="true">&raquo;</span>
                                        </a>
                                    </li>
                                </ul>
                            </nav>
                        </div>
                    </div>
                </div>
                    --}}
            </div>
            <div class="col-lg-4 pe-lg-4">
                <div class="sidebar-sticky">
                    <div class="list-sidebar">
                        <div class="sidebar-item mb-4">
                            <h3 class="">{{__('pages.categories')}} {{__('pages.type')}}</h3>
                            <ul class="sidebar-category1">
                                @foreach($data['categories'] as $category)
                                <li><input type="checkbox"> {{$category['name']}} </li>
                                @endforeach
                            </ul>
                        </div>
                        <div class="sidebar-item mb-4">
                            <h3 class="">{{__('pages.duration')}} {{__('pages.type')}}</h3>
                            <ul class="sidebar-category1">
                                @foreach($data['durations'] as $duration)
                                <li><input type="checkbox"> {{$duration}} </li>
                                @endforeach
                            </ul>
                        </div>
                        <div class="sidebar-item mb-4">
                            <h3 class="">{{__('pages.price')}}</h3>
                            <div class="range-slider mt-0">
                                <p class="text-start mb-2">{{__('pages.price_range')}}</p>
                                <div data-min="0" data-max="2000" data-unit="{{$basic_info['current_currency']}}" data-min-name="min_price"
                                     data-max-name="max_price"
                                     class="range-slider-ui ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all"
                                     aria-disabled="false">
                                    <span class="min-value">0 {{$basic_info['current_currency']}}</span>
                                    <span class="max-value">20000 {{$basic_info['current_currency']}}</span>
                                    <div class="ui-slider-range ui-widget-header ui-corner-all full"
                                         style="left: 0%; width: 100%;"></div>
                                </div>
                                <div class="clearfix"></div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection