<div class="border p-2 rounded shadow-md h-32 relative cursor-pointer bg-amber-50">
    {{-- 房間名稱 + 線上狀態圓點 --}}
    <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-{{ $room->is_online ?  'green-600': 'red-600' }} text-center">
        {{ $room->is_online ? __('rooms.active') : __('rooms.error') }}
    </div>
</div>