@extends('layout.layout')
@section('meta')
    @include('layout.partials.seo', [
        'title' => $subCategory->meta_title,
        'description' => $subCategory->meta_description,
        'keywords' => $subCategory->meta_keywords,
        'image' => $subCategory->getFirstMediaUrlOrDefault(MediaHelper::SUB_CATEGORY_MEDIA_PATH, 'webp')['url'],
        'schema' => $subCategory->schema
    ])
@endsection
@section('content')
    <div class="wpo-breadcumb-area" style="background: url({{$subCategory->getFirstMediaUrlOrDefault(MediaHelper::SUB_CATEGORY_BANNER_MEDIA_PATH, 'webp')['url']}}) no-repeat center top/cover;"
         title="{{$subCategory->getFirstMediaUrlOrDefault(MediaHelper::SUB_CATEGORY_BANNER_MEDIA_PATH)['title']}}"
         role="img" aria-label="{{$subCategory->getFirstMediaUrlOrDefault(MediaHelper::SUB_CATEGORY_BANNER_MEDIA_PATH)['alt']}}">
        <div class="container">
            <div class="row">
                <div class="col-12">
                    <div class="wpo-breadcumb-wrap">
                        <h1>{{ $subCategory->name }}</h1>
                        <ul>
                            <li><a href="{{ route('home') }}">{{ __('general.home') }}</a></li>
                            <li><a href="{{route('category', [$country->slug, $category->slug])}}">{{ $category->name }}</a></li>
                            <li><span>{{ $subCategory->name }}</span></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="container mt-5 mb-5">
        <div class="row">
            <div class="col-lg-9 col-xl-9 col-md-8 col-12 order-lg-2">
                <Div class="row">
                    <div class="col-lg-12 col-xl-12 col-12 col-md-12">
                        <div class="tools-ber">
                            <div class="row">
                                <div class="col-xs-6 col-sm-3 col-md-3">
                                    <!-- filters select -->

                                    <form action="{{ route('subCategory', ['country_slug'=>$country->slug, 'category_slug'=>$category->slug,'subCategory_slug'=> $subCategory->slug]) }}" method="get" id="pricefilterForm">
                                     <div class="select-filters">
                                        <select id="sortBy"   class="nice-sel sort-price" role="form" name="sortBy" class="small right">
                                            @if (request()->get("sortBy") == null)
                                                <option value="" selected disabled>{{ __('tour.sort_placeholder') }}</option>
                                            @endif
                                            <option value="All" {{session()->get('All')?'selected' :''}}>{{__('tour.all')}}</option>
                                            <option value="Newestontop" {{session()->get('Newestontop')?'selected' :''}}>{{__('tour.newest_on_top')}}</option>
                                            <option value="Oldestontop" {{session()->get('Oldestontop')?'selected' :''}}>{{__('tour.oldest_on_top')}}</option>
                                            <option value="PriceLowtoHigh" {{session()->get('PriceLowtoHigh')?'selected' :''}}>{{__('tour.price_low_to_high')}}</option>
                                            <option value="PriceHightoLow" {{session()->get('PriceHightoLow')?'selected' :''}}>{{__('tour.price_high_to_low')}}</option>
                                        </select>

                                    </div>
                                </div>
                                <div class="col-xs-6 col-sm-6 col-md-6">
                                    <p class="num_tours">&nbsp;{{__('tour.tours_available')}}&nbsp;<b>{{ $tours->count() }}</b></p>
                                </div>
                            </div>
                        </div>
                        <div class="row">
                            @foreach($tours as $tour)
                            <div class="col-lg-12 col-xl-12 col-md-12">
                                @include('layout.partials.tour-box', ['tour' => $tour])
                            </div>
                            @endforeach
                        </div>

                        <div class="row">
                         {!!$tours->withQueryString()->onEachSide(2)->links() !!}

                        </div>

                    </div>
                </Div>
            </div>
            <div class="col-lg-3 col-xl-3 col-md-4 col-12 order-lg-1">
                {{-- Start Filter Price--}}
                @if($tours->count() > 0)
                <div class="blog-sidebar room-sidebar filter-block">
                    <div class="price-slider">
                        <div class="widget price mb-30" style="background-color: #ffffff!important;padding: 0!important; ">
                            {{--                                                <h6 class="widget-title">{{__("Price")}}</h6>--}}
                            <div class="widget-desc">
                                <div class="slider-range">
                                    <div id="slider_range" data-min="{{ CurrencyHelper::displayFilterPrice($minPrice) }}" data-max="{{ CurrencyHelper::displayFilterPrice($maxPrice) }}" data-unit="{{ CurrencyHelper::get('symbol') }}" class="slider-range-price ui-slider ui-slider-horizontal ui-widget ui-widget-content ui-corner-all price-symbol" data-value-min="{{ CurrencyHelper::displayFilterPrice($minPrice) }}" data-value-max="{{ CurrencyHelper::displayFilterPrice($maxPrice) }}" >
                                        <div class="ui-slider-range ui-widget-header ui-corner-all"></div>
                                        <span class="ui-slider-handle ui-state-default ui-corner-all" tabindex="0"></span>
                                        <span class="ui-slider-handle ui-state-default ui-corner-all" tabindex="0"></span>
                                    </div>

                                    <input class="my-2" id="amount" type="text"  style="border:none; background:none;" value="@if(session()->has('price')) {{ str_replace('', '', session()->get('symbolWithPrice')) }} @else {{ CurrencyHelper::get('symbol') }} {{ CurrencyHelper::displayFilterPrice($minPrice) }} - {{ CurrencyHelper::get('symbol') }} {{ CurrencyHelper::displayFilterPrice($maxPrice) }} @endif " readonly>
                                    <input class="my-2" id="amount_value" type="text" name="price" style="border:none; background:none;position: absolute;top:0;left:0;opacity:0;" value="{{request()->get("price")}}"  readonly>
                                    <button type="submit" class="btn btn-sm btn-primary styleprimary">{{__('Filter')}}</button>
                                </div>
                            </div>
                        </div>
                    </div><!-- end price-slider -->
                </div>
                @endif


                <div class="blog-sidebar room-sidebar filter-block">
                    <div class="card-body text-left">
                        <h3 class="mb-4">{{__('general.select_category')}}</h3>
                        <ul class="list-unstyled">
                            @foreach($allsubCategories as $child)
                            <li class="custom-check">
                                <a class="custome-color-link" href="{{ route('subCategory', [$child->category->country->slug, $child->category->slug, $child->slug]) }}"> <i class="fa fa-arrow-right"></i> <label class="custome-color-link"> {{$child->name}} </label> </a>
                            </li>
                            @endforeach
                        </ul>
                    </div>
                </div>


                <div class="blog-sidebar room-sidebar filter-block">
                    <div class="support-block">
                        <h3>{{__('tour.need_help')}}</h3>
                        <p>
                            {{__('tour.need_help_description')}}
                        </p>
                        @if(!empty($settings['site_phone']))
                        <div class="support-contact">
                            <span><i class="fa fa-phone"></i></span>
                            <p>{{ $settings['site_phone'] ?? '' }}</p>
                        </div>
                        @endif
                        <!-- end support-contact -->
                    </div>
                </div>


            </div>

        </div>
    </div>

    @include('layout.partials.newsletter')
    @include('layout.partials.faq')
    @include('layout.partials.partner')

@endsection