@extends('admin.admin_dashboard')

@section('customcss')
<style>
    .details-card {
        border-radius: 12px;
        overflow: hidden;
    }

    .info-label {
        font-size: 12px;
        color: #6b7280;
        margin-bottom: 4px;
        font-weight: 600;
    }

    .info-value {
        font-size: 15px;
        color: #111827;
        font-weight: 600;
        word-break: break-word;
    }

    .status-badge {
        font-size: 12px;
        padding: 6px 12px;
        border-radius: 20px;
        font-weight: 700;
    }

    .status-upcoming {
        background: #e0f2fe;
        color: #0369a1;
    }

    .status-live {
        background: #dcfce7;
        color: #15803d;
    }

    .status-completed {
        background: #f3f4f6;
        color: #374151;
    }

    .platform-badge {
        background: #eef2ff;
        color: #4338ca;
        padding: 6px 12px;
        border-radius: 30px;
        font-size: 13px;
        font-weight: 700;
        display: inline-block;
    }

    .link-box {
        background: #f9fafb;
        border: 1px solid #e5e7eb;
        padding: 12px;
        border-radius: 8px;
    }

    .timeline-box {
        background: #f8fafc;
        border-left: 4px solid #2563eb;
        padding: 14px;
        border-radius: 8px;
    }
</style>
@endsection

@section('admin')

@php
    $status = $onlineClass->runtime_status;

    $statusClass = match($status) {
        'live' => 'status-live',
        'completed' => 'status-completed',
        default => 'status-upcoming',
    };
@endphp

