@extends('dashboard.layouts.app')

@section('content')
<div class="container-fluid">
    <div class="row justify-content-center">
        <div class="col-md-8">
            <div class="shadow-sm border-0" style="border-radius: 18px;">
                <div class="border-bottom p-3 d-flex justify-content-between align-items-center" style="border-radius: 18px 18px 0 0;">
                    <div class="mb-0">Session Details</div>
                    <a href="{{ route('supervisor-session-slots.index') }}" class="btn btn-sm btn-outline-secondary">Back to List</a>
                </div>
                <div class="p-3">
                    <div class="row mb-3">
                        <div class="col-md-6">
                            <div class=" text-uppercase small ls-1">Session Info</div>
                            <p class="mb-1"><strong>Type:</strong> <span class="badge bg-info text-dark">{{ ucfirst($session->session_type) }}</span></p>
                            <p class="mb-1"><strong>Date:</strong> {{ $session->date }}</p>
                            <p class="mb-1"><strong>Time:</strong> {{ $session->start_time }} - {{ $session->end_time }}</p>
                            <p class="mb-1"><strong>Duration:</strong> 
                                {{ \Carbon\Carbon::parse($session->start_time)->diffInMinutes(\Carbon\Carbon::parse($session->end_time)) }} min
                            </p>
                            <p class="mb-0"><strong>Status:</strong> <span class="badge bg-{{ $session->status == 'pending' ? 'secondary' : 'success' }}">{{ ucfirst($session->status) }}</span></p>
                        </div>
                        <div class="col-md-6">
                            <div class=" text-uppercase small ls-1">supervisor Member</div>
                            <p class="fw-bold">{{ $session->staff->full_name ?? '' }}</p>
                            <p class="small  mb-0">{{ $session->staff->email ?? '' }}</p>
                        </div>
                    </div>

                    <hr>

                    <div>
                        <div class=" text-uppercase small ls-1 mb-3">Applicants / Participants</div>
                        @if($session->applicants->count() > 0)
                            <ul class="list-group list-group-flush">
                                @foreach($session->applicants as $applicant)
                                <li class="list-group-item d-flex justify-content-between align-items-center bg-transparent px-0">
                                    <div>
                                        <div class="fw-bold">{{ $applicant->first_name }} {{ $applicant->last_name }}</div>
                                        <div class="small ">{{ $applicant->email }}</div>
                                    </div>
                                    <a href="{{ route('applicants.showApplicants', $applicant->id) }}" class="btn btn-sm btn-light">View Profile</a>
                                </li>
                                @endforeach
                            </ul>
                        @else
                            <div class="text-center py-3 ">
                                <i class="ri-user-unfollow-line d-block fs-2 mb-2"></i>
                                No applicants assigned to this session yet.
                            </div>
                        @endif
                    </div>
                </div>
                <div class="card-footer bg-light p-3 border-top" style="border-radius: 0 0 18px 18px;">
                    <div class="d-flex justify-content-end gap-2">
                        <a href="{{ route('supervisor-session-slots.edit', $session->id) }}" class="btn btn-outline-primary">Edit Session</a>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection