@extends('layouts.platform')

@section('title', $school->name)
@section('header', $school->name)

@section('content')
    {{-- Header --}}
    <div class="mb-8 flex items-start justify-between">
        <div class="flex items-center gap-4">
            <div class="flex h-16 w-16 items-center justify-center rounded-2xl bg-primary-100 text-primary-700 text-xl font-bold">
                {{ $school->initials }}
            </div>
            <div>
                <h2 class="text-2xl font-display font-bold text-gray-900">{{ $school->name }}</h2>
                <p class="text-gray-500">{{ $school->email }} &middot; {{ $school->phone }}</p>
                <p class="text-sm text-gray-400">{{ $school->address }}, {{ $school->city }}, {{ $school->state }}</p>
            </div>
        </div>
        <div class="flex gap-3">
            <a href="{{ route('platform.schools.edit', $school) }}" class="rounded-lg border border-gray-300 bg-white px-4 py-2 text-sm font-medium text-gray-700 hover:bg-gray-50 transition-colors">
                Edit
            </a>
            <form method="POST" action="{{ route('platform.schools.update-status', $school) }}">
                @csrf
                @method('PATCH')
                <select name="status" onchange="this.form.submit()" class="rounded-lg border border-gray-300 px-3 py-2 text-sm shadow-sm focus:border-primary-500 focus:outline-none">
                    <option value="active" {{ $school->status->value === 'active' ? 'selected' : '' }}>Active</option>
                    <option value="suspended" {{ $school->status->value === 'suspended' ? 'selected' : '' }}>Suspended</option>
                    <option value="inactive" {{ $school->status->value === 'inactive' ? 'selected' : '' }}>Inactive</option>
                </select>
            </form>
            <form method="POST" action="{{ route('platform.schools.destroy', $school) }}" onsubmit="return confirm('This will permanently delete the school and ALL its data. Are you sure?')">
                @csrf
                @method('DELETE')
                <button type="submit" class="rounded-lg border border-red-200 bg-white px-4 py-2 text-sm font-medium text-red-600 hover:bg-red-50 transition-colors">
                    Delete
                </button>
            </form>
        </div>
    </div>

    {{-- Stats --}}
    <div class="grid grid-cols-1 gap-4 sm:grid-cols-2 lg:grid-cols-4 mb-8">
        <div class="rounded-xl bg-white p-5 shadow-sm ring-1 ring-gray-900/5">
            <p class="text-sm text-gray-500">Total Users</p>
            <p class="text-2xl font-display font-bold text-gray-900">{{ $stats['total_users'] }}</p>
        </div>
        <div class="rounded-xl bg-white p-5 shadow-sm ring-1 ring-gray-900/5">
            <p class="text-sm text-gray-500">Students</p>
            <p class="text-2xl font-display font-bold text-blue-600">{{ $stats['total_students'] }}</p>
        </div>
        <div class="rounded-xl bg-white p-5 shadow-sm ring-1 ring-gray-900/5">
            <p class="text-sm text-gray-500">Teachers</p>
            <p class="text-2xl font-display font-bold text-green-600">{{ $stats['total_teachers'] }}</p>
        </div>
        <div class="rounded-xl bg-white p-5 shadow-sm ring-1 ring-gray-900/5">
            <p class="text-sm text-gray-500">Parents</p>
            <p class="text-2xl font-display font-bold text-amber-600">{{ $stats['total_parents'] }}</p>
        </div>
    </div>

    {{-- Details --}}
    <div class="grid grid-cols-1 lg:grid-cols-2 gap-6">
        <div class="rounded-xl bg-white p-6 shadow-sm ring-1 ring-gray-900/5">
            <h3 class="text-lg font-display font-semibold text-gray-900 mb-4">School Details</h3>
            <dl class="space-y-3">
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Status</dt>
                    <dd>
                        <span class="inline-flex items-center rounded-full px-2.5 py-0.5 text-xs font-medium
                            {{ $school->status->value === 'active' ? 'bg-green-50 text-green-700' : '' }}
                            {{ $school->status->value === 'trial' ? 'bg-blue-50 text-blue-700' : '' }}
                            {{ $school->status->value === 'suspended' ? 'bg-red-50 text-red-700' : '' }}">
                            {{ $school->status->label() }}
                        </span>
                    </dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Current Plan</dt>
                    <dd class="text-sm font-medium text-gray-900">{{ $school->plan?->name ?? 'No Plan' }}</dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Timezone</dt>
                    <dd class="text-sm text-gray-900">{{ $school->timezone }}</dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Country</dt>
                    <dd class="text-sm text-gray-900">{{ $school->country }}</dd>
                </div>
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Registered</dt>
                    <dd class="text-sm text-gray-900">{{ $school->created_at->format('M d, Y') }}</dd>
                </div>
                @if($school->trial_ends_at)
                <div class="flex justify-between">
                    <dt class="text-sm text-gray-500">Trial Ends</dt>
                    <dd class="text-sm {{ $school->isTrialExpired() ? 'text-red-600 font-medium' : 'text-gray-900' }}">
                        {{ $school->trial_ends_at->format('M d, Y') }}
                    </dd>
                </div>
                @endif
            </dl>
        </div>

        <div class="rounded-xl bg-white p-6 shadow-sm ring-1 ring-gray-900/5">
            <h3 class="text-lg font-display font-semibold text-gray-900 mb-4">Recent Users</h3>
            <div class="space-y-3">
                @forelse($school->users()->latest()->take(5)->get() as $user)
                    <div class="flex items-center gap-3">
                        <div class="flex h-8 w-8 items-center justify-center rounded-full bg-gray-100 text-gray-600 text-xs font-bold">
                            {{ substr($user->name, 0, 1) }}
                        </div>
                        <div class="flex-1 min-w-0">
                            <p class="text-sm font-medium text-gray-900 truncate">{{ $user->name }}</p>
                            <p class="text-xs text-gray-500">{{ $user->role instanceof \App\Enums\UserRole ? $user->role->label() : ucfirst((string) $user->role) }}</p>
                        </div>
                        <span class="text-xs {{ $user->is_active ? 'text-green-600' : 'text-red-600' }}">
                            {{ $user->is_active ? 'Active' : 'Inactive' }}
                        </span>
                    </div>
                @empty
                    <p class="text-sm text-gray-500 text-center py-4">No users yet.</p>
                @endforelse
            </div>
        </div>
    </div>
@endsection