@extends('layouts.app')
@section('title', 'Subject Allocation')
@section('content')
<div class="card">
    <h2 style="font-size:17px;color:#0b4f2c;margin-bottom:16px;">Subject Allocation</h2>
    <p style="font-size:12.5px;color:#777;margin-bottom:14px;">Assign a teacher to each subject taught in each class.</p>

    @forelse($classes as $class)
        <div style="border:1px solid #eee;border-radius:8px;padding:12px;margin-bottom:10px;">
            <strong style="color:#0b4f2c;">{{ $class->name }}</strong>
            <table style="width:100%;border-collapse:collapse;font-size:12.5px;margin-top:8px;">
                <thead><tr style="background:#f4f6f5;text-align:left;"><th style="padding:5px;">Subject</th><th style="padding:5px;">Teacher</th></tr></thead>
                <tbody>
                    @forelse($class->subjects as $subject)
                        <tr style="border-bottom:1px solid #eee;">
                            <td style="padding:5px;">{{ $subject->name }}</td>
                            <td style="padding:5px;">
                                <select style="padding:4px;border:1px solid #ddd;border-radius:4px;font-size:12px;">
                                    <option value="">Unassigned</option>
                                    @foreach($teachers as $teacher)
                                        <option value="{{ $teacher->id }}" {{ $subject->pivot->teacher_id == $teacher->id ? 'selected' : '' }}>{{ $teacher->user->name }}</option>
                                    @endforeach
                                </select>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="2" style="padding:6px;color:#999;">No subjects assigned to this class yet.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    @empty
        <p style="color:#999;font-size:13px;">No classes set up yet.</p>
    @endforelse
</div>
@endsection