/* Existing MyListing image/gallery modes only. No synthetic cover carousel. */
body.single-listing #c27-single-listing .profile-cover.profile-cover-image,
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery {
    --nmp-native-cover-height: clamp(240px, 22vw, 360px);
    height: var(--nmp-native-cover-height) !important;
    min-height: 0;
    /* Override only the image template's inline percentage-padding spacer. */
    padding-bottom: 0 !important;
}

body.single-listing #c27-single-listing .profile-cover.profile-cover-image > img {
    width: 100%;
    height: 100% !important;
    inset: 0;
    object-fit: cover;
}

/* Only pixel-known covers that would otherwise upscale get this class. */
body.single-listing #c27-single-listing .profile-cover.profile-cover-image > img.nmp-cover-fit-original {
    position: absolute;
    inset: auto;
    top: 50%;
    left: 50%;
    width: var(--nmp-cover-fit-width) !important;
    height: var(--nmp-cover-fit-height) !important;
    max-width: var(--nmp-cover-original-width);
    max-height: var(--nmp-cover-original-height);
    object-fit: contain !important;
    transform: translate(-50%, -50%);
}

/* Keep each level of the theme-owned header carousel inside its cover. */
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery .header-gallery-carousel,
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery .header-gallery-carousel .owl-stage-outer,
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery .header-gallery-carousel .owl-stage,
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery .header-gallery-carousel .owl-item,
body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery .header-gallery-carousel .item {
    height: 100%;
}

@media (max-width: 768px) {
    body.single-listing #c27-single-listing .profile-cover.profile-cover-image {
        /* Preserve the current native 35% phone ratio, cap wider screens. */
        --nmp-native-cover-height: min(35vw, 200px);
    }
    body.single-listing #c27-single-listing .profile-cover.profile-cover-gallery {
        --nmp-native-cover-height: clamp(160px, 45vw, 220px);
    }

    /* Keep the native grid/lightbox; enlarge only its first photo on phones. */
    body.single-listing #c27-single-listing .gallery-grid-block .gallery-grid > a.gallery-item:first-child {
        grid-column: 1 / -1;
        padding-bottom: 0;
    }
    body.single-listing #c27-single-listing .gallery-grid-block .gallery-grid > a.gallery-item:first-child > img {
        position: static;
        display: block;
        width: 100%;
        height: auto;
        max-height: min(65vh, 560px);
        object-fit: contain;
    }
}

@media (max-width: 768px) and (hover: none) {
    body.single-listing #c27-single-listing .gallery-grid-block .gallery-grid > a.gallery-item:first-child:hover > img {
        opacity: 1;
        transform: none;
    }
}