{{-- 
    @php
    $currentIndex++;
    $autoMargin += 40;
    @endphp
    <div class="polling-question-area childquestion" style="margin-left: {{$autoMargin}}px">
    <div class="card shadow-none" id="ParentQuestion0">
        <div class="card-header border border-height border-dark" style="background-color:#f7f7f7;">
            <div class="row">
                <div class="col-lg-8  border-dark border-end">
                    <label class="font-weight-bold">Question</label>
                    <a id="Delete_Question0" style="float: right; font-size: 19px;" href="javascript:;" class="text-danger btnDelete" title="Delete Question">  <i class="fas fa-trash p-1"></i></a>

                </div>
                <div class="col-lg-4">
                    <label class="font-weight-bold">Type of response</label>
                </div>
            </div>
        </div>
        <div class="card-body question-section">
            <div class="row ">
                <div class="col-lg-8">
                    <input type="text" class="form-control" name="question[]" placeholder="Enter question" required="" value="{{$childQuestion->question}}">
                    <input type="hidden" class="form-control" name="response_id[]" id="question_responses0" value="{{$childQuestion->response_id}}">
                    <input type="hidden" class="form-control" name="input[]" value="{{$childQuestion->input}}">
                    <input type="hidden" name="parent_question" class="parent_question" value="{{$currentIndex-1}}">
                    <input type="hidden" name="logic_trigger" class="loggic_trigger" value="{{!$childQuestion->children->isEmpty() ? 1 : 0}}">

                    <div class="row border-bottom p-2 response-area">
                        @if($question->input != 'ranking')
                        <div class="col-sm-12 question_response_option">
                           @if($childQuestion->questionResponse)

                           @php
                               $responses = json_decode($childQuestion->questionResponse->response);
                           @endphp
                                @foreach($responses as $response)
                                    <span class="badge rounded-pill bg-success">{{$response}}</span>&nbsp;&nbsp;
                                @endforeach
                           @else
                                @if($childQuestion->input == 'text')
                                    <span class="badge rounded-pill bg-success">Input</span>&nbsp;&nbsp;
                                @elseif($childQuestion->input == 'rating')
                                    <span class="badge rounded-pill bg-success">Poor</span>&nbsp;&nbsp;
                                    <span class="badge rounded-pill bg-success">Satisfactory</span>&nbsp;&nbsp;
                                    <span class="badge rounded-pill bg-success">Good</span>&nbsp;&nbsp;
                                    <span class="badge rounded-pill bg-success">Above Average</span>&nbsp;&nbsp;
                                    <span class="badge rounded-pill bg-success">Excellent</span>&nbsp;&nbsp;
                                @else
                                    <span class="badge rounded-pill bg-success">True</span>&nbsp;&nbsp;
                                    <span class="badge rounded-pill bg-success">False</span>&nbsp;&nbsp;
                                @endif
                           @endif
                        </div>
                        @endif
                    </div>

                     <!-- ranking code starts here -->
                     <div class="response-section row">
                        <div class="response-holder col-lg-8">
                            @if($childQuestion->input == 'ranking')
                                @if($childQuestion->questionResponse)

                                    @php
                                        $responses = json_decode($childQuestion->questionResponse->response);
                                    @endphp

                                @endif

                                @foreach($responses as $responseIndex => $response)

                                <div class="response-list-item my-1 d-flex justify-content-between draggable-item" draggable="true">
                                        <span class="serial-no py-3" style="padding-left: 30px;">{{$responseIndex + 1}}</span>
                                        <input type="text" name="createdResponse[0][]" placeholder="Please Write Response" class="created-response px-2" value='{{$response}}' style="width: 80%; height:45px">
                                        <button type="button" class="btn bg-danger text-white deleteResponse"><i class="fa fa-minus" aria-hidden="true"></i></button>
                                </div>

                                @endforeach

                            @endif
                        </div>
                        <div class="response-btn-section col-lg-4 my-1 @if($childQuestion->input != 'ranking') d-none @endif">
                            <button type="button" class="btn bg-theme-color text-white px-3 addResponseBtn" style="font-size: 1.6rem; padding: 5px;">+</button>
                        </div>
                    </div>

                    <!-- ranking code ends here -->
                </div>
                <div class="col-lg-2 ">

                    <div class="form-group mb-0 justify-content-end pt-1">
                    <!-- <input type="checkbox" id="0" class=" btn-choose-input"    data-checkboxes="mygroup">
                    <label for="checkbox-2"  class="font-weight-bold " style="font-size:18px">input text field</label> -->
                        <div class="form-group">
                            <strong><label>Question Type</label></strong>
                            <select name="questionType[]" class="form-control question-type" require="">
                                <option value="" selected="" disabled="">Select Question Type</option>
                                @foreach($questionTypes as $type)
                                    <!-- <option value="{{$type->id}}">{{$type->title == 'radio' ? 'Multiple Choice' : ucwords($type->title)}}</option> -->
                                    <option @if($childQuestion->input == trim($type->title)) selected @endif value="{{$type->id}}">{{$type->title}}</option>
                                @endforeach
                            </select>
                        </div>
                    </div>
                </div>
                <div class="col-lg-2 ">

                <button id="choose0" attr-id="btn-choose" choose-id="0" class="btn btn-primary btn-block text-white btn-choose-response" @if($childQuestion->input != 'radio') disabled  @endif data-bs-toggle="modal" data-bs-target="#myModal2" role="button">Choose response</button>

                </div>
            </div>
        </div>
        <div class="response-section row">
            <div class="response-holder col-lg-8">
            </div>
            <div class="response-btn-section col-lg-4 my-1 d-none">
                <button type="button" class="btn bg-theme-color text-white px-3 addResponseBtn" style="font-size: 1.6rem; padding: 5px;">+</button>
            </div>
        </div>
        <div class="card-footer tx-medium border border-dark" style="background-color:#f7f7f7;">
            <input type="hidden" name="counter[]" value="0">
            <div class="row add-logic-section @if(in_array($childQuestion->input , $invalidLogic)) d-none @endif" style="margin-top: -12px;">
                <div class="col-lg-2 border-dark border-end pt-1 font-weight-bold">
                    <label for="" class="checkbox-span text-danger add-logic" id="add-logic0"> <i class="typcn typcn-flow-children pr-2 "></i>
                        Add logic</label>
                </div>

            </div>

            <br>
        </div>
        <div class=" card-body tx-medium add-logic-card" id="div-add-logic0" style="background-color:#f7f7f7; @if($childQuestion->input == 'text' || $childQuestion->children->isEmpty()) display:none; @endif">
            <span class="text-muted">if answer </span>
            <span class="text-primary"> is </span>
            <select class="dropdown question_response_html" name="response{{$childIndex}}">
            @if($childQuestion->questionResponse)

                @php
                    $responses = json_decode($childQuestion->questionResponse->response);
                    $inputType = ['text' , 'true / false'];
                @endphp
                @if(!in_array($childQuestion->input , $inputType))
                    @foreach($responses as $response)
                    <option  @if($childQuestion->logic_trigger == 1 && $childQuestion->response == $response) selected @endif  value="{{$response}}">{{$response}}</option>
                    @endforeach
                @endif
            @elseif($childQuestion->input == 'true / false')
                <option @if($childQuestion->logic_trigger == 1 && $question->response == 'true') selected @endif  value="true">true</option>
                <option @if($childQuestion->logic_trigger == 1 && $question->response == 'false') selected @endif  value="false">false</option>
            @endif
            </select>
            <span class="text-muted">then</span>
            <select class="dropdown1 trigger" id="trigger0" name="trigger0">
                <option value="" selected="" disabled="">+ triger</option>
                <option value="required_action"> Required action</option>
                <option value="ask_question">Ask a questions</option>
            </select>
        </div>

    </div>
</div>
    @foreach($childQuestion->children as $childQuestion)
        @include('poll.components.polling-child-question', ['parendIndex' => $childIndex])
    @endforeach --}}