@extends('frontend.include.layout')

@section('content')


    <section class="mt-50 mb-50">
        <div class="container">
            <div class="row">
                <div class="col-lg-9">
                    <div class="shop-product-fillter">
                        <div class="totall-product">



                        </div>


                        <div class="sort-by-product-area">
                            <div class="sort-by-cover mr-10">
                                <select id="actor-show"  class="form-control filteractordetails" style="width: 100% ! important;">
                                    <option value="24" selected>24</option>
                                    <option value="48">48</option>
                                    <option value="72">72</option>
                                    <option value="96">96</option>
                                </select>
                            </div>
                            <div class="sort-by-cover">
                                <select id="actor-filter-option"  class="form-control filteractordetails" style="width: 100% ! important;">
                                    <option value=" ">Select Option</option>
                                    <option value="1">Price Low to High</option>
                                    <option value="2">Price High to Low</option>
                                </select>
                            </div>
                        </div>

                    </div>


                    <div class="row product-grid-4" id="displayfilteractorlist">

                        @foreach($actor_details as $key => $actor_detail)

                            @include('frontend.include.actorsingle')

                        @endforeach

                    </div>


                    <!--pagination-->
{{--                    <div class="pagination-area mt-15 mb-sm-5 mb-lg-0">--}}
{{--                        <nav aria-label="Page navigation example">--}}
{{--                            <ul class="pagination justify-content-start">--}}
{{--                                <li class="page-item active"><a class="page-link" >01</a></li>--}}
{{--                            </ul>--}}
{{--                        </nav>--}}
{{--                    </div>--}}
                </div>
                <div class="col-lg-3 primary-sidebar sticky-sidebar">

                    <div class="row">
                        <div class="col-lg-12 col-mg-6"></div>
                        <div class="col-lg-12 col-mg-6"></div>
                    </div>

                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-6"><h5 class="section-title style-1 wow fadeIn animated">Refine By</h5></div>
                            <div class="col-md-6"><a><h5 class="section-title style-1  wow fadeIn animated">Clear filters</h5></div>
                        </div>

                    </div>


                    <div class="widget-category">
                        <div class="row">
                            <div class="col-md-12"><h5 class="section-title style-1 wow fadeIn animated">Verification</h5></div>
                            <div class="col-md-12 mt-15">
                                <input class="form-check-input filteractordetails" type="checkbox" name="verificationtype" displaytext="actor Verified" id="exampleVerification1" value="1">
                                <label class="form-check-label" for="exampleVerification1"><span>Actor Verified</span></label>
                                <br>
                                <input class="form-check-input filteractordetails" type="checkbox" name="verificationtype" displaytext="actor Unverified" id="exampleVerification2" value="2">
                                <label class="form-check-label" for="exampleVerification2"><span>Actor Unverified</span></label>

                            </div>
                        </div>

                    </div>

{{--                    <div class="widget-category">--}}
{{--                        <div class="row">--}}
{{--                            <div class="col-md-12"><h5 class="section-title style-1 wow fadeIn animated">Offerings</h5></div>--}}
{{--                            <div class="col-md-12 mt-15">--}}
{{--                                <input class="form-check-input filteractordetails" type="checkbox" name="salestype" displaytext="On Sale" id="exampleCheckbox1" value="1">--}}
{{--                                <label class="form-check-label" for="exampleCheckbox1"><span>2D Modelling</span></label>--}}
{{--                                <br>--}}
{{--                                <input class="form-check-input filteractordetails" type="checkbox" name="salestype" displaytext="Top Selling" id="exampleCheckbox2" value="2">--}}
{{--                                <label class="form-check-label" for="exampleCheckbox2"><span>3D Modelling</span></label>--}}
{{--                                <br>--}}
{{--                                <input class="form-check-input filteractordetails" type="checkbox" name="salestype" displaytext="Top New" id="exampleCheckbox3" value="3">--}}
{{--                                <label class="form-check-label" for="exampleCheckbox3"><span>4D Project Planning</span></label>--}}

{{--                            </div>--}}
{{--                        </div>--}}

{{--                    </div>--}}

{{--                    <div class="sidebar-widget price_range range mb-30">--}}
{{--                        <div class="widget-header position-relative  pb-10">--}}
{{--                            <h5 class="widget-title mb-10">Rate per Hour</h5>--}}
{{--                            <div class="bt-1 border-color-1"></div>--}}
{{--                        </div>--}}
{{--                        <div class="price-filter">--}}
{{--                            <div class="price-filter-inner">--}}
{{--                                <div id="slider-range"></div>--}}
{{--                                <div class="price_slider_amount">--}}
{{--                                    <div class="label-input">--}}
{{--                                        <input type="hidden" id="asset_range_min_val" value="-1">--}}
{{--                                        <input type="hidden" id="asset_range_max_val" value="900">--}}
{{--                                        <span>Range:</span><input type="text" class="filterassetdetails" id="amount" name="price" placeholder="Add Your Price" />--}}
{{--                                        <br>--}}
{{--                                        <br>--}}
{{--                                        <button type="button" class="button button-keywords filterassetdetails1">Filter</button>--}}
{{--                                    </div>--}}
{{--                                </div>--}}
{{--                            </div>--}}
{{--                        </div>--}}

{{--                    </div>--}}

                    <div class="widget-category mb-30">
                        <h5 class="section-title style-1 mb-30 wow fadeIn animated">Ratings</h5>

                        <div class="stars">
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                            <i class="fa-solid fa-star filterassetdetails"></i>
                        </div>
                        <br>
                        {{--                        <button type="submit" class="btn btn-primary btn-lg btn-block clickremovestarrating">Filter</button>--}}

                    </div>




                    <!-- Product sidebar Widget -->
                </div>
            </div>
        </div>
    </section>




    <style>
        .button-keywords {
            font-size: 14px;
            font-weight: 700;
            padding: 0px 8px;
            border-radius: 4px;
            color: #000;
            border: 1px solid #000000;
            background-color: #ffffff;
        }
    </style>

@endsection