{% if beds %}
    {% regroup beds by ward as ward_groups %}
    {% for ward_group in ward_groups %}
        <div class="col-12 mb-4">
            <h5>{{ ward_group.grouper.name }}</h5>
            <div class="row">
                {% for bed in ward_group.list %}
                <div class="col-lg-3 col-md-4 col-sm-6 mb-3">
                    <div class="card {% if bed.status == 'AVAILABLE' %}border-success{% elif bed.status == 'OCCUPIED' %}border-warning{% elif bed.status == 'MAINTENANCE' %}border-danger{% elif bed.status == 'RESERVED' %}border-info{% elif bed.status == 'BLOCKED' %}border-secondary{% endif %}">
                        <div class="card-header py-2">
                            <div class="d-flex justify-content-between align-items-center">
                                <small><strong>{{ bed.room_number }}-{{ bed.bed_number }}</strong></small>
                                {% if bed.status == 'AVAILABLE' %}
                                    <span class="badge bg-success">Available</span>
                                {% elif bed.status == 'OCCUPIED' %}
                                    <span class="badge bg-warning">Occupied</span>
                                {% elif bed.status == 'MAINTENANCE' %}
                                    <span class="badge bg-danger">Maintenance</span>
                                {% elif bed.status == 'RESERVED' %}
                                    <span class="badge bg-info">Reserved</span>
                                {% elif bed.status == 'BLOCKED' %}
                                    <span class="badge bg-secondary">Blocked</span>
                                {% endif %}
                            </div>
                        </div>
                        <div class="card-body py-2">
                            {% if bed.current_patient %}
                                <div class="text-center">
                                    <strong>{{ bed.current_patient.get_full_name }}</strong><br>
                                    <small class="text-muted">{{ bed.current_patient.mrn }}</small><br>
                                    {% if bed.current_admission %}
                                        <small class="text-muted">
                                            Admitted: {{ bed.current_admission.admission_datetime|date:"M d" }}
                                        </small>
                                    {% endif %}
                                </div>
                            {% else %}
                                <div class="text-center text-muted">
                                    <i class="fas fa-bed fa-2x mb-1"></i><br>
                                    <small>{{ bed.get_bed_type_display }}</small>
                                </div>
                            {% endif %}
                        </div>
                        <div class="card-footer py-1">
                            <div class="btn-group w-100">
                                {% if bed.status == 'AVAILABLE' %}
                                <button class="btn btn-outline-primary btn-sm" title="Assign Patient">
                                    <i class="fas fa-user-plus"></i>
                                </button>
                                {% elif bed.status == 'OCCUPIED' %}
                                <button class="btn btn-outline-warning btn-sm" title="Transfer">
                                    <i class="fas fa-exchange-alt"></i>
                                </button>
                                <button class="btn btn-outline-success btn-sm" title="Discharge">
                                    <i class="fas fa-sign-out-alt"></i>
                                </button>
                                {% endif %}
                                <button class="btn btn-outline-secondary btn-sm" title="Maintenance">
                                    <i class="fas fa-tools"></i>
                                </button>
                            </div>
                        </div>
                    </div>
                </div>
                {% endfor %}
            </div>
        </div>
    {% endfor %}
{% else %}
    <div class="col-12 text-center py-5 text-muted">
        <i class="fas fa-bed fa-3x mb-3"></i>
        <h5>No beds found</h5>
        <p>No beds match your current filters.</p>
    </div>
{% endif %}