/*
 * The profile's original avatar setting is 120px. Keep that as the actual
 * ceiling; max-width: 100% alone lets a member's custom CSS stretch the image
 * to the full profile column. The wrapper still shrinks on narrow screens.
 */
.mbp-profile-avatar {
    width: 120px;
    max-width: 100%;
    margin: 0 auto;
}

.mbp-profile-avatar .mbp-avatar {
    display: block;
    width: 120px !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: contain;
}

/* Keep other member photos proportional when legacy markup supplies dimensions. */
.mbp-avatar {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Comment text may contain member-supplied HTML images. Keep those images
 * inside the original comment body cell so they cannot widen the profile. */
.mbp-comment-content {
    table-layout: fixed;
    max-width: 100%;
}

.mbp-comment-content .comment-text {
    min-width: 0;
    max-width: 100%;
    overflow-wrap: anywhere;
}

.mbp-comment-content .comment-text img {
    display: block;
    width: auto !important;
    max-width: 100% !important;
    height: auto !important;
}

.mbp-profile-comments {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
}

.mbp-profile-comments .comment-text img {
    max-width: 100% !important;
    height: auto !important;
}
/* Reserve the Recent Visitors tile dimensions so pic1/pic2 hover borders do
 * not resize the row or make neighboring avatars jump. */
.mbp-recent-visitor-avatar {
    display: inline-block;
    width: var(--mbp-recent-visitor-size, 50px);
    height: var(--mbp-recent-visitor-size, 50px);
    vertical-align: middle;
}

.mbp-recent-visitor-avatar .mbp-avatar {
    display: block;
    width: var(--mbp-recent-visitor-size, 50px) !important;
    height: var(--mbp-recent-visitor-size, 50px) !important;
    box-sizing: border-box;
}