.tsc-smr {
    width: calc(100% - 20px);
    clear: both;
    margin: 10px 0 52px 20px !important;
}

.tsc-smr-layout {
    margin-left: 20px;
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
    align-items: start;
}

.tsc-smr-layout.has-ad {
    grid-template-columns: minmax(0, 1fr) minmax(300px, 320px);
}

.tsc-smr-products {
    min-width: 0;
}

.tsc-smr-ad {
    position: sticky;
    top: calc(var(--tsc-shell-adminbar-offset, 0px) + var(--tsc-shell-topbar-height, 92px) + 10px);
    align-self: start;
    width: 100%;
    min-height: 600px;
    margin-top: 0 !important;
}

.tsc-smr-ad-slot {
    width: 100%;
    min-height: 600px;
}

.tsc-smr-ad-slot ins.adsbygoogle {
    display: block;
    width: 100%;
    min-height: 600px;
}

/* Compact only this related-download surface while letting the image use the full card width. */
.tsc-smr ul.products li.product .product-inner,
.tsc-smr .products div.product .product-inner {
    overflow: hidden;
    border-radius: 16px !important;
}

.tsc-smr ul.products li.product .product-inner > a,
.tsc-smr .products div.product .product-inner > a {
    padding: 0 0 18px 0 !important;
    border-radius: 16px !important;
}

.tsc-smr ul.products li.product .product-inner > a .product-thumbnail-wrapper,
.tsc-smr .products div.product .product-inner > a .product-thumbnail-wrapper {
    height: 190px !important;
    width: 100% !important;
    margin: 0 !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
    overflow: hidden;
}

.tsc-smr ul.products li.product .product-inner > a .product-thumbnail-wrapper img,
.tsc-smr .products div.product .product-inner > a .product-thumbnail-wrapper img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: none !important;
    object-fit: cover !important;
    border-top-left-radius: 16px !important;
    border-top-right-radius: 16px !important;
    border-bottom-left-radius: 0 !important;
    border-bottom-right-radius: 0 !important;
}

.tsc-smr ul.products li.product .product-inner > a .title-area,
.tsc-smr .products div.product .product-inner > a .title-area {
    margin: 10px 10px 0 10px !important;
    height: 24px !important;
}

.tsc-smr ul.products li.product .product-inner > a .title-area h3,
.tsc-smr ul.products li.product .product-inner > a .title-area .woocommerce-loop-product__title,
.tsc-smr .products div.product .product-inner > a .title-area h3,
.tsc-smr .products div.product .product-inner > a .title-area .woocommerce-loop-product__title,
.tsc-smr ul.products li.product .product-inner > a .title-area .product-brand,
.tsc-smr .products div.product .product-inner > a .title-area .product-brand,
.tsc-smr ul.products li.product .product-inner > a .title-area .tsc-smr-creator,
.tsc-smr .products div.product .product-inner > a .title-area .tsc-smr-creator {
    margin-left: 0 !important;
    margin-right: 0 !important;
}


.tsc-smr-layout .ca-creator-name-loop {
    padding-left: 15px;
}

/* Creator names injected inside the title area already inherit the title-area side margin.
   Remove the earlier scoped padding here so AJAX/infinite-scroll cards align with the title. */
.tsc-smr-layout .title-area .ca-creator-name-loop,
.tsc-smr-layout .title-area .tsc-smr-creator {
    padding-left: 0 !important;
}

.tsc-smr-loader {
    margin: 24px 0;
    text-align: center;
    font-size: 13px;
}

.tsc-smr-sentinel {
    width: 100%;
    height: 1px;
}

@media (max-width: 1280px) {
    .tsc-smr-layout.has-ad {
        grid-template-columns: minmax(0, 1fr);
    }

    .tsc-smr-ad {
        display: none;
    }
}

@media (max-width: 640px) {
    .tsc-smr {
        width: calc(100% - 20px);
        margin-left: 20px !important;
    }
}
