@extends('admin.layout.app')

@section('body')
<div class="card shadow-sm">
    <div class="card-body">
        <div class="d-flex justify-content-between align-items-start flex-wrap gap-2 mb-3">
            <div>
                <h4 class="mb-1">{{ __('admin.questions_builder') }}</h4>
                <div class="text-muted small">
                    {{ __('admin.quiz_2') }} <b>{{ $quiz->title }}</b>
                    <span class="mx-2">•</span>
                    {{ __('admin.total_2') }} <b>{{ $questions->count() }}</b>
                </div>
            </div>

            <div class="d-flex gap-2 flex-wrap">
                <a href="{{ route('quizzes.index') }}" class="btn btn-outline-secondary btn-sm">
                    <i class="fas fa-arrow-left me-1"></i> {{ __('admin.back_to_quizzes') }}
                </a>

                <a href="{{ route('quizzes.questions.create', $quiz->id) }}" class="btn btn-primary btn-sm">
                    <i class="fas fa-plus me-1"></i> {{ __('admin.add_question') }}
                </a>
            </div>
        </div>

        @if(session('msg'))
            <div class="alert alert-info mb-3">{{ session('msg') }}</div>
        @endif

        {{-- Publish hint --}}
        <div class="alert alert-light border mb-3">
            <div class="d-flex align-items-start gap-2">
                <i class="fas fa-circle-info mt-1 text-primary"></i>
                <div class="small">
                    {{ __('admin.for_mcq_add_options_and_mark') }} <b>{{ __('admin.one') }}</b> {{ __('admin.as_correct_then_publish_the_quiz') }}
                </div>
            </div>
        </div>

        <div class="table-responsive">
            <table class="table table-hover align-middle mb-0">
                <thead class="table-light">
                    <tr>
                        <th style="width:90px;">#</th>
                        <th>{{ __('admin.question') }}</th>
                        <th style="width:130px;">{{ __('admin.type_2') }}</th>
                        <th style="width:120px;">{{ __('admin.points_2') }}</th>
                        <th style="width:180px;">{{ __('admin.correct_2') }}</th>
                        <th style="width:170px;">{{ __('admin.actions') }}</th>
                    </tr>
                </thead>
                <tbody>
                    @forelse($questions as $q)
                        @php
                            $correctMcq = $q->type === 'mcq' ? $q->options->firstWhere('is_correct', true) : null;
                            $correctTF  = $q->type === 'true_false' ? (is_null($q->correct_true_false) ? null : ($q->correct_true_false ? 'True' : 'False')) : null;
                        @endphp
                        <tr>
                            <td>
                                <div class="fw-semibold">#{{ $q->id }}</div>
                                <div class="text-muted small">{{ __('admin.order_2') }}: {{ $q->sort_order }}</div>
                            </td>

                            <td>
                                <div class="fw-semibold text-truncate" style="max-width: 620px;">
                                    {{ \Illuminate\Support\Str::limit($q->question_text, 140) }}
                                </div>
                                @if($q->explanation)
                                    <div class="text-muted small text-truncate" style="max-width: 620px;">
                                        <i class="fas fa-lightbulb me-1"></i>{{ \Illuminate\Support\Str::limit($q->explanation, 90) }}
                                    </div>
                                @endif
                            </td>

                            <td>
                                <span class="badge {{ $q->type === 'mcq' ? 'bg-primary' : 'bg-warning text-dark' }}">
                                    {{ strtoupper($q->type) }}
                                </span>
                            </td>

                            <td>
                                <span class="badge bg-light text-dark border">{{ $q->points }} pt</span>
                            </td>

                            <td>
                                @if($q->type === 'mcq')
                                    @if($correctMcq)
                                        <span class="badge bg-success">{{ __('admin.correct_set') }}</span>
                                        <div class="text-muted small text-truncate" style="max-width: 260px;">
                                            {{ $correctMcq->option_text }}
                                        </div>
                                    @else
                                        <span class="badge bg-danger">{{ __('admin.no_correct') }}</span>
                                        <div class="text-muted small">{{ __('admin.options') }}: {{ $q->options->count() }}</div>
                                    @endif
                                @else
                                    @if($correctTF === null)
                                        <span class="badge bg-danger">{{ __('admin.no_correct') }}</span>
                                    @else
                                        <span class="badge bg-success">✓ {{ $correctTF }}</span>
                                    @endif
                                @endif
                            </td>

                            <td class="d-flex gap-2">
                                <a href="{{ route('quizzes.questions.show', [$quiz->id, $q->id]) }}"
                                   class="btn btn-outline-info btn-sm" title="{{ __('admin.view') }}">
                                    <i class="far fa-eye"></i>
                                </a>

                                <a href="{{ route('quizzes.questions.edit', [$quiz->id, $q->id]) }}"
                                   class="btn btn-outline-primary btn-sm" title="{{ __('admin.edit') }}">
                                    <i class="far fa-edit"></i>
                                </a>

                                <form method="POST" action="{{ route('quizzes.questions.destroy', [$quiz->id, $q->id]) }}"
                                      onsubmit="return confirm('{{ __('admin.delete_this_question') }}');">
                                    @csrf
                                    @method('DELETE')
                                    <button class="btn btn-outline-danger btn-sm" title="{{ __('admin.delete') }}">
                                        <i class="far fa-trash-alt"></i>
                                    </button>
                                </form>
                            </td>
                        </tr>
                    @empty
                        <tr>
                            <td colspan="6" class="text-center p-4 text-muted">{{ __('admin.no_questions_yet') }}</td>
                        </tr>
                    @endforelse
                </tbody>
            </table>
        </div>

    </div>
</div>
@endsection