{{-- Shared question editor fields. Vars: $q (ExamQuestion|null), $domains (collection) --}}
@php
  $letters = range('A', 'H');
  $qType = old('type', $q?->type ?? 'single');
  if (is_array(old('options'))) {
      $picked = (array) old('correct', []);
      $rows = collect(old('options'))->values()->map(fn ($t, $i) => ['text' => $t, 'correct' => in_array($letters[$i] ?? '', $picked, true)])->all();
  } elseif ($q?->exists) {
      $rows = collect($q->options)->map(fn ($o) => ['text' => $o['text'], 'correct' => in_array($o['key'], (array) $q->correct, true)])->all();
  } else {
      $rows = array_fill(0, 4, ['text' => '', 'correct' => false]);
  }
  while (count($rows) < 2) { $rows[] = ['text' => '', 'correct' => false]; }
  $rows = array_slice($rows, 0, 8);
@endphp
<div class="form-grid">
  <x-field name="question" label="Question" type="textarea" :rows="4" :value="$q?->question" required full help="Plain text. Use `backticks` for commands or code — they render as monospace for learners."/>
  <x-field name="type" label="Question type" type="select" :options="['single' => 'Single answer (radio)', 'multiple' => 'Multiple answers (checkboxes)', 'truefalse' => 'True / False']" :value="$qType" required/>
  <x-field name="difficulty" label="Difficulty" type="select" :options="['easy' => 'Easy', 'medium' => 'Medium', 'hard' => 'Hard']" :value="$q?->difficulty ?? 'medium'"/>
  <div class="field">
    <label class="label" for="f-domain">Domain / topic</label>
    <input class="input @error('domain') is-invalid @enderror" id="f-domain" name="domain" type="text" list="q-domains" value="{{ old('domain', $q?->domain) }}" maxlength="120" placeholder="e.g. Networking fundamentals">
    <datalist id="q-domains">@foreach($domains as $d)<option value="{{ $d }}">@endforeach</datalist>
    <div class="help">Domain scores are reported to the learner after the exam.</div>
    @error('domain')<div class="field-error">{{ $message }}</div>@enderror
  </div>
  <x-field name="marks" label="Marks" type="number" :value="$q?->marks ?? 1" :min="0.25" :max="20" step="0.25"/>
</div>

<fieldset class="ab-fieldset" data-option-builder data-max="8" data-min="2">
  <legend class="label">Answer options</legend>
  <p class="help" style="margin-top:0" data-option-help>Fill at least two options and tick the correct answer. Empty options are ignored.</p>
  <div data-option-list>
    @foreach($rows as $i => $r)
      <div class="ab-option" data-option>
        <span class="ab-opt-key" data-key aria-hidden="true">{{ $letters[$i] }}</span>
        <input class="input" type="text" name="options[{{ $i }}]" value="{{ $r['text'] }}" maxlength="800" placeholder="Answer option {{ $letters[$i] }}" aria-label="Option {{ $letters[$i] }} text" data-text>
        <label class="ab-correct"><input type="{{ $qType === 'multiple' ? 'checkbox' : 'radio' }}" name="correct[]" value="{{ $letters[$i] }}" data-correct @checked($r['correct'])> <span>Correct</span></label>
        <button class="icon-btn" type="button" data-remove-option aria-label="Remove option {{ $letters[$i] }}"><x-icon name="x" :size="16"/></button>
      </div>
    @endforeach
  </div>
  <template data-option-template>
    <div class="ab-option" data-option>
      <span class="ab-opt-key" data-key aria-hidden="true">__L__</span>
      <input class="input" type="text" name="options[__i__]" value="" maxlength="800" placeholder="Answer option __L__" aria-label="Option __L__ text" data-text>
      <label class="ab-correct"><input type="radio" name="correct[]" value="__L__" data-correct> <span>Correct</span></label>
      <button class="icon-btn" type="button" data-remove-option aria-label="Remove option __L__"><x-icon name="x" :size="16"/></button>
    </div>
  </template>
  <button class="btn btn-secondary btn-sm" type="button" data-add-option><x-icon name="plus" :size="15"/> Add option</button>
  @error('options')<div class="field-error">{{ $message }}</div>@enderror
  @error('correct')<div class="field-error">{{ $message }}</div>@enderror
</fieldset>

<div class="form-grid">
  <x-field name="explanation" label="Explanation (shown in the answer review)" type="textarea" :rows="3" :value="$q?->explanation" full help="Explain why the correct answer is right. Learners see it when review is enabled."/>
  <x-field name="active" type="checkbox" label="Active — eligible to be drawn into exams" :value="$q?->active ?? true"/>
</div>