@php
    use App\Enums\RoomStatus;
    $statusColors = [
        RoomStatus::Active->value => 'green-600',
        RoomStatus::Closed->value => 'gray-600',
        RoomStatus::Error->value => 'red-600',
    ];
@endphp

<div class="border p-2 rounded shadow-md h-32 relative cursor-pointer bg-amber-50"
     wire:click="$dispatchTo('admin.room-detail-modal','openModal', { roomId: {{ $room->id }} })">
    {{-- 房間名稱 + 線上狀態圓點 --}}
    <div class="font-bold flex items-center gap-1">
        <span class="w-2.5 h-2.5 rounded-full inline-block 
                     {{ $room->is_online ? 'bg-green-500' : 'bg-red-500' }}">&nbsp;&nbsp;
        </span>
        <span>{{ $room->type->labels().".".$room->name }}</span>
        
    </div>
    <div class="text-sm text-{{ $statusColors[$room->status->value] ?? 'gray-500' }} text-center">
        {{ $room->status->labels() }}
    </div>
    <div class="text-xs text-center  whitespace-nowrap ">{{ $room->str_started_at() }}</div>
    <div class="text-xs text-center  whitespace-nowrap ">{{ $room->str_ended_at() }}</div>

</div>