@php($is_label = $item->isLabel())
@php($color = $is_label ? 'info' : 'success')
@php($editing = $item->id == request('question_id'))


@if (!$editing)
    @component('components.cards.status', [
        'color' => $color,
        'class' => 'mb-4 quiz-element ' . ($editing ? 'in_progress_question' : ''),
        'attributes' => 'data-type=' . $item->type . ' data-id=' . $item->id . ' data-ischoice=' . (int) $item->isChoice(),
    ])
        <div class="d-flex" id="{{ '#q' . $item->id }}">
            <div class="flex-grow-1 pe-2">
                {{-- content --}}
                <div class="d-flex align-items-center mb-2">
                    <div class="question-header">
                        <span class="icon text-{{ $color }} me-2">{!! config('dgc-icons.' . $item->type) !!}</span>
                        @if (!$is_label)
                            <span
                                class="fw-bold mx-1 me-3 question-number text-{{ $color }}">{{ $item->getQuestionLabel() }}</span>
                        @else
                            {{-- <span
                                class="fw-bold mx-1 me-3 question-title text-{{ $color }}">{{ $item->title ?? trans('labels.' . $item->type . '') }}</span> --}}
                            <span
                                class="fw-bold mx-1 me-3 question-title text-{{ $color }}">{{ trans('labels.' . $item->type . '') }}</span>
                        @endif

                        @include('quiz.question-tags', ['item' => $item])
                    </div>
                    @if ($editing)
                        <span class="in-progress-label text-danger float-right fw-bold">{{ __('labels.in_progress') }}</span>
                    @endif
                </div>

                {{-- titre du question --}}
                @if (!$is_label)
                    <h2 class="question-title @if($item->is_required) required @endif">{!! $item->title_with_trigger !!}</h2>
                @endif

                {{-- answers --}}
                @php($has_table_questions = $item?->option('table_questions'))
                @php($table_questions_items = $item?->option('table_questions_items'))

                @if (isset($has_table_questions) && $has_table_questions == 1 && !empty($table_questions_items))
                    {{-- get the parent child questions collection --}}
                    @php($child_questions = $item->childQuestions()->get())

                    <div class="dgc-table-question">
                        @foreach ($table_questions_items as $id_child => $tb_val)
                        <div class="dgc-table-question-item
                            @if(in_array($item->type,['yes_no','unique_choice','multiple_choice']))
                                dgc-table-question-radiocheck-columns
                            @elseif($item->type == "scale")
                                dgc-table-question-scale-columns
                            @else
                                dgc-table-question-item-columns
                            @endif
                        ">
                        {{-- get a single child question from the collection --}}
                        @php($child_question = $child_questions->where('id', (int) $id_child)->first())

                            <p class="dgc-front-question me-auto">
                                {{ __('labels.LbQuestionTableItems', ['item' => $tb_val]) }}
                            </p>
                            @include('quiz.answers.answers', [
                                'child_question' => $child_question,
                                'item' => $item,
                                'is_label' => $is_label,
                                'id_child' => $id_child,
                                'class' => 'dgc-form-input',
                            ])
                        </div>
                        @endforeach
                    </div>
                @else
                    @include('quiz.answers.answers', [
                        'item' => $item,
                        'is_label' => $is_label,
                        'id_child' => null,
                    ])
                @endif
            </div>

            {{-- params --}}
            @if (!in_array($quiz_status, config('constants.quizs_not_editable')))
                <div class="ps-2 pe-2">
                    <div class="d-flex flex-column align-items-center quiz-actions">
                        <span class="icon text-{{ $color }} my-1"
                            onclick="window.location.href = '{{ route('quizs_edit_questions', ['id' => $quiz_id, 'question_id' => $item->id, 'step' => 'params']) . '#q' . $item->id }}';"
                            data-bs-toggle="tooltip" data-bs-placement="right"
                            data-bs-title="{{ trans('labels.LbQuestionParams') }}">
                            {!! config('dgc-icons.gear') !!}
                        </span>
                        {{-- pour l'element titre --}}
                        @if ($is_label && $question_elements_count && $item?->option('display_in_question_screen') === '0')
                            <span class="icon text-{{ $color }} change-element-position my-1"
                                data-bs-toggle="tooltip" data-bs-placement="right"
                                data-bs-title="{{ trans('labels.LbQuestionPosition') }}">{!! config('dgc-icons.sort-numeric') !!}</span>
                        @endif
                        @if (!$is_label)
                            @if ($questions_count > 1 && !in_array($item->type, $item::$question_without_conditions))
                                <span class="icon text-{{ $color }} my-1"
                                    onclick="window.location.href = '{{ route('quizs_edit_questions', ['id' => $quiz_id, 'question_id' => $item->id, 'step' => 'condition']) . '#q' . $item->id }}';"
                                    data-bs-toggle="tooltip" data-bs-placement="right"
                                    data-bs-title="{{ trans('labels.LbQuestionConditions') }}">{!! config('dgc-icons.diagram') !!}</span>
                            @endif
                            <span class="icon text-{{ $color }} duplicate-element my-1"
                                data-href="{{ route('quizs_duplicate_question', ['id' => $quiz_id, 'question_id' => $item->id]) }}"
                                data-bs-toggle="tooltip" data-bs-placement="right"
                                data-bs-title="{{ trans('labels.LbQuestionDuplicate') }}">{!! config('dgc-icons.duplicate') !!}</span>
                            @if ($questions_count > 1)
                                <span class="icon text-{{ $color }} change-element-position my-1"
                                    data-bs-toggle="tooltip" data-bs-placement="right"
                                    data-bs-title="{{ trans('labels.LbQuestionPosition') }}">{!! config('dgc-icons.sort-numeric') !!}</span>
                            @endif

                            @if (in_array($item->type, $item::$mutable_elements) && $item->option('scale_type') != 'numeric_with_steps')
                                <span class="icon text-{{ $color }} change-element-type my-1"
                                    data-bs-toggle="tooltip" data-bs-placement="right"
                                    data-bs-title="{{ trans('labels.LbQuestionChangeType') }}">{!! config('dgc-icons.substitute') !!}</span>
                            @endif
                        @endif
                    </div>
                </div>
            @endif
        </div>
    @endcomponent
@else
    {{-- ENCOURS D'EDITION  --}}
    <div class="card mb-4 dgc-card-status dgc-card-status-danger quiz-element in_progress_question"
        data-type="{{ $item->type }}" data-id="{{ $item->id }}" id="{{ 'q' . $item->id }}">
        <div class="card-body">
            <div class="row">
                <div class="col-11">
                    <div class="d-flex align-items-center mb-2">
                        <div class="question-header">
                            <span class="icon text-success me-2">{!! config('dgc-icons.' . $item->type) !!}</span>
                            <span class="fw-bold mx-1 me-3 question-number">{{ $item->getQuestionLabel() }}</span>
                            @if(isset($item->title) && !empty($item->title) && $item->getQuestionLabel() != $item->title)
                            <span class="in-progress-label text-danger float-right fw-bold">
                                {!! strip_tags($item->title) !!}
                            </span>
                            @endif
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endif