@extends('admin.layouts.app')
@section('title')
    {{ __('edit') }}
@endsection
@section('content')
    @if (userCan('plan.update'))
        <div class="container-fluid">
            <div class="row">
                <div class="col-md-12">
                    <div class="card">
                        <div class="card-header">
                            <h3 class="card-title line-height-36">{{ __('edit') }} {{ __('plan') }}</h3>
                            <a href="{{ route('module.plan.index') }}"
                                class="btn bg-primary float-right d-flex align-items-center justify-content-center">
                                <i class="fas fa-arrow-left"></i>&nbsp; {{ __('back') }}
                            </a>
                        </div>
                        <div class="card-body">
                            <div class="row justify-content-center">
                                <div class="col-md-8">
                                    <form action="{{ route('module.plan.update', @$plan->id) }}" method="POST">
                                        @csrf
                                        @method('PUT')
                                        <div class="row">
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="title">{{ __('Plan Title') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="text" id="title" name="title" value="{{@$plan->title}}"
                                                        class="form-control @error('title') is-invalid @enderror"
                                                        placeholder="{{ __('Enter Title') }}{{ defaultCurrencySymbol() }}">
                                                    @error('title')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="plan_category">{{ __('Plan Category') }} <small
                                                        class="text-danger">*</small></label>
                                                        <select id="plan_category" class="form-control">
                                                            <option value=" {{@$plan->planCategory->parentCategory->name}}">{{$plan->planCategory->parentCategory->name}}</option>
                                                            @foreach (@$planCategories as $category)
                                                                <option value="{{@$category->name}}" data-value="{{@$category->id}}">{{@$category->name}}</option>
                                                            @endforeach
                                                        </select>
                                                    @error('category')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="plan_sub_category">{{ __('Sub Category') }} <small
                                                        class="text-danger">*</small></label>
                                                        <select name="plan_category_id" id="plan_sub_category" class="form-control @error('plan_category_id') is-invalid @enderror">
                                                            <option value="{{@$plan->planCategory->id}}">{{@$plan->planCategory->name}}</option>
                                                        </select>
                                                </div>
                                                @error('plan_category_id')
                                                    <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                @enderror
                                            </div>
                                            {{-- <div class="plan_sub_category">
                                                <select name="plan_category" id="plan_category">
                                                    <option value="">Select Sub Category</option>
                                                </select>
                                            </div> --}}
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="price">{{ __('Code') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="text" id="code" name="code" value="{{@$plan->code}}"
                                                        class="form-control @error('code') is-invalid @enderror"
                                                        placeholder="{{ __('GD123') }}{{ defaultCurrencySymbol() }}">
                                                    @error('code')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="price">{{ __('price') }}
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="number" id="price" name="price" value="{{@$plan->price}}"
                                                        class="form-control @error('price') is-invalid @enderror"
                                                        placeholder="EX: 100000{{ defaultCurrencySymbol() }}" oninput="this.value = this.value.replace(/[^0-9.]/g, '').substring(0, 10);">
                                                    @error('price')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="offer_price">Offer Price
                                                        {{ defaultCurrencySymbol() }}<small
                                                            class="text-danger">*</small></label>
                                                    <input type="text" id="offer_price" name="offer_price" value="{{ old('offer_price',@$plan->offer_price) }}"
                                                        class="form-control @error('offer_price') is-invalid @enderror"
                                                        placeholder="EX: 100000{{ defaultCurrencySymbol() }}" oninput="this.value = this.value.replace(/[^0-9.]/g, '').substring(0, 10);">
                                                    @error('offer_price')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="duration">Duration (Number of Days)
                                                       <small
                                                            class="text-danger">*</small></label>
                                                    <input type="text" id="duration" name="duration" value="{{ old('duration',@$plan->duration) }}"
                                                        class="form-control @error('duration') is-invalid @enderror"
                                                        placeholder="EX: 356" oninput="this.value = this.value.replace(/[^0-9]/g, '').substring(0, 5);" >
                                                    @error('duration')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6">
                                                <div class="form-group">
                                                    <label class="form-label" for="country">{{ __('Country') }} <small
                                                        class="text-danger">*</small></label>
                                                        <select name="country_id" id="country" class="form-control select2bs4 w-100-p @error('country_id') is-invalid @enderror">
                                                            <option {{ request('country') ? '' : 'selected' }} value="{{ @$plan->country->id }}" selected>
                                                                {{ @$plan->country->name }}
                                                            </option>
                                                            @foreach (@$countries as $country)
                                                                <option {{ request('country') == $country['id'] ? 'selected' : '' }} value="{{ @$country['id'] }}">{{ @$country['name'] }}</option>
                                                            @endforeach
                                                        </select>
                                                    @error('country_id')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            <div class="col-md-6 mt-1 mb-3">
                                                <div class="form-group">
                                                    <label class="form-label" for="frontend_show">
                                                        {{ __('show_frontend') }} <small class="text-danger">*</small>
                                                    </label> <br>
                                                    <div class="border borderHeight rounded">
                                                        @if(@$plan->frontend_show == 'true')
                                                            <div class="custom-control custom-radio custom-control-inline">
                                                                <input type="radio" id="show_frontend_yes" name="frontend_show" class="plan_type_selection custom-control-input" value="1" checked>
                                                                <label class="custom-control-label" for="show_frontend_yes">{{ __('yes') }}</label>
                                                            </div>
                                                            <div class="custom-control custom-radio custom-control-inline">
                                                                <input type="radio" id="show_frontend_no" name="frontend_show" class="plan_type_selection custom-control-input" value="0">
                                                                <label class="custom-control-label" for="show_frontend_no">
                                                                    {{ __('no') }}
                                                                </label>
                                                            </div>
                                                        @else
                                                            <div class="custom-control custom-radio custom-control-inline">
                                                                <input type="radio" id="show_frontend_yes" name="frontend_show" class="plan_type_selection custom-control-input" value="1">
                                                                <label class="custom-control-label" for="show_frontend_yes">{{ __('yes') }}</label>
                                                            </div>
                                                            <div class="custom-control custom-radio custom-control-inline">
                                                                <input type="radio" id="show_frontend_no" name="frontend_show" class="plan_type_selection custom-control-input" value="0" checked>
                                                                <label class="custom-control-label" for="show_frontend_no">
                                                                    {{ __('no') }}
                                                                </label>
                                                            </div>
                                                        @endif
                                                    </div>
                                                    @error('frontend_show')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                            @php
                                                $count = 1;
                                                $key_name = "";
                                                $value = "";
                                                $custom_value = "";
                                            @endphp
                                             
                                            @foreach (old('features', []) as $feature)
                                                @if($flag == 1)
                                                     
                                                @break
                                                @endif
                                            @endforeach

                                            <div class="row">
                                                <input type="hidden" name="" value="{{$last_key}}" id="last_key">
                                                <div class="" >
                                                    <div id="links">
                                                        <div class="row ">
                                                            <div class="form-group col-4">
                                                                <x-forms.label name="Features Name" :required="false" />
                                                                <x-forms.input type="text" name="features[0][key_name]" id="features[0][key_name]"
                                                                value="{{ !empty($features[0]) ? $features[0]->key_name : '' }}"
                                                                    placeholder="Enter Features Name" />
                                                                    <small class="text-danger"></small>
                                                            </div>
                                                            {{-- <div class="form-group col-5">
                                                                <x-forms.label name="Features Value" :required="false" />
                                                                <x-forms.input type="text" name="features[0][value]" id="features[0][value]"
                                    
                                                                    value="{{ !empty($features[0]) ? $features[0]->value : '' }}"
                                                                    placeholder="Enter Features Value" />
                                                                    <small class="text-danger"></small>
                                                            </div> --}}
                                                            <div class="form-group col-3">
                                                                <x-forms.label name="Features selected" :required="false" />
                                                                <select name="features[0][value]" id="features[0][value]" class="feature_selected form-control select2bs4 w-100-p @error('feature_selected') is-invalid @enderror" onchange="featureHideShow(0)">
                                                                    <option value="1" @if(!empty($features[0]) && $features[0]->value == "1") selected @endif>YES</option>
                                                                    <option value="0" @if(!empty($features[0]) && $features[0]->value == "0") selected @endif>NO</option>
                                                                    <option value="custom" @if(!empty($features[0]) && $features[0]->value == "custom") selected @endif>Custom</option>
                                                                </select>
                                                            </div>
                                                            <div class="form-group col-3 featureHide" id="featureHide0" @if(!empty($features[0]) && $features[0]->value != "custom") style="display: none;" @endif >
                                                                <x-forms.label name="Custom Value" :required="false" />
                                                                <x-forms.input type="text" name="features[0][custom_value]" id="features[0][custom_value]"
                                    
                                                                    value="{{ !empty($features[0]) ? @$features[0]->custom_value : '' }}"
                                                                    placeholder="Enter Custom Value" />
                                                                    <small class="text-danger"></small>
                                                            </div>
                                                            <div class="form-group col-1 mt-4 d-flex align-items-end">
                                                                <a role="button" onclick="add_features_field()"
                                                                    class="btn bg-primary text-light"><i class="fas fa-plus"></i></a>
                                                            
                                                            </div>
                                                        
                                                        </div>  
                                                        {{-- @foreach ($features as $index => $feature)
                                                        @if($index != 0)
                                                            <div class="row ">
                                                                <div class="form-group col-5">
                                                                    <x-forms.label name="Features Name" :required="false" />
                                                                    <x-forms.input type="text" name="features[{{$index}}][key_name]" id="features[{{$index}}][key_name]"
                                                                    value="{{$feature->key_name}}"
                                                                        placeholder="Enter Features Name" />
                                                                        <small class="text-danger"></small>
                                                                </div>
                                                                <div class="form-group col-5">
                                                                    <x-forms.label name="Features Value" :required="false" />
                                                                    <x-forms.input type="text" name="features[{{$index}}][value]" id="features[{{$index}}][value]"
                                        
                                                                        value="{{$feature->value}}"
                                                                        placeholder="Enter Features Value" />
                                                                        <small class="text-danger"></small>
                                                                </div>
                                                                <div class="form-group col-1 mt-4 d-flex align-items-end">
                                                                    <a role="button" id="remove_item" class="btn bg-danger text-light" >
                                                                        <i class="fas fa-times"></i>
                                                                    </a>
                                                                </div>
                                                            
                                                            </div>
                                                        @endif
                                                        @endforeach --}}

                                                    
                                                    @php
                                                        $count = 1;
                                                    @endphp

                                                    @if(old('features', []) == null)
                                                        <!-- Assuming this is a Blade template file -->
                                                        @foreach ($features as $index => $feature)
                                                        @if($index != 0)
                                                       
                                                        <div class="row ">
                                                            <div class="form-group col-5">
                                                                <x-forms.label name="Features Name" :required="false" />
                                                                <x-forms.input type="text" name="features[{{$index}}][key_name]" id="features[{{$index}}][key_name]"
                                                                value="{{$feature->key_name}}"
                                                                    placeholder="Enter Features Name" />
                                                                    <small class="text-danger"></small>
                                                            </div>
                                                            {{-- <div class="form-group col-5">
                                                                <x-forms.label name="Features Value" :required="false" />
                                                                <x-forms.input type="text" name="features[{{$index}}][value]" id="features[{{$index}}][value]"
                                                        
                                                                    value="{{$feature->value}}"
                                                                    placeholder="Enter Features Value" />
                                                                    <small class="text-danger"></small>
                                                            </div> --}}
                                                            
                                                            <div class="form-group col-3">
                                                                <x-forms.label name="Features selected" :required="false" />
                                                                <select name="features[{{ $index }}][value]" id="features[{{ $index }}][value]"
                                                                    class="feature_selected form-control select2bs4 w-100-p @error('feature_selected') is-invalid @enderror"
                                                                    onchange="featureHideShow({{ $index }})">
                                                                    <option value="1" @if($feature->value == "1") selected @endif>YES</option>
                                                                    <option value="0" @if($feature->value == "0") selected @endif>NO</option>
                                                                    <option value="custom" @if($feature->value == "custom") selected @endif>Custom</option>
                                                                </select>
                                                            </div>
                                                            <div class="form-group col-3 featureHide" id="featureHide{{ $index }}" @if(@$feature->value  == "custom") style="display: inline;" @else style="display: none;" @endif >
                                                                <x-forms.label name="Custom Value" :required="false" />
                                                                <x-forms.input type="text" name="features[{{$index}}][custom_value]" id="features[{{ $index }}][custom_value]"
                                                                    value="{{@$feature->custom_value}}" placeholder="Enter Custom Value" />
                                                                <small class="text-danger"></small>
                                                            </div>
                                                        
                                                            <div class="form-group col-1 mt-4 d-flex align-items-end">
                                                                <a role="button" id="remove_item" class="btn bg-danger text-light" >
                                                                    <i class="fas fa-times"></i>
                                                                </a>
                                                            </div>
                                                        
                                                        
                                                        </div>
                                                            @php
                                                                $count++;
                                                            @endphp
                                                        @endif
                                                        @endforeach

                                                    @else

                                                    


                                                        @php
                                                            $count = 1;
                                                        @endphp
                                                          
                                                        @foreach (old('features', []) as $feature)
                                                            @if($flag == 1)
                                                                 
                                                            @else
                                                                <div class="row">
                                                                    <div class="form-group col-4">
                                                                        <x-forms.label name="Features Name" :required="false" />
                                                                        <x-forms.input type="text" name="features[{{ $count }}][key_name]" id="features_name_{{ $count }}"
                                                                            value="{{ $feature['key_name'] }}" placeholder="Enter Features Name" />
                                                                        <small class="text-danger"></small>
                                                                    </div>
                                                                    <div class="form-group col-3">
                                                                        <x-forms.label name="Features selected" :required="false" />
                                                                        <select name="features[{{ $count }}][value]" id="features[{{ $count }}][value]"
                                                                            class="feature_selected form-control select2bs4 w-100-p @error('feature_selected') is-invalid @enderror"
                                                                            onchange="featureHideShow({{ $count }})">
                                                                            <option value="1" @if($feature['value'] == "1") selected @endif>YES</option>
                                                                            <option value="0" @if($feature['value'] == "0") selected @endif>NO</option>
                                                                            <option value="custom" @if($feature['value'] == "custom") selected @endif>Custom</option>
                                                                        </select>
                                                                    </div>
                                                                    <div class="form-group col-3 featureHide" id="featureHide{{ $count }}" @if($feature['value'] == "custom") style="display: inline;" @else style="display: none;" @endif >
                                                                        <x-forms.label name="Custom Value" :required="false" />
                                                                        <x-forms.input type="text" name="features[{{ $count }}][custom_value]" id="features[{{ $count }}][custom_value]"
                                                                            value="{{ $feature['custom_value'] }}" placeholder="Enter Custom Value" />
                                                                        <small class="text-danger"></small>
                                                                    </div>
                                                                    <div class="form-group col-2 mt-4 d-flex align-items-end">
                                                                        <a role="button" class="btn bg-danger text-light remove_item"><i class="fas fa-times"></i></a>
                                                                    </div>
                                                                </div>
                                                                @php
                                                                    $count++;
                                                                @endphp
                                                            @endif
                                                        @endforeach
                                                    @endif
                                                        
    
                                                
                            
                                              

                                                </div>
                                            </div>
                                            </div>
                                            <div class="col-md-12 mt-2">
                                                <div class="form-group">
                                                    <label class="form-label" for="description">{{ __('description') }}
                                                       <small
                                                            class="text-danger">*</small></label>
                                                    {{-- <textarea name="description" placeholder="{{ __('enter') }} {{ __('description') }}"
                                                    class="form-control @error('description') is-invalid @enderror"
                                                    id="description" cols="1" rows="4"{{ old('description') }}>{{$plan->description}}</textarea> --}}
                                                    <textarea id="editor2" rows="10" cols="5" name="description" placeholder="{{ __('enter') }} {{ __('description') }}" value="{{ old('description') }}" class="form-control @error('description') is-invalid @enderror"> {{@$plan->description}}</textarea>
                                                    @error('description')
                                                        <span class="invalid-feedback" role="alert">{{ __(@$message) }}</span>
                                                    @enderror
                                                </div>
                                            </div>
                                        </div>
                                        <div class="row justify-content-center">
                                            <button class="btn btn-success" type="submit">
                                                <i class="fas fa-sync"></i>&nbsp; {{ __('update') }}
                                            </button>
                                        </div>
                                    </form>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endif
       
@endsection


@section('script')
<script src="{{ asset('backend') }}/plugins/select2/js/select2.full.min.js"></script>
<script src="{{ asset('tinymce/tinymce.min.js') }}" referrerpolicy="origin"></script>

    <script>
        // $(document).ready(function() {
        //     function featureHideShow(index) {
        //         // Get the selected value from the dropdown
        //         // var selectedValue = document.getElementById("features[" + index + "][value]").value;

        //         var selectedValue =  $('#features_'+index+'_value').val();
        //         // Use jQuery to set the value of the input field to an empty string
        //         $('#features\\[' + index + '\\]\\[custom_value\\]').val("");

        //         // Get the Custom Value field container
        //         var featureValueContainer = document.getElementById("featureHide" + index);
                
        //         // Check the selected value and show/hide the Custom Value field accordingly
        //         if (selectedValue == "custom") {
        //             featureValueContainer.style.display = "block";
        //         } else {
        //             featureValueContainer.style.display = "none";
        //         }
        //     }
        // });

        function featureHideShow(index) {
            
                // Get the selected value from the dropdown
                // var selectedValue = document.getElementById("features[" + index + "][value]").value;

                var selectedValue =  $('#features\\[' + index + '\\]\\[value\\]').val();
                // Use jQuery to set the value of the input field to an empty string
                $('#features\\[' + index + '\\]\\[custom_value\\]').val("");
               
                // Get the Custom Value field container
                var featureValueContainer = document.getElementById("featureHide" + index);
                
                // Check the selected value and show/hide the Custom Value field accordingly
                if (selectedValue == "custom") {
                    featureValueContainer.style.display = "block";
                } else {
                    featureValueContainer.style.display = "none";
                }
            }
    </script>
    <script>
        $('#filterForm').on('change', function() {
            $(this).submit();
        })

        $('.select2bs4').select2({
            theme: 'bootstrap4',
        });
    </script>
    <script>
        checkSubscriptionType('{{ old("subscription_type", $plan->subscription_type) }}');

        $('.plan_type_selection').on('click', function(value){
            var value = $("[name='subscription_type']:checked").val();
            checkSubscriptionType(this.value);
        });

        function checkSubscriptionType(type){
            if (type == 'recurring') {
                $('#plan_interval').removeClass('d-none');
            }else{
                $('#plan_interval').addClass('d-none');
            }
        }

        profileViewLimitation('{{ old("candidate_cv_view_limitation", $plan->candidate_cv_view_limitation) }}');

        function profileViewLimitation(status){
            if (status == 'unlimited') {
                $('#candidate_profile_view_count_field').addClass('d-none');
            }else{
                $('#candidate_profile_view_count_field').removeClass('d-none');
            }
        }

        $('.candidate_profile_view').on('click', function(value){
            var value = $("[name='candidate_cv_view_limitation']:checked").val();
            profileViewLimitation(this.value);
        });

        $('#plan_category').on('change', function() {
            var plan_category_id = '{{@$pna->plan_category_id}}';
            console.log(plan_category_id);
            $.ajax({
                url: "{{ route('module.plan.category',['plan_category_id' => ':plan_category_id']) }}".replace(':plan_category_id', plan_category_id),
                type: 'GET',
                data: {
                    plan_category_id: plan_category_id
                },
                success: function(response) {
                    var planSubCategory = response.plan_sub_category;
                    $('#plan_sub_category').empty();
                    $('#plan_sub_category').append(`<option value="">Select Sub Category</option>`);
                    for (var i = 0; i < planSubCategory.length; i++) {
                    $('#plan_sub_category').append('<option value="' + planSubCategory[i].id + '">' + planSubCategory[i].name + '</option>');    
                    }
                }
            });   
        });

    </script>
       <script>
      
        tinymce.init({
            selector: `#editor2`,
            plugins: 'anchor autolink charmap codesample emoticons image link lists media searchreplace table visualblocks wordcount code imagetools fontawesome',
            toolbar: 'fontawesome | searchreplace | code |undo redo | blocks |bold italic underline strikethrough | align | link image media table | numlist bullist indent outdent',
            // toolbar: 'undo redo | blocks fontsize | bold italic underline strikethrough | link image media table | align lineheight | numlist bullist indent outdent | emoticons charmap | removeformat code | fontawesome | searchreplace',
            image_advtab: true,
            // extended_valid_elements: 'svg[*],path[*],use[*]',
            valid_elements: '*[*]',
            valid_children: '*[*]',
            extended_valid_elements: '*[*]',
            file_picker_types: 'image',
            file_picker_callback: function(callback, value, meta) {
            if (meta.filetype === 'image') {
                // Implement your custom file picker logic here
                // For example, you can use an input type=file or open a file picker dialog
                // Once the user selects an image, pass the selected file to the callback
                // using the callback function provided by TinyMCE
            }
            }
        });
    
    </script>
    <script>
        
           $(document).on("click", "#remove_item", function() {
            // var confirmed = confirm('Are you sure you want to delete this item?');
            // if(confirmed){
            $(this).parent().parent('div').remove();
            // }
           });
           var count = "{{@$count}}";

           if(count <= 0){
                count = 1;
           }
           
           function add_features_field() {
            var index = 0;
            var name = $('#features\\[' + index + '\\]\\[key_name\\]').val();
            var type = $('#features\\[' + index + '\\]\\[value\\]').val();
            var custom_value = $('#features\\[' + index + '\\]\\[custom_value\\]').val();

            console.log(name);
        $('#links').append(
        '<div class="row">' +
            '<div class="form-group col-4">' +
                '<label for="features_name_' + count + '">Features Name</label>' +
                '<input type="text" class="feature_selected form-control select2bs4 w-100-p" name="features[' + count + '][key_name]" id="features_name_' + count +
                    '" value="' + name + '" placeholder="Enter Features Name" />' +
                '<small class="text-danger"></small>' +
            '</div>' +
            '<div class="form-group col-3">' +
                '<label for="features_' + count + '_value">Features selected</label>' +
                '<select name="features[' + count + '][value]" id="features[' + count + '][value]" ' +
                    'class="feature_selected form-control select2bs4 w-100-p" ' +
                    'onchange="featureHideShow(' + count + ')">' +
                    '<option value="1" ' + (type === "1" ? 'selected' : '') + '>YES</option>' +
                    '<option value="0" ' + (type === "0" ? 'selected' : '') + '>NO</option>' +
                    '<option value="custom" ' + (type === "custom" ? 'selected' : '') + '>Custom</option>' +
                '</select>' +
            '</div>' +
            '<div class="form-group col-3 featureHide" id="featureHide' + count + '" ' +
                (type === "custom" ? 'style="display: inline;"' : 'style="display: none;"') + '>' +
                '<label for="features_' + count + '_custom_value">Custom Value</label>' +
                '<input type="text" name="features[' + count + '][custom_value]" ' +
                    'id="features_' + count + '_custom_value" class="feature_selected form-control select2bs4 w-100-p" value="' + custom_value +
                    '" placeholder="Enter Custom Value" />' +
                '<small class="text-danger"></small>' +
            '</div>' +
            '<div class="form-group col-2 mt-4 d-flex align-items-end">' +
                '<a role="button" class="btn bg-danger text-light remove_item"><i class="fas fa-times"></i></a>' +
            '</div>' +
        '</div>'
    );
            count++;
        }
    
        </script>
@endsection

@section('style')
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2/css/select2.min.css">
    <link rel="stylesheet" href="{{ asset('backend') }}/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css">
    <style>
        .select2-results__option[aria-selected=true] {
            display: none;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice {
            color: #fff;
            border: 1px solid #fff;
            background: #007bff;
            border-radius: 30px;
        }

        .select2-container--bootstrap4 .select2-selection--multiple .select2-selection__choice__remove {
            color: #fff;
        }
        .borderHeight{
            height: 106px;
            padding: 10px 10px;
        }
    </style>

@endsection