/*
============================================================
AUTOMART VEHICLE DETAIL MOBILE V42.6
CLEAN AUTHORITY
============================================================
*/

@media (max-width: 767px) {

    html,
    body {
        max-width: 100%;
        overflow-x: clip;
    }

    .vehicle-detail-page,
    .vehicle-detail-page *,
    .vehicle-detail-page *::before,
    .vehicle-detail-page *::after {
        box-sizing: border-box;
    }


    /* -----------------------------------------------------
       REMOVE LEGACY MOBILE-INJECTED SUMMARY ELEMENTS
       ----------------------------------------------------- */

    .vehicle-detail-page .v21-subline,
    .vehicle-detail-page .v21-verified-banner,
    .vehicle-detail-page .am-v42-status-row,
    .vehicle-detail-page .am-v423-summary-top,
    .vehicle-detail-page .am-v423-summary-description,
    .vehicle-detail-page .am-v42-quick-facts {
        display: none !important;
    }


    /* -----------------------------------------------------
       SUMMARY
       ----------------------------------------------------- */

    .vehicle-detail-page .vehicle-summary {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        padding: 14px !important;

        border: 1px solid #dfe7e3 !important;
        border-radius: 14px !important;

        background: #fff !important;

        box-shadow:
            0 5px 18px rgba(17, 38, 27, .045)
            !important;
    }

    .vehicle-detail-page .am-v426-summary-top {
        display: flex;
        align-items: center;
        justify-content: space-between;

        gap: 8px;

        margin-bottom: 9px;
    }

    .vehicle-detail-page .am-v426-condition {
        min-height: 25px;

        display: inline-flex;
        align-items: center;

        padding: 0 8px;

        border: 1px solid #cfe9dc;
        border-radius: 7px;

        background: #eaf8f1;

        color: #087b49;

        font-size: 12px;
        line-height: 1;
        font-weight: 750;
    }

    .vehicle-detail-page .am-v426-listing-id {
        color: #8390a2;

        font-size: 12px;
        line-height: 1;
        font-weight: 600;

        white-space: nowrap;
    }

    .vehicle-detail-page .title-actions {
        align-items: flex-start !important;
        gap: 8px !important;
    }

    .vehicle-detail-page .title-actions h1 {
        margin: 0 0 6px !important;

        font-size: 22px !important;
        line-height: 1.1 !important;
        letter-spacing: -.025em !important;
        font-weight: 800 !important;
    }

    .vehicle-detail-page .price-line {
        margin: 0 !important;

        align-items: center !important;
        gap: 7px !important;
    }

    .vehicle-detail-page .price-line strong {
        font-size: 24px !important;
        line-height: 1 !important;
        font-weight: 850 !important;
    }

    .vehicle-detail-page .price-line span {
        min-height: 25px !important;

        display: inline-flex !important;
        align-items: center !important;

        padding: 0 8px !important;

        border-radius: 7px !important;

        font-size: 12px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
    }


    /* -----------------------------------------------------
       REAL SUMMARY DESCRIPTION
       ----------------------------------------------------- */

    .vehicle-detail-page .am-v426-summary-description {
        display: -webkit-box;

        max-height: 2.9em;

        margin: 8px 0 0;

        overflow: hidden;

        color: #657287;

        font-size: 12px;
        line-height: 1.45;

        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }


    /* -----------------------------------------------------
       4 QUICK FACTS
       ----------------------------------------------------- */

    .vehicle-detail-page .am-v426-quick-facts {
        display: grid;

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

        gap: 6px;

        width: 100%;

        margin-top: 11px;
    }

    .vehicle-detail-page .am-v426-quick-facts > div {
        min-width: 0;
        min-height: 57px;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        gap: 3px;

        padding: 6px 3px;

        border: 1px solid #dfe7e3;
        border-radius: 9px;

        background: #fbfdfc;

        text-align: center;
    }

    .vehicle-detail-page .am-v426-quick-facts small {
        color: #758297;

        font-size: 12px;
        line-height: 1.05;
        font-weight: 550;
    }

    .vehicle-detail-page .am-v426-quick-facts strong {
        max-width: 100%;

        overflow: hidden;

        color: #172236;

        font-size: 12px;
        line-height: 1.15;
        font-weight: 800;

        text-overflow: ellipsis;
        white-space: nowrap;
    }


    /* -----------------------------------------------------
       LOCATION / META
       ----------------------------------------------------- */

    .vehicle-detail-page .summary-location {
        margin: 12px 0 0 !important;

        font-size: 12px !important;
    }

    .vehicle-detail-page .summary-meta {
        margin-top: 8px !important;

        gap: 12px !important;

        font-size: 12px !important;
    }


    /* -----------------------------------------------------
       AUTHORITATIVE SUMMARY CONTACT ROW
       EXACTLY THREE COLUMNS
       ----------------------------------------------------- */

    .vehicle-detail-page .vehicle-summary > .contact-row {
        display: grid !important;

        grid-template-columns:
            repeat(3, minmax(0, 1fr))
            !important;

        gap: 7px !important;

        width: 100% !important;
        max-width: 100% !important;

        margin: 12px 0 0 !important;

        padding: 0 !important;
    }

    .vehicle-detail-page
    .vehicle-summary
    > .contact-row
    > a {
        width: 100% !important;
        min-width: 0 !important;
        max-width: 100% !important;

        min-height: 43px !important;

        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        margin: 0 !important;
        padding: 0 5px !important;

        border-radius: 9px !important;

        font-size: 12px !important;
        line-height: 1 !important;
        font-weight: 750 !important;

        white-space: nowrap !important;
    }


    /* -----------------------------------------------------
       DEALER CARD
       ----------------------------------------------------- */

    .vehicle-detail-page .seller-profile-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;

        grid-template-columns:
            52px minmax(0, 1fr) auto
            !important;

        gap: 11px !important;

        margin-top: 10px !important;

        padding: 11px !important;

        border: 1px solid #dfe7e3 !important;
        border-radius: 13px !important;

        background: #fff !important;
    }

    .vehicle-detail-page .dealer-logo {
        width: 52px !important;
        height: 52px !important;
        min-width: 52px !important;
    }

    .vehicle-detail-page .seller-profile-card b {
        font-size: 13px !important;
        font-weight: 800 !important;
    }

    .vehicle-detail-page .seller-profile-card small,
    .vehicle-detail-page .seller-profile-card em {
        font-size: 12px !important;
        line-height: 1.35 !important;
    }

    .vehicle-detail-page .seller-profile-card::after {
        content: "View Dealer  ›";

        min-height: 36px;

        display: inline-flex;
        align-items: center;
        justify-content: center;

        padding: 0 9px;

        border: 1px solid #dce5e0;
        border-radius: 9px;

        color: #26364a;

        background: #fff;

        font-size: 12px;
        line-height: 1;
        font-weight: 700;

        white-space: nowrap;
    }


    /* -----------------------------------------------------
       TABS
       ----------------------------------------------------- */

    .vehicle-detail-page .detail-tabs {
        width: 100% !important;
        max-width: 100% !important;

        min-height: 46px !important;

        display: flex !important;

        margin: 11px 0 14px !important;

        padding: 0 30px 0 0 !important;

        overflow-x: auto !important;
        overflow-y: hidden !important;

        border-bottom:
            1px solid #e0e7e3 !important;

        scrollbar-width: none;
    }

    .vehicle-detail-page
    .detail-tabs::-webkit-scrollbar {
        display: none;
    }

    .vehicle-detail-page .detail-tabs > * {
        flex: 0 0 auto !important;

        min-width: max-content !important;
        min-height: 46px !important;

        display: flex !important;
        align-items: center !important;

        padding: 0 10px !important;

        color: #697689 !important;

        border-bottom:
            2px solid transparent !important;

        font-size: 12px !important;
        line-height: 1 !important;
        font-weight: 700 !important;
    }

    .vehicle-detail-page
    .detail-tabs > *.is-active {
        color: #07834d !important;

        border-bottom-color:
            #08a55f !important;

        font-weight: 800 !important;
    }


    /* -----------------------------------------------------
       DESCRIPTION
       ----------------------------------------------------- */

    .vehicle-detail-page .detail-copy h2 {
        margin: 0 0 7px !important;

        font-size: 18px !important;
        line-height: 1.16 !important;
        font-weight: 800 !important;
    }

    .vehicle-detail-page
    .am-v426-description-copy {
        display: -webkit-box;

        max-height: 6.32em;

        margin: 0 !important;

        overflow: hidden;

        color: #576679;

        font-size: 13px !important;
        line-height: 1.58 !important;

        -webkit-box-orient: vertical;
        -webkit-line-clamp: 4;
    }

    .vehicle-detail-page.am-v426-description-open
    .am-v426-description-copy {
        display: block;

        max-height: none;

        overflow: visible;

        -webkit-line-clamp: unset;
    }

    .vehicle-detail-page
    .am-v42-read-more,

    .vehicle-detail-page
    .am-v425-read-more {
        display: none !important;
    }

    .vehicle-detail-page
    .am-v426-read-more {
        min-height: 36px;

        display: flex;

        align-items: center;
        justify-content: center;

        gap: 5px;

        width: max-content;

        margin: 10px auto 0;

        padding: 0 15px;

        border: 1px solid #dce5e0;
        border-radius: 9px;

        background: #fff;

        color: #304156;

        font: inherit;

        font-size: 12px;
        line-height: 1;
        font-weight: 700;

        cursor: pointer;
    }


    /* -----------------------------------------------------
       SECTION HEAD
       ----------------------------------------------------- */

    .vehicle-detail-page
    .am-v426-section-head {
        display: flex;

        align-items: center;
        justify-content: space-between;

        gap: 10px;

        width: 100%;

        margin: 20px 0 9px;
    }

    .vehicle-detail-page
    .am-v426-section-head h3 {
        margin: 0 !important;

        color: #132033;

        font-size: 17px !important;
        line-height: 1.15 !important;
        font-weight: 800 !important;
    }

    .vehicle-detail-page
    .am-v426-section-head button {
        min-height: 27px;

        display: inline-flex;

        align-items: center;
        justify-content: center;

        padding: 0 9px;

        border: 0;
        border-radius: 8px;

        background: #eaf8f1;

        color: #07834d;

        font: inherit;

        font-size: 12px;
        line-height: 1;
        font-weight: 700;
    }


    /* -----------------------------------------------------
       KEY INFO
       ----------------------------------------------------- */

    .vehicle-detail-page .key-info {
        display: grid !important;

        grid-template-columns:
            repeat(2, minmax(0, 1fr))
            !important;

        gap: 7px !important;

        width: 100% !important;
        max-width: 100% !important;
    }

    .vehicle-detail-page
    .key-info > div {
        min-width: 0 !important;
        min-height: 59px !important;

        border-radius: 10px !important;
    }


    /* -----------------------------------------------------
       FEATURES
       ----------------------------------------------------- */

    .vehicle-detail-page .feature-list {
        display: flex !important;

        flex-wrap: wrap !important;

        gap: 7px !important;

        width: 100% !important;
    }

    .vehicle-detail-page
    .feature-list > span {
        flex:
            1 1 calc(50% - 4px)
            !important;

        width:
            calc(50% - 4px)
            !important;

        min-width:
            calc(50% - 4px)
            !important;

        max-width:
            calc(50% - 4px)
            !important;

        min-height:
            44px !important;

        padding:
            7px 10px !important;

        border-radius:
            22px !important;

        overflow: hidden;

        font-size:
            12px !important;

        text-overflow: ellipsis;
        white-space: nowrap;
    }


    /* -----------------------------------------------------
       FINANCE -> SIMILAR SPACING
       ----------------------------------------------------- */

    .vehicle-detail-page .finance-box {
        margin-bottom:
            0 !important;
    }

    .am-similar-v26 {
        margin:
            0 !important;

        padding:
            18px 0 20px !important;
    }


    /* -----------------------------------------------------
       SIMILAR VEHICLES
       ----------------------------------------------------- */

    .am-similar-v26__inner {
        width:
            calc(100% - 12px)
            !important;

        max-width:
            calc(100% - 12px)
            !important;

        margin:
            0 auto !important;
    }

    .am-similar-v26__grid {
        display: flex !important;

        gap: 8px !important;

        width: 100% !important;

        overflow-x: auto !important;

        padding:
            0 0 8px !important;
    }

    .am-similar-v26__grid
    .premium-auto-card {
        flex:
            0 0 calc(50% - 4px)
            !important;

        width:
            calc(50% - 4px)
            !important;

        min-width:
            calc(50% - 4px)
            !important;

        max-width:
            calc(50% - 4px)
            !important;

        border-radius:
            12px !important;

        overflow:
            hidden !important;
    }

    .am-similar-v26__grid
    .premium-auto-media,

    .am-similar-v26__grid
    .premium-auto-media img {
        height:
            128px !important;

        min-height:
            128px !important;

        max-height:
            128px !important;

        object-fit:
            cover !important;
    }

    .am-similar-v26__grid
    .premium-auto-body {
        padding:
            9px !important;
    }

    .am-similar-v26__grid
    .premium-title-copy h3 {
        font-size:
            13px !important;

        line-height:
            1.2 !important;
    }

    .am-similar-v26__grid
    .premium-price {
        margin-top:
            6px !important;

        font-size:
            17px !important;

        line-height:
            1.05 !important;
    }


    /* -----------------------------------------------------
       RETIRE EVERY OLD V42 STICKY BAR
       V42.6 CREATES ONE CLEAN AUTHORITY.
       ----------------------------------------------------- */

    .am-v421-sticky-cta,
    .am-v422-sticky-cta {
        display:
            none !important;
    }


    /* -----------------------------------------------------
       V42.6 STICKY CONTACT
       ----------------------------------------------------- */

    .am-v426-sticky-contact {
        position:
            fixed;

        left:
            0;

        right:
            0;

        bottom:
            calc(
                var(--am-v426-bottom-nav-height, 62px)
                + env(safe-area-inset-bottom)
            );

        z-index:
            2147482000;

        display:
            grid;

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

        gap:
            7px;

        width:
            100%;

        min-height:
            56px;

        padding:
            6px 9px;

        border-top:
            1px solid #dce5e0;

        background:
            rgba(255,255,255,.98);

        box-shadow:
            0 -7px 22px
            rgba(13,33,21,.10);

        backdrop-filter:
            blur(14px);

        -webkit-backdrop-filter:
            blur(14px);
    }

    .am-v426-sticky-contact a {
        min-width:
            0;

        min-height:
            44px;

        display:
            flex;

        align-items:
            center;
        justify-content:
            center;

        padding:
            0 5px;

        border:
            1px solid #078f54;

        border-radius:
            9px;

        background:
            #fff;

        color:
            #087b49;

        text-decoration:
            none;

        font-size:
            12px;

        line-height:
            1;

        font-weight:
            800;

        white-space:
            nowrap;
    }

    .am-v426-sticky-contact
    .am-v426-whatsapp {
        background:
            linear-gradient(
                145deg,
                #10ad65,
                #078b51
            );

        color:
            #fff;
    }


    /* -----------------------------------------------------
       MOBILE FOOTER
       ----------------------------------------------------- */

    body.am-v426-detail-page
    footer.footer {
        display:
            block !important;

        width:
            100% !important;

        margin:
            8px 0 0 !important;

        padding:
            20px 0
            calc(
                var(--am-v426-bottom-nav-height, 62px)
                + 82px
                + env(safe-area-inset-bottom)
            )
            !important;
    }

    body.am-v426-detail-page
    footer.footer > .container {
        width:
            calc(100% - 18px)
            !important;

        max-width:
            calc(100% - 18px)
            !important;

        margin:
            0 auto !important;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid {
        display:
            grid !important;

        grid-template-columns:
            1fr !important;

        gap:
            0 !important;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-intro {
        padding-bottom:
            13px !important;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div:not(.footer-intro) {
        padding:
            0 !important;

        border-top:
            1px solid
            rgba(255,255,255,.10);
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div:not(.footer-intro)
    h4 {
        min-height:
            39px !important;

        display:
            flex !important;

        align-items:
            center;

        justify-content:
            space-between;

        margin:
            0 !important;

        padding:
            0 3px !important;

        font-size:
            12px !important;

        cursor:
            pointer;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div:not(.footer-intro)
    h4::after {
        content:
            "+";

        font-size:
            18px;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div.am-v426-footer-open
    h4::after {
        content:
            "−";
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div:not(.footer-intro)
    a {
        display:
            none !important;

        padding:
            5px 3px !important;

        font-size:
            12px !important;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-grid
    > div.am-v426-footer-open
    a {
        display:
            block !important;
    }

    body.am-v426-detail-page
    footer.footer
    .footer-bottom {
        margin-top:
            13px !important;

        padding-top:
            12px !important;

        font-size:
            12px !important;
    }

}


/* ---------------------------------------------------------
   VERY SMALL MOBILE
   --------------------------------------------------------- */

@media (max-width: 380px) {

    .vehicle-detail-page
    .am-v426-quick-facts > div {
        padding-left:
            2px;

        padding-right:
            2px;
    }

    .vehicle-detail-page
    .seller-profile-card::after {
        padding:
            0 6px !important;
    }

}