@include('Website::web-builder.widget._back_title',compact('title'))
<style>
    .config-body.listing {
        padding: 0;
    }

    .card {
        border: none;
        width: 100%;
    }

    .card-header {
        padding: 0;
        border: none !important;
        width: 100%;
    }

    .card-header .btn.btn-link {
        border: none !important;
        width: 100%;
        margin: 0 !important;
        padding: 0 !important;
        color: #000 !important;
    }

    .card-body {
        padding: 15px;
    }

    .card-body form {
        padding: 15px;
    }

    .config-body.listing .section-item {
        padding-left: 15px;
        padding-right: 15px;
    }
</style>
<section class="mobile-product">
    <div class="config-box">
        <div class="config-heading">
            Settings
        </div>
        <div class="config-body">
            <form method="post">

                <input type="hidden" name="widget[type]" value="{{ $widget->type }}">
                <input type="hidden" name="widget[id]" value="{{ $widget->id }}">
                <input type="hidden" name="widget[width]" value="{{ isset($settings['width']) ? $settings['width'] : "" }}">
                <input type="hidden" name="widget[height]" value="{{ isset($settings['height']) ? $settings['height'] : "" }}">

                <div class="form-group">
                    <label id="heading-label" for="heading">Image</label>
                        <div class="image-upload-box selected_mobile_category" style="background-image:url({{url($image_url)}}); background-repeat:
                            no-repeat;background-size: cover">
                        <button class="btn-primary" type="button" href="javascript:void(0);" onclick="openGallery('mobile-category')">
                            Select Image
                        </button>
                            <input  id="media_id" type="hidden" name="widget[media_id]" value="{{ isset($settings['media_id']) ? $settings['media_id'] : "" }}">
                    </div>
                </div>
                                <div class="form-group">
                    <label for="category_id">Category</label>
                    <select class="form-control" id="category_id" name="widget[category_id]">
                        <option value="">Select</option>
                        @foreach($categories as $category)
                            <option value="{{$category->id}}" {{ $category->id == $selected_category ? 'selected' : '' }}>{{$category->title}}</option>
                            @foreach($category->children as $sub)
                                <option value="{{$sub->id}}" {{ $sub->id ==$selected_category ? 'selected' : '' }}>&nbsp;&nbsp;{{$sub->title}}</option>
                                @foreach($sub->children as $subsub)
                                    <option value="{{$subsub->id}}" {{ $subsub->id == $selected_category ? 'selected' : '' }}> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {{$subsub->title}}</option>
                                @endforeach
                            @endforeach
                        @endforeach
                    </select>
                </div>


            </form>

        </div>
        @include('Website::web-builder.widget._remove_section')
    </div>
</section>