.listing-person div,
.teacher-mini div,
.user-avatar,
.teacher-card__avatar,
.course-teacher__avatar,
.profile-avatar,
.profile-photo {
    overflow: hidden;
    flex-shrink: 0;
}

.listing-person div,
.teacher-mini div {
    width: 40px !important;
    height: 40px !important;
    min-width: 40px;
    min-height: 40px;
    max-width: 40px;
    max-height: 40px;
}

.course-teacher__avatar {
    width: 52px !important;
    height: 52px !important;
    min-width: 52px;
    min-height: 52px;
    max-width: 52px;
    max-height: 52px;
}

.user-avatar,
.teacher-card__avatar {
    width: 92px !important;
    height: 92px !important;
    min-width: 92px;
    min-height: 92px;
    max-width: 92px;
    max-height: 92px;
}

.profile-photo {
    width: 120px !important;
    height: 120px !important;
    min-width: 120px;
    min-height: 120px;
    max-width: 120px;
    max-height: 120px;
}

.profile-avatar {
    width: 128px !important;
    height: 128px !important;
    min-width: 128px;
    min-height: 128px;
    max-width: 128px;
    max-height: 128px;
}

.listing-person img,
.teacher-mini img,
.user-avatar img,
.teacher-card__avatar img,
.course-teacher__avatar img,
.profile-avatar img,
.profile-photo img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none;
    border-radius: inherit;
    object-fit: cover;
}

@media (max-width: 640px) {
    .profile-avatar {
        width: 104px !important;
        height: 104px !important;
        min-width: 104px;
        min-height: 104px;
        max-width: 104px;
        max-height: 104px;
    }
}

/* Tidy up: Remove container gradient/blue background when an image is loaded to prevent leaks */
.listing-person div:has(img),
.teacher-mini div:has(img),
.user-avatar:has(img),
.teacher-card__avatar:has(img),
.course-teacher__avatar:has(img),
.profile-avatar:has(img),
.profile-photo:has(img) {
    background: transparent !important;
    border-color: #ffffff !important;
}