/* ============================================================
   AUTOMART V46.2
   VEHICLE DETAIL — POST-GALLERY MARKET STRIP

   Gallery
   Thumbnails
   ↓
   Price / Negotiable / Posted / Views
   ↓
   Year / Mileage / Specs
   ============================================================ */


/* ============================================================
   REMOVE OLD DUPLICATED PRICE / ACTIVITY PRESENTATION
   ONLY INSIDE VEHICLE SUMMARY
   ============================================================ */

.vehicle-detail-page
.vehicle-summary
.price-line,

.vehicle-detail-page
.vehicle-summary
.summary-meta {

    display:none !important;
}


/*
 * Previous desktop-layout patches may have converted these
 * legacy blocks into post-gallery price/meta columns.
 * Suppress them if they exist.
 */

.vehicle-detail-page
.am-v436-price-block,

.vehicle-detail-page
.am-v436-gallery-price,

.vehicle-detail-page
.am-v436-post-gallery-price,

.vehicle-detail-page
.am-v436-price-stack,

.vehicle-detail-page
.am-v437-price-block,

.vehicle-detail-page
.am-v438-price-block {

    display:none !important;
}


/* ============================================================
   MAIN STRIP
   ============================================================ */

.am-v462-market-strip {

    position:relative;

    width:100%;

    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        auto;

    align-items:center;

    gap:20px;

    margin-top:12px;

    padding:
        14px 16px;

    border:
        1px solid
        #dfe8e3;

    border-radius:
        15px;

    background:
        linear-gradient(
            120deg,
            #ffffff 0%,
            #fbfdfc 58%,
            #f3faf6 100%
        );

    box-shadow:
        0 8px 24px
        rgba(17,43,29,.055);

    overflow:hidden;

    isolation:isolate;
}


/*
 * Restrained premium accent.
 */

.am-v462-market-strip::before {

    content:"";

    position:absolute;

    left:0;
    top:0;
    bottom:0;

    width:4px;

    background:
        linear-gradient(
            180deg,
            #19b971,
            #07854f
        );
}


/*
 * Very subtle ambient green glow.
 */

.am-v462-market-strip::after {

    content:"";

    position:absolute;

    right:-48px;
    top:-70px;

    width:170px;
    height:170px;

    border-radius:50%;

    background:
        rgba(15,167,98,.045);

    pointer-events:none;

    z-index:-1;
}


/* ============================================================
   PRICE
   ============================================================ */

.am-v462-market-strip__price {

    min-width:0;

    display:grid;

    gap:4px;
}


.am-v462-market-strip__label {

    color:#7a8798;

    font-size:10px;

    line-height:1.2;

    font-weight:700;

    letter-spacing:.02em;
}


.am-v462-market-strip__price-line {

    min-width:0;

    display:flex;

    align-items:center;

    flex-wrap:wrap;

    gap:
        8px 10px;
}


.am-v462-market-strip__price-line
> strong {

    color:#078d54;

    font-family:inherit;

    font-size:
        clamp(
            20px,
            1.8vw,
            27px
        );

    line-height:1;

    font-weight:900;

    letter-spacing:-.035em;

    white-space:nowrap;
}


/* ============================================================
   NEGOTIABLE
   ============================================================ */

.am-v462-market-strip__negotiable {

    min-height:25px;

    display:inline-flex;

    align-items:center;

    justify-content:center;

    gap:5px;

    padding:
        5px 8px;

    border:
        1px solid
        #cce9da;

    border-radius:999px;

    background:#eaf8f1;

    color:#087a4a;

    font-size:10px;

    line-height:1;

    font-weight:800;

    white-space:nowrap;
}


.am-v462-market-strip__negotiable
svg {

    width:13px;
    height:13px;

    flex:0 0 13px;
}


/* ============================================================
   ACTIVITY
   ============================================================ */

.am-v462-market-strip__activity {

    position:relative;

    z-index:1;

    display:flex;

    align-items:center;

    justify-content:flex-end;

    gap:14px;
}


.am-v462-market-strip__activity-item {

    min-width:0;

    display:flex;

    align-items:center;

    gap:8px;
}


.am-v462-market-strip__icon {

    width:34px;
    height:34px;

    flex:0 0 34px;

    display:grid;

    place-items:center;

    border:
        1px solid
        #dce9e2;

    border-radius:10px;

    background:#fff;

    color:#07834e;

    box-shadow:
        0 3px 10px
        rgba(17,42,29,.035);
}


.am-v462-market-strip__icon
svg {

    width:17px;
    height:17px;
}


.am-v462-market-strip__activity-copy {

    min-width:0;

    display:grid;

    gap:2px;
}


.am-v462-market-strip__activity-copy
small {

    color:#8a96a6;

    font-size:9px;

    line-height:1.1;

    font-weight:650;
}


.am-v462-market-strip__activity-copy
strong {

    color:#334155;

    font-size:11px;

    line-height:1.15;

    font-weight:800;

    white-space:nowrap;
}


.am-v462-market-strip__divider {

    width:1px;
    height:30px;

    flex:0 0 1px;

    background:#e4ebe7;
}


/* ============================================================
   GALLERY RELATIONSHIP

   Keep strip directly attached to gallery visual family.
   ============================================================ */

.vehicle-detail-page
.gallery-column
.thumb-row
+ .am-v462-market-strip {

    margin-bottom:14px;
}


/* ============================================================
   DESKTOP
   ============================================================ */

@media screen and (min-width:1051px) {

    .vehicle-detail-page
    .gallery-column
    .am-v462-market-strip {

        min-height:72px;
    }


    /*
     * Prevent the strip from expanding beyond gallery width.
     */

    .vehicle-detail-page
    .gallery-column
    .am-v462-market-strip {

        max-width:100%;
    }

}


/* ============================================================
   TABLET
   ============================================================ */

@media screen
and (min-width:768px)
and (max-width:1050px) {

    .am-v462-market-strip {

        gap:14px;

        padding:
            13px 14px;
    }


    .am-v462-market-strip__activity {

        gap:10px;
    }


    .am-v462-market-strip__icon {

        width:32px;
        height:32px;

        flex-basis:32px;
    }

}


/* ============================================================
   MOBILE
   ============================================================ */

@media screen and (max-width:767px) {

    .am-v462-market-strip {

        grid-template-columns:
            minmax(0,1fr);

        gap:11px;

        margin-top:10px;

        padding:
            12px 13px;

        border-radius:
            14px;

        box-shadow:
            0 6px 18px
            rgba(17,43,29,.045);
    }


    /*
     * PRICE + NEGOTIABLE stay together.
     */

    .am-v462-market-strip__price-line {

        justify-content:
            space-between;

        flex-wrap:
            nowrap;

        gap:
            8px;
    }


    .am-v462-market-strip__price-line
    > strong {

        font-size:
            22px;
    }


    /*
     * POSTED + VIEWS become balanced lower row.
     */

    .am-v462-market-strip__activity {

        display:grid;

        grid-template-columns:
            minmax(0,1fr)
            minmax(0,1fr);

        gap:8px;

        padding-top:10px;

        border-top:
            1px solid
            #e8eeeb;
    }


    .am-v462-market-strip__activity-item {

        min-height:41px;

        padding:
            5px 7px;

        border:
            1px solid
            #e5ece8;

        border-radius:10px;

        background:
            rgba(255,255,255,.82);
    }


    .am-v462-market-strip__divider {

        display:none;
    }


    .am-v462-market-strip__icon {

        width:29px;
        height:29px;

        flex-basis:29px;

        border:0;

        background:#eaf8f1;

        box-shadow:none;
    }


    .am-v462-market-strip__icon
    svg {

        width:15px;
        height:15px;
    }


    .am-v462-market-strip__activity-copy
    strong {

        font-size:10px;
    }

}


/* ============================================================
   VERY SMALL PHONE
   ============================================================ */

@media screen and (max-width:390px) {

    .am-v462-market-strip {

        padding:
            11px;
    }


    .am-v462-market-strip__price-line
    > strong {

        font-size:
            20px;
    }


    .am-v462-market-strip__negotiable {

        padding:
            5px 7px;

        font-size:
            9px;
    }

}