@extends('layouts.admin')

@section('content')
<div class="p-6 max-w-3xl mx-auto">
    <div class="flex items-center justify-between mb-6">
        <h1 class="text-2xl font-bold font-display text-ink-900">Edit Question</h1>
        <a href="{{ route('admin.question-papers.show', $question->questionPaper) }}" class="text-graphite-400 hover:text-ink-600">&larr; Back to Paper</a>
    </div>

    <form action="{{ route('admin.questions.update', $question) }}" method="POST" class="bg-white border border-graphite-400/30 rounded p-6 space-y-6">
        @csrf
        @method('PUT')

        <div>
            <label for="question_paper_id" class="block text-sm font-medium text-ink-600 mb-1">Question Paper *</label>
            <select name="question_paper_id" id="question_paper_id" required class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">
                <option value="">Select Question Paper</option>
                @foreach($questionPapers as $paper)
                    <option value="{{ $paper->id }}" {{ old('question_paper_id', $question->question_paper_id) == $paper->id ? 'selected' : '' }}>
                        {{ $paper->subject->name ?? '-' }} - {{ $paper->version_label }}
                    </option>
                @endforeach
            </select>
            @error('question_paper_id') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
        </div>

        <div class="grid grid-cols-2 gap-4">
            <div>
                <label for="question_number" class="block text-sm font-medium text-ink-600 mb-1">Question Number *</label>
                <input type="number" name="question_number" id="question_number" value="{{ old('question_number', $question->question_number) }}" required min="1"
                    class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">
                @error('question_number') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
            </div>
            <div>
                <label for="question_type" class="block text-sm font-medium text-ink-600 mb-1">Question Type *</label>
                <select name="question_type" id="question_type" required class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">
                    <option value="long" {{ old('question_type', $question->question_type) == 'long' ? 'selected' : '' }}>Long Answer</option>
                    <option value="short" {{ old('question_type', $question->question_type) == 'short' ? 'selected' : '' }}>Short Answer</option>
                    <option value="mcq" {{ old('question_type', $question->question_type) == 'mcq' ? 'selected' : '' }}>MCQ</option>
                </select>
                @error('question_type') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
            </div>
        </div>

        <div>
            <label for="text" class="block text-sm font-medium text-ink-600 mb-1">Question Text *</label>
            <textarea name="text" id="text" rows="4" required class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">{{ old('text', $question->text) }}</textarea>
            @error('text') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
        </div>

        <div>
            <label for="max_marks" class="block text-sm font-medium text-ink-600 mb-1">Max Marks *</label>
            <input type="number" name="max_marks" id="max_marks" value="{{ old('max_marks', $question->max_marks) }}" required min="0" step="0.5"
                class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">
            @error('max_marks') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
        </div>

        <div>
            <label for="model_answer_text" class="block text-sm font-medium text-ink-600 mb-1">Model Answer Text</label>
            <textarea name="model_answer_text" id="model_answer_text" rows="4" class="w-full border border-graphite-400/50 rounded px-3 py-2 focus:ring-seal-blue-700 focus:border-seal-blue-700">{{ old('model_answer_text', $question->model_answer_text) }}</textarea>
            @error('model_answer_text') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
        </div>

        <div>
            <label for="rubric_json" class="block text-sm font-medium text-ink-600 mb-1">Rubric JSON</label>
            <textarea name="rubric_json" id="rubric_json" rows="4" class="w-full border border-graphite-400/50 rounded px-3 py-2 font-mono text-sm focus:ring-seal-blue-700 focus:border-seal-blue-700">{{ old('rubric_json', is_array($question->rubric_json) ? json_encode($question->rubric_json, JSON_PRETTY_PRINT) : $question->rubric_json) }}</textarea>
            @error('rubric_json') <p class="text-red-500 text-xs mt-1">{{ $message }}</p> @enderror
        </div>

        <div class="flex justify-end gap-3">
            <a href="{{ route('admin.question-papers.show', $question->questionPaper) }}" class="px-4 py-2 border border-graphite-400/50 rounded text-ink-600 hover:bg-paper-50">Cancel</a>
            <button type="submit" class="px-4 py-2 bg-seal-blue-700 text-white rounded hover:bg-seal-blue-700/90">Update</button>
        </div>
    </form>
</div>
@endsection