<div class="content-body default-height">
    <div class="container-fluid">

        {{-- Breadcrumb --}}
        <div class="row page-titles">
            <ol class="breadcrumb">
                <li class="breadcrumb-item">
                    <a href="{{ route('admin.dashboard') }}">Home</a>
                </li>

                <li class="breadcrumb-item">
                    <a href="{{ route('admin.online.online-classes.index') }}">Online Classes</a>
                </li>

                <li class="breadcrumb-item active">
                    <a href="javascript:void(0)">Online Class Details</a>
                </li>
            </ol>
        </div>

        <div class="row">
            <div class="col-xl-12">

                <div class="card details-card">
                    <div class="card-header d-flex justify-content-between align-items-center flex-wrap gap-2">
                        <div>
                            <h4 class="card-title mb-1">
                                <i class="fa-solid fa-video me-2"></i>
                                Online Class Details
                            </h4>

                            <small class="text-muted">
                                Status is calculated live using Asia/Dhaka timezone.
                            </small>
                        </div>

                        <div>
                            <span class="status-badge {{ $statusClass }}">
                                {{ ucfirst($status) }}
                            </span>
                        </div>
                    </div>

                    <div class="card-body">

                        {{-- Main Info --}}
                        <div class="row">

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Session</div>
                                <div class="info-value">
                                    {{ $onlineClass->session->session_name ?? $onlineClass->session->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Class</div>
                                <div class="info-value">
                                    {{ $onlineClass->class->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Section</div>
                                <div class="info-value">
                                    {{ $onlineClass->section->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Subject</div>
                                <div class="info-value">
                                    {{ $onlineClass->subject->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Teacher</div>
                                <div class="info-value">
                                    {{ $onlineClass->teacher->teacher_name ?? $onlineClass->teacher->name ?? 'Not Assigned' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Platform</div>
                                <div>
                                    <span class="platform-badge">
                                        {{ $onlineClass->platform_name }}
                                    </span>
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Class Date</div>
                                <div class="info-value">
                                    {{ $onlineClass->class_date?->format('d-m-Y') }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-4">
                                <div class="info-label">Time</div>
                                <div class="info-value">
                                    {{ \Carbon\Carbon::parse($onlineClass->start_time)->format('h:i A') }}
                                    -
                                    {{ \Carbon\Carbon::parse($onlineClass->end_time)->format('h:i A') }}
                                </div>
                            </div>

                        </div>

                        <hr>

                        {{-- Runtime Timeline --}}
                        <div class="row">
                            <div class="col-xl-12 mb-4">
                                <div class="timeline-box">
                                    <strong>
                                        <i class="fa-solid fa-clock me-1"></i>
                                        Runtime Analysis
                                    </strong>

                                    <div class="mt-2">
                                        <div>
                                            Start:
                                            <strong>{{ $onlineClass->start_at->format('d-m-Y h:i A') }}</strong>
                                        </div>

                                        <div>
                                            End:
                                            <strong>{{ $onlineClass->end_at->format('d-m-Y h:i A') }}</strong>
                                        </div>

                                        <div>
                                            Dhaka Time Now:
                                            <strong>{{ now(\App\Models\OnlineClass::TIMEZONE)->format('d-m-Y h:i A') }}</strong>
                                        </div>

                                        <div>
                                            Can Join:
                                            <strong>{{ $onlineClass->can_join ? 'Yes' : 'No' }}</strong>
                                        </div>

                                        <div>
                                            Can Add Recording:
                                            <strong>{{ $onlineClass->can_add_recording ? 'Yes' : 'No' }}</strong>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>

                        {{-- Links --}}
                        <div class="row">

                            <div class="col-xl-6 mb-4">
                                <div class="info-label">Meeting Link</div>

                                <div class="link-box">
                                    @if($onlineClass->meeting_link)
                                        <a href="{{ $onlineClass->meeting_link }}"
                                           target="_blank"
                                           class="btn btn-success btn-sm mb-2">
                                            <i class="fa fa-link me-1"></i>
                                            Open Meeting Link
                                        </a>

                                        <div class="small text-muted">
                                            {{ $onlineClass->meeting_link }}
                                        </div>
                                    @else
                                        <span class="text-muted">No meeting link found.</span>
                                    @endif
                                </div>
                            </div>

                            <div class="col-xl-6 mb-4">
                                <div class="info-label">Recording Link</div>

                                <div class="link-box">
                                    @if($onlineClass->recording_link)
                                        <a href="{{ $onlineClass->recording_link }}"
                                           target="_blank"
                                           class="btn btn-info btn-sm mb-2">
                                            <i class="fa fa-play me-1"></i>
                                            Open Recording
                                        </a>

                                        <div class="small text-muted">
                                            {{ $onlineClass->recording_link }}
                                        </div>
                                    @else
                                        <span class="text-muted">
                                            {{ $onlineClass->can_add_recording ? 'Recording link not added yet.' : 'Recording link can be added after class completion.' }}
                                        </span>
                                    @endif
                                </div>
                            </div>

                        </div>

                        <hr>

                        {{-- Audit --}}
                        <div class="row">

                            <div class="col-xl-3 col-md-6 mb-3">
                                <div class="info-label">Created By</div>
                                <div class="info-value">
                                    {{ $onlineClass->creator->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-3">
                                <div class="info-label">Updated By</div>
                                <div class="info-value">
                                    {{ $onlineClass->updater->name ?? 'N/A' }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-3">
                                <div class="info-label">Created At</div>
                                <div class="info-value">
                                    {{ $onlineClass->created_at?->format('d-m-Y h:i A') }}
                                </div>
                            </div>

                            <div class="col-xl-3 col-md-6 mb-3">
                                <div class="info-label">Updated At</div>
                                <div class="info-value">
                                    {{ $onlineClass->updated_at?->format('d-m-Y h:i A') }}
                                </div>
                            </div>

                        </div>

                    </div>

                    <div class="card-footer border-0">
                        <a href="{{ route('admin.online.online-classes.edit', $onlineClass->id) }}"
                           class="btn btn-warning">
                            <i class="fa fa-edit me-1"></i>
                            Edit
                        </a>

                        <a href="{{ route('admin.online.online-classes.index') }}"
                           class="btn btn-danger light">
                            Back
                        </a>
                    </div>
                </div>

            </div>
        </div>

    </div>
</div>

@endsection

@section('customjs')
@endsection