/* ============================================================ AUTOMART VEHICLE DETAIL MOBILE V42.7 DOM ORDER + PREMIUM TABS + PREMIUM ACCORDION ============================================================ */ @media (max-width:767px) { /* ===================================================== FINAL WIDTH SAFETY ===================================================== */ body.am-v426-detail-page, body.am-v427-detail-page { width:100%; max-width:100%; overflow-x:clip; } /* ===================================================== DUPLICATE CONTACT CLEANUP ===================================================== */ .am-v427-duplicate-action, .am-v427-duplicate-wrapper { display:none !important; } /* ===================================================== OLD SECTION HEADINGS THAT HAVE BEEN SUPERSEDED ===================================================== */ .am-v427-old-section-heading { display:none !important; } /* ===================================================== SECTION HEADINGS ===================================================== */ .vehicle-detail-page .am-v426-section-head { display:flex !important; align-items:center; justify-content:space-between; gap:10px; width:100% !important; margin: 21px 0 9px !important; padding: 0 1px; } .vehicle-detail-page .am-v426-section-head h3 { margin:0 !important; color:#101d2f; font-size:17px !important; line-height:1.15 !important; font-weight:800 !important; } .vehicle-detail-page .am-v426-section-head button { min-height:28px; display:inline-flex; align-items:center; justify-content:center; padding: 0 10px; border: 1px solid #d8eee2; border-radius: 999px; background: #edf9f3; color: #087b49; font:inherit; font-size:12px !important; line-height:1; font-weight:750; box-shadow: 0 3px 10px rgba(7,132,77,.05); } .vehicle-detail-page .am-v426-section-head button::after { content:"›"; margin-left:5px; font-size:15px; line-height:1; } /* ===================================================== KEY INFORMATION Supports BOTH: - new .key-info authority - old V20 .vd-key-grid-v20 wrapper ===================================================== */ .vehicle-detail-page .key-info, .vehicle-detail-page .vd-key-grid-v20 { display:grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap:7px !important; width:100% !important; max-width:100% !important; margin:0 !important; } .vehicle-detail-page .vd-key-grid-v20 > * { min-width:0 !important; } /* ===================================================== FEATURES Supports BOTH: - new .feature-list - old V20 .vd-features-grid-v20 ===================================================== */ .vehicle-detail-page .feature-list, .vehicle-detail-page .vd-features-grid-v20 { display:grid !important; grid-template-columns: repeat(2,minmax(0,1fr)) !important; gap:7px !important; width:100% !important; max-width:100% !important; margin:0 !important; } .vehicle-detail-page .vd-features-grid-v20 > * { min-width:0 !important; } /* ===================================================== PREMIUM DETAIL TAB RAIL Overview / Specifications / Features / History / Reviews ===================================================== */ .vehicle-detail-page .detail-tabs { width:100% !important; max-width:100% !important; min-height:48px !important; display:flex !important; align-items:center; gap:3px !important; margin: 12px 0 16px !important; padding: 4px !important; overflow-x:auto !important; overflow-y:hidden !important; border: 1px solid #dfe7e3 !important; border-radius: 12px !important; background: #f6f9f7 !important; box-shadow: inset 0 1px 2px rgba(20,39,29,.025); 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: 38px !important; display:flex !important; align-items:center !important; justify-content:center !important; padding: 0 11px !important; border: 1px solid transparent !important; border-radius: 9px !important; color: #667487 !important; background: transparent !important; font-size: 12px !important; line-height: 1 !important; font-weight: 700 !important; transition: background .18s ease, box-shadow .18s ease, color .18s ease, border-color .18s ease; } .vehicle-detail-page .detail-tabs > *.is-active { color: #087b49 !important; border-color: #d5e9de !important; background: #fff !important; box-shadow: 0 3px 10px rgba(15,39,25,.07) !important; } /* ===================================================== PREMIUM MOBILE FOOTER ===================================================== */ body.am-v426-detail-page footer.footer, body.am-v427-detail-page footer.footer { padding-top: 22px !important; } body.am-v426-detail-page footer.footer .footer-grid, body.am-v427-detail-page footer.footer .footer-grid { gap: 8px !important; } body.am-v426-detail-page footer.footer .footer-grid > div:not(.footer-intro), body.am-v427-detail-page footer.footer .footer-grid > div:not(.footer-intro) { margin: 0 !important; padding: 0 !important; overflow: hidden; border: 1px solid rgba(255,255,255,.085) !important; border-radius: 11px !important; background: rgba(255,255,255,.035) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); } body.am-v426-detail-page footer.footer .footer-grid > div:not(.footer-intro) h4, body.am-v427-detail-page footer.footer .footer-grid > div:not(.footer-intro) h4 { min-height: 46px !important; display:flex !important; align-items:center; justify-content:space-between; gap:10px; margin: 0 !important; padding: 0 11px !important; color: #f4f8f6 !important; font-size: 12px !important; line-height: 1 !important; font-weight: 750 !important; letter-spacing: .01em; } body.am-v426-detail-page footer.footer .footer-grid > div:not(.footer-intro) h4::after, body.am-v427-detail-page footer.footer .footer-grid > div:not(.footer-intro) h4::after { content: "⌄" !important; width: 27px; height: 27px; display:inline-flex; align-items:center; justify-content:center; border: 1px solid rgba(255,255,255,.09); border-radius: 50%; background: rgba(255,255,255,.055); color: #b8c8c0; font-size: 14px; line-height: 1; transition: transform .18s ease, background .18s ease; } body.am-v426-detail-page footer.footer .footer-grid > div.am-v426-footer-open h4::after, body.am-v427-detail-page footer.footer .footer-grid > div.am-v426-footer-open h4::after { transform: rotate(180deg); background: rgba(13,164,94,.16); color: #83deb3; } body.am-v426-detail-page footer.footer .footer-grid > div:not(.footer-intro) a, body.am-v427-detail-page footer.footer .footer-grid > div:not(.footer-intro) a { margin: 0 10px !important; padding: 8px 2px !important; border-top: 1px solid rgba(255,255,255,.065); color: #aebdb5 !important; font-size: 12px !important; line-height: 1.35 !important; } body.am-v426-detail-page footer.footer .footer-grid > div.am-v426-footer-open, body.am-v427-detail-page footer.footer .footer-grid > div.am-v426-footer-open { padding-bottom: 7px !important; border-color: rgba(32,179,110,.20) !important; background: linear-gradient( 180deg, rgba(15,87,58,.28), rgba(255,255,255,.025) ) !important; } /* ===================================================== FOOTER BRAND BLOCK ===================================================== */ body.am-v426-detail-page footer.footer .footer-intro, body.am-v427-detail-page footer.footer .footer-intro { padding: 0 3px 15px !important; } body.am-v426-detail-page footer.footer .footer-bottom, body.am-v427-detail-page footer.footer .footer-bottom { margin-top: 16px !important; padding-top: 14px !important; border-top: 1px solid rgba(255,255,255,.08); } /* ===================================================== PRESERVE V42.6 STICKY SELLER BAR ===================================================== */ .am-v426-sticky-contact { z-index: 2147482000 !important; border-top: 1px solid #d8e4dd !important; box-shadow: 0 -8px 26px rgba(8,30,18,.11) !important; } } /* ========================================================= SMALL MOBILE ========================================================= */ @media (max-width:380px) { .vehicle-detail-page .detail-tabs > * { padding: 0 9px !important; } }