/**
 * Browse card image wells only — brown top → black bottom.
 * Listing page sides + hero/zoom use jr-listing-v2.css adaptive accent (per photo).
 */

:root {
    --jr-well-gradient: linear-gradient(
        180deg,
        #35201b 0%,
        #241612 28%,
        #141010 55%,
        #080808 78%,
        #000000 100%
    );
}

/* Browse cards only — do not touch listing .jr2-* surfaces */
.jr-browse-mockup .jr-listing-card__media,
.jr-browse-mockup .jr-card-gallery__slide {
    background: var(--jr-well-gradient) !important;
}

.jr-browse-mockup .jr-listing-card__media::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    z-index: 2;
    background:
        linear-gradient(90deg, rgba(0, 0, 0, 0.2) 0%, transparent 12%, transparent 88%, rgba(0, 0, 0, 0.2) 100%),
        linear-gradient(180deg, transparent 0%, transparent 50%, rgba(0, 0, 0, 0.35) 100%);
}

.jr-browse-mockup .jr-listing-card__media img,
.jr-browse-mockup .jr-card-gallery__slide img {
    opacity: 1 !important;
    position: relative;
    z-index: 3;
}

[data-jr-theme="light"] .jr-browse-mockup .jr-listing-card__media,
[data-jr-theme="light"] .jr-browse-mockup .jr-card-gallery__slide {
    background: linear-gradient(180deg, #ebe2da 0%, #e0d5cc 45%, #d4c8bf 100%) !important;
}

@media (prefers-reduced-motion: reduce) {
    .jr-browse-mockup .jr-listing-card__media::after {
        background: none;
    }
}