@extends("layout.app")
@section("content")
<div class="text-center cta cta-4 border--bottom bg--dark">
                <div class="container">
                   <div class="row">
                        <div class="col-sm-12">
                         <div class="tabs-container" data-content-align="left">
                                <ul class="tabs nav">
                                 @foreach($sub_categories as $menu_sub_category)
                                    <li><a href="{{url("$category->slug/$menu_sub_category->slug")}}">
                                        <div class="tab__title text-center">
                                            <i class="ihouse-{{$menu_sub_category->icon}} block"></i>
                                            <span class="h5">{{$menu_sub_category->title}}</span>
                                        </div>
                                        </a>

                                    </li>
                                    @endforeach

                                </ul>
                            </div>
                        </div>
                    </div>
                    <!--end of row-->
                </div>
                <!--end of container-->
            </div>
<section>
    <div class="container">
        <div class="row">
            <div class="col-sm-12">
                <h1 class="text-center">{{$sub_category->title}}</h1>

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

<section class="text-center">
    <div class="container">
        <div class="row">
            <div class="col-md-12">
                @if($tab && $tab_specs->count()>1)
                 <div class="tabs-container" data-content-align="left">
                                <ul class="tabs">
                                    @foreach($tab_specs as $tab_spec)
                                    <li @if($loop->index==0) class="active" @endif>
                                        <div class="tab__title">
                                            <span class="h5">{{$tab_spec->title}}</span>
                                        </div>
                                        <div class="tab__content">
                                           @foreach($tab_spec->items as $item)
                                         @php switch($tab_spec->items->count()) {
                                            case '2':
                                                $class = "col-sm-3 col-sm-offset-2";
                                                break;
                                            case '4':
                                                $class = "col-sm-3";
                                                break;
                                            case '3':
                                                $class = "col-sm-3  col-sm-offset-1";
                                                break;

                                            default:
                                                $class = "col-sm-3  col-sm-offset-2";
                                                break;
                                        } @endphp
                                                <div class="{{$class}}">
                                                    <div
                                                        class="animated fadeInUp pricing boxed boxed--sm pricing-2 text-center">
                                                        <div class="image-column">
                                                            @if($item->item_colors->count()>0)
                                                                <img @if($loop->index==0)  class="active" @endif
                                                                id="current-image-{{$item->id}}"
                                                                     data-image="{{$item->item_colors()->first()->image_default}}"
                                                                     src="{{url("https://cdn.ihouse.ps/{$item->item_colors()->first()->image_default}")}}"
                                                                     alt="">
                                                                @foreach($item->item_colors as $color)
                                                                    <img style="display:none"
                                                                         id="image-selector-{{$item->id}}-{{$color->color->id}}"
                                                                         src="{{url("https://cdn.ihouse.ps/".$color->image_default)}}">
                                                                @endforeach
                                                            @endif
                                                        </div>


                                                        <h4>{{$item->name}}
                                                            @foreach($item->specifications()->whereHas('spec_category', function ($query) {
                                                                $query->where('is_upgradable', 0);
                                                                $query->where('is_on_title', 1);
                                                                $query->orderBy('order', "asc");
                                                            })->get() as $spec)
                                                    {{$spec->short_title}}
                                                    @endforeach