/* Keep product artwork fully visible in compact marketplace surfaces.
   Product photos should never be cropped simply to fill a thumbnail. */

.order-product-thumb,
.order-canary-thumb,
.app-draft-thumb,
.app-selling-card-media,
.fx-seller-preview-media {
    box-sizing: border-box;
    display: grid;
    place-items: center;
    overflow: hidden;
}

/* Order/purchase thumbnails are intentionally square so portrait and landscape
   supplier artwork has predictable breathing room on mobile. */
.order-product-thumb {
    aspect-ratio: 1 / 1 !important;
    padding: 6px !important;
}

.order-canary-thumb,
.app-draft-thumb,
.fx-seller-preview-media {
    padding: 5px !important;
}

.order-product-thumb img,
.order-canary-thumb img,
.app-draft-thumb img,
.app-selling-card-media img,
.fx-seller-preview-media img,
.listing-card-media img,
.app-main-image img,
.app-thumbnail-row img {
    width: 100% !important;
    height: 100% !important;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain !important;
    object-position: center center !important;
}

.order-product-thumb img,
.order-canary-thumb img,
.app-draft-thumb img,
.fx-seller-preview-media img {
    border-radius: inherit;
}

/* Listing grids keep their established card size while showing the entire photo. */
.listing-card-media {
    display: grid;
    place-items: center;
    overflow: hidden;
}

/* Prevent the image itself from zooming/cropping on hover. */
.listing-card:hover .listing-card-media img {
    transform: none !important;
}

@media (max-width: 620px) {
    .order-product-thumb {
        padding: 4px !important;
    }
    .order-canary-thumb,
    .app-draft-thumb,
    .fx-seller-preview-media {
        padding: 4px !important;
    }
}
