@extends('layouts.app')

@section('title', 'My Timetable')

@section('content')
<div class="card">
    <h2 style="font-size:17px;color:#0b4f2c;margin-bottom:16px;">My Timetable</h2>

    <table style="width:100%;border-collapse:collapse;font-size:13px;">
        <thead>
            <tr style="background:#f4f6f5;text-align:left;">
                <th style="padding:8px;">Day</th>
                <th style="padding:8px;">Time</th>
                <th style="padding:8px;">Class</th>
                <th style="padding:8px;">Subject</th>
            </tr>
        </thead>
        <tbody>
            @forelse($timetable ?? [] as $slot)
                <tr style="border-bottom:1px solid #eee;">
                    <td style="padding:8px;">{{ $slot->day_of_week }}</td>
                    <td style="padding:8px;">{{ \Illuminate\Support\Carbon::parse($slot->start_time)->format('g:ia') }}–{{ \Illuminate\Support\Carbon::parse($slot->end_time)->format('g:ia') }}</td>
                    <td style="padding:8px;font-weight:bold;">{{ $slot->classArm->schoolClass->name }} {{ $slot->classArm->name }}</td>
                    <td style="padding:8px;">{{ $slot->subject->name }}</td>
                </tr>
            @empty
                <tr><td colspan="4" style="padding:20px;text-align:center;color:#999;">No timetable slots assigned yet.</td></tr>
            @endforelse
        </tbody>
    </table>
</div>
@endsection