@extends('layouts.welcomelayouts.app')
@section('title')
<title> {{ $subsubcat->title }}  - {{$appSetting->h1}} | {{$appSetting->slogan}}</title>
@endsection
@section('SEO')
<meta name="description" content="{!!$appSetting->meta_description!!}">
<meta name="keywords" content="{{$appSetting->meta_keyword}}">
<meta property="og:title" content="{{ $subsubcat->title }} - {{$appSetting->h1}} {{$appSetting->slogan}}">
<meta property="og:description" content="{!!$appSetting->meta_description!!}">
<meta property="og:image" content="{asset($appSetting->logo())}}">
<meta property="og:url" content="{{ route('welcome.productSubsubcategory',[$subsubcat,new_slug($subsubcat->title)]) }}">
@endsection
@push('css')
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.12.1/jquery-ui.css" type="text/css" media="all" />
<style>
    .branddiv{
        background: #fff;
        margin: 10px 0;
        padding: 10px;
    }
    .productsdivctg{
        background: white;
        min-height: 500px;
    }
    ul.brandlist {
    margin: 0;
    list-style: none;
    padding: 0;
    }
    ul.brandlist li a {
        color: gray;
    }
    
   
.sliderText{
    width:100%;
    margin-bottom:30px;
    border-bottom: 2px solid red;
    padding: 10px 0 10px 0px;
    font-weight:bold;
}

.ui-slider-horizontal {
    height: .6em;
}
.ui-slider-horizontal {
    margin-bottom: 15px;
    width:100%;
}
.ui-widget-header {
    background: #3FE331;
}

.price-range-search {
    width:40.5%; 
    background-color: #f9f9f9; 
    border: 1px solid #6e6666;
    min-width: 40%;
    display: inline-block;
    height: 32px;
    border-radius: 5px;
    float: left;
    margin-bottom:20px;
    font-size:16px;
}
.price-range-field{
    width:45%; 
    min-width: 16%;
    background-color:#f9f9f9; 
    border: 1px solid #6e6666; 
    color: black; 
    font-family: myFont; 
    font: normal 14px Arial, Helvetica, sans-serif; 
    border-radius: 5px; 
    height:26px; 
    padding:5px;
}
.search-results-block{
    position: relative;
    display: block;
    clear: both;
}
    
</style>
@endpush
@section('contents')

<div class="row" style="background: #e7e7e7;margin: 0;">
            <div class="col-md-2 hidemobiletopsidebar" style="padding: 0;">
                @include('layouts.welcomelayouts.topsidebarmenu')
            </div>
            <div class="col-md-10" style="background: white;">
                <p style="margin: 0;cursor: pointer;padding: 5px;">
                    <a style="text-decoration: none;color: gray;font-size: 14px;" href="{{ route('welcome.productCategory',[$subsubcat->category_id,new_slug($subsubcat->category->title)]) }}">{{ $subsubcat->category->title }} 
                    </a>
                        <i class="fas fa-chevron-right"></i>
                    <a style="text-decoration: none;color: gray;font-size: 14px;" href="{{ route('welcome.productSubcategory',[$subsubcat->subcategory_id,new_slug($subsubcat->subcategory->title)]) }}"> {{ $subsubcat->subcategory->title }}

                    </a> 
                    <i class="fas fa-chevron-right"></i> 
                    <a style="text-decoration: none;color: gray;font-size: 14px;" href="{{ route('welcome.productSubsubcategory',[$subsubcat,new_slug($subsubcat->title)]) }}">{{ $subsubcat->title }} 
                    </a>
                </p>
            </div>
                    
        </div>

        <div style="border-top: 2px solid #c6c6c6;">
                        <div class="row" style="margin:0;">
                <div class="col-md-2" style="padding:0;">
                    @include('welcome.products.sidebar')
                </div>