/*
 * Doctor.bd Hospitals Directory alignment layer.
 * Reuses the Doctors Directory design system and adds only hospital-specific details.
 */
body.hospital-directory-page {
    --hospital-directory-avatar-size: 96px;
}

.hospital-directory-avatar,
.hospital-directory-avatar-fallback {
    width: var(--hospital-directory-avatar-size);
    height: var(--hospital-directory-avatar-size);
    border: 1px solid #dce5ef;
    box-shadow: 0 5px 14px rgba(30, 64, 112, 0.08);
}

.hospital-directory-avatar-link:hover .hospital-directory-avatar,
.hospital-directory-avatar-link:hover .hospital-directory-avatar-fallback {
    border-color: #91baf3;
}

.hospital-directory-avatar-fallback {
    background: linear-gradient(145deg, #edf5ff 0%, #dbeaff 100%) !important;
}

.hospital-directory-type-badge {
    bottom: 7px !important;
    max-width: 88px;
    padding: 3px 7px;
    overflow: hidden;
    font-size: 0.66rem;
    line-height: 1.2;
    text-overflow: ellipsis;
    background: rgba(17, 24, 39, 0.86);
    box-shadow: 0 3px 8px rgba(15, 23, 42, 0.18);
}

.hospital-directory-name {
    color: var(--doctor-directory-ink);
}

.hospital-directory-specialist-illustration {
    right: -8px;
    width: 60%;
    max-height: 232px;
}

.hospital-directory-page .directory-sidebar .badge {
    min-width: 32px;
    font-size: 0.68rem;
}

.hospital-directory-page .directory-sidebar .list-group-item.active .badge {
    color: var(--doctor-directory-blue) !important;
    background: #fff !important;
    border-color: #fff !important;
}

@media (max-width: 767.98px) {
    body.hospital-directory-page {
        --hospital-directory-avatar-size: 82px;
    }
}

@media (max-width: 575.98px) {
    body.hospital-directory-page {
        --hospital-directory-avatar-size: 72px;
    }

    .hospital-directory-type-badge {
        max-width: 66px;
        padding: 3px 5px;
    }
}