/*
|--------------------------------------------------------------------------
| CARSELECT FLUID PERFORMANCE V1
|--------------------------------------------------------------------------
|
| Paint/compositor optimization only.
| No layout redesign.
| No functional changes.
|
*/

/*
|--------------------------------------------------------------------------
| LISTING CARDS
|--------------------------------------------------------------------------
|
| Off-screen cards do not need to be painted until they approach viewport.
| Browser may ignore this where unsupported.
|
*/

.cs-listing-card-desktop {
    content-visibility: auto;
    contain-intrinsic-size: auto 286px;
}

/*
|--------------------------------------------------------------------------
| DETAIL HERO
|--------------------------------------------------------------------------
|
| The duplicated blurred background image is an expensive full-size paint
| layer. The actual main photo already covers the gallery.
|
*/

.cs-listing-detail #listing-gallery-main #main-image-bg {
    display: none !important;
    filter: none !important;
    transform: none !important;
}


/*
|--------------------------------------------------------------------------
| DETAIL GALLERY CONTROLS
|--------------------------------------------------------------------------
|
| These elements already have sufficiently opaque backgrounds.
| backdrop-filter causes repeated GPU compositing while scrolling/swiping.
|
*/

.cs-listing-detail #listing-gallery-main #gallery-counter,
.cs-listing-detail #listing-gallery-main .cs-gallery-nav,
#cs-mobile-photo-viewer .cs-mv-counter,
.cs-mobile-fs-v6-close,
.cs-mobile-fs-v6-counter,
.cs-fs-v7-arrow,
.cs-fs-nav-btn {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}


/*
|--------------------------------------------------------------------------
| MOBILE LISTINGS FILTER
|--------------------------------------------------------------------------
|
| Header is already ~99% opaque, so 10px background blur adds essentially
| no useful visual information but creates an extra compositor layer.
|
*/

@media (max-width: 1023px) {

    .cs-mobile-filter-header,
    .cs-mobile-filter-portal .cs-mobile-filter-toolbar {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /*
     * Mobile detail photo counter.
     */
    #gallery-counter {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
    }

    /*
     * Avoid persistent GPU allocation for gallery elements when idle.
     */
    .cs-listing-detail #main-image {
        will-change: auto !important;
    }
}


/*
|--------------------------------------------------------------------------
| REDUCED PAINT COST WHILE SCROLLING
|--------------------------------------------------------------------------
|
| Images are isolated from surrounding layout/paint calculations.
|
*/

.cs-listing-card-desktop img,
.cs-dealer-car img {
    contain: paint;
}


/*
|--------------------------------------------------------------------------
| MOTION SAFETY
|--------------------------------------------------------------------------
|
| Do not animate expensive filters even if older CSS declares transitions.
|
*/

.cs-listing-detail #listing-gallery-main #gallery-counter,
.cs-listing-detail #listing-gallery-main .cs-gallery-nav,
.cs-mobile-filter-header,
.cs-mobile-filter-portal .cs-mobile-filter-toolbar {
    transition-property:
        background-color,
        border-color,
        color,
        opacity,
        transform !important;
}