@php($is_label = in_array($item->type, ["heading", "text_field", "ending_text"]) ? true : false)
@php($color = $is_label ? 'info' : 'success')
@php($editing = !$is_label && $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])
  <div class="row">
      <div class="col-11">
        {{-- 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="mx-1 me-3 question-number">{{ $item->getQuestionLabel() }}</span>
            @else
              <span class="mx-1 me-3 question-title">{{ $item->title }}</span>
            @endif

            @if(!$is_label)
              @if($item->is_required)
                <span class="badge ms-2 rounded-pill text-bg-danger p-1 text-light">{{ __('bdd.questions.is_required.s') }}</span>
              @else
                <span class="badge ms-2 rounded-pill text-bg-light p-1">{{ __('bdd.questions.is_required.n') }}</span>
              @endif

              @if($item->hasCondition())
                <span class="badge ms-2 rounded-pill text-bg-danger p-1 text-light">{{ __('bdd.questions.is_condition.s') }}</span>
              @else
                <span class="badge ms-2 rounded-pill text-bg-light p-1">{{ __('bdd.questions.is_condition.n') }}</span>
              @endif

              @if($item->isRandom())
                <span class="badge ms-2 rounded-pill text-bg-danger p-1 text-light">{{ __('bdd.questions.is_random.s') }}</span>
              @endif
            @endif
          </div>
          @if($editing)
              <span class="in-progress-label text-danger float-right fw-bold">{{ __('labels.in_progress') }}</span>
          @endif
        </div>

        {{-- answers --}}
        @include('forms.quizs.answers', ['item' => $item, 'is_label' => $is_label])
      </div>

      {{-- params --}}
      <div class="col-1">
        <div class="d-flex flex-column align-items-center quiz-actions">
        <span class="icon text-{{$color}}" onclick="window.location.href = '{{ $item->type == 'unique_choice' ? route('quizs_edit_questions', ['id' => $quiz_id, 'question_id' => $item->id]) : route('quizs_todo') }}';">
            {!! config('dgc-icons.gear') !!}
        </span>
        @if (!$is_label)
          @if($questions_count > 1)
            <span class="icon text-{{$color}}" onclick="window.location.href = '{{ route('quizs_todo') }}';">{!! config('dgc-icons.shuffle') !!}</span>
          @endif
          <span class="icon text-{{$color}}" onclick="window.location.href = '{{ route('quizs_todo') }}';">{!! config('dgc-icons.prescription') !!}</span>
          @if($questions_count > 1)
            <span class="icon text-{{$color}} change-element-position" onclick="//window.location.href = '{{ route('quizs_todo') }}';">{!! config('dgc-icons.arrow-down') !!}</span>
          @endif
        @endif
        </div>
      </div>
    </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}}">
    <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>
                        <span class="in-progress-label text-danger float-right fw-bold">{{ __('labels.in_progress') }}</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
  </div>
@endif