{{-- B2B tenancy — People → Teachers: teacher-cap line + roster. Invite lives in
     the header action; each row has a Remove button. --}}
@php($d = $this->getData())
@php($t = $d['seats']['teachers'])

<x-filament-panels::page>
    {{-- ── Teacher-cap summary ────────────────────────────────────────────── --}}
    <div class="text-sm text-gray-600 dark:text-gray-300">
        Teachers
        <span class="font-semibold text-gray-900 dark:text-white">{{ $t['used'] }}</span> /
        <span class="font-semibold text-gray-900 dark:text-white">{{ $t['cap'] ?? 'unlimited' }}</span>
    </div>

    {{-- ── Teachers ───────────────────────────────────────────────────────── --}}
    <div>
        <div class="mb-2 text-sm font-semibold text-gray-700 dark:text-gray-200">
            Teachers ({{ count($d['teachers']) }})
        </div>
        <div class="overflow-hidden rounded-xl border border-gray-200 dark:border-gray-700">
            <table class="w-full text-sm">
                <thead class="bg-gray-50 text-left text-xs uppercase tracking-wide text-gray-400 dark:bg-gray-800">
                    <tr>
                        <th class="px-3 py-2">Name</th>
                        <th class="px-3 py-2">Email</th>
                        <th class="px-3 py-2">Class</th>
                        <th class="px-3 py-2">Role</th>
                        <th class="px-3 py-2 text-right">Action</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-gray-100 dark:divide-gray-800">
                    @forelse ($d['teachers'] as $t)
                        <tr wire:key="teacher-{{ $t['user_id'] }}-{{ $t['house_id'] }}">
                            <td class="px-3 py-2 font-medium text-gray-900 dark:text-white">{{ $t['name'] ?: '—' }}</td>
                            <td class="px-3 py-2 text-gray-500">{{ $t['email'] }}</td>
                            <td class="px-3 py-2 text-gray-500">{{ $t['house'] }}</td>
                            <td class="px-3 py-2 text-gray-500">{{ $t['role_label'] }}</td>
                            <td class="px-3 py-2 text-right">
                                <button type="button"
                                        wire:click="removePerson({{ $t['user_id'] }}, {{ $t['house_id'] }}, {{ $t['role_id'] }})"
                                        wire:confirm="Remove this teacher from the class?"
                                        class="text-xs font-medium text-danger-600 hover:underline">Remove</button>
                            </td>
                        </tr>
                    @empty
                        <tr><td colspan="5" class="px-3 py-6 text-center text-gray-400">No teachers yet.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</x-filament-panels::page>