/* ============================================================ AUTOMART V44.3 CANONICAL NEW / USED DESKTOP MEGA MENU Exact owner: .am-mega-v3962[data-am-v443-panel] Preserves native V39 structure: outer panel -> .am-mega-v3962__layout -> rail -> discover -> body styles -> brands -> CTA ============================================================ */ /* ============================================================ RETIRE ANY OLD INDEPENDENT NEW-CARS PANEL ============================================================ */ @media screen and (min-width:1024px) { .am-v44-new-mega, [data-am-v441-new-mega], [data-am-v442-panel] { display:none !important; visibility:hidden !important; opacity:0 !important; pointer-events:none !important; } /* ======================================================== EXACT OUTER PANEL ONLY ======================================================== */ [data-am-v443-panel] { position:fixed !important; left:50% !important; top: var( --am-v443-top, 202px ) !important; width: min( 1080px, calc(100vw - 64px) ) !important; max-width: calc(100vw - 64px) !important; height:auto !important; min-height:0 !important; max-height: calc( 100vh - var( --am-v443-top, 202px ) - 16px ) !important; margin:0 !important; padding:0 !important; background:#ffffff !important; border: 1px solid #dfe7e3 !important; border-radius: 0 0 20px 20px !important; box-shadow: 0 26px 58px rgba(12,31,23,.16) !important; overflow-x:hidden !important; overflow-y:auto !important; isolation:isolate !important; z-index:2147482000 !important; display:none !important; visibility:hidden !important; opacity:0 !important; pointer-events:none !important; transform: translateX(-50%) translateY(-6px) scale(.997) !important; transform-origin: top center !important; transition: opacity .14s ease, transform .17s ease, visibility .17s ease !important; } body.am-v443-open [data-am-v443-panel] { display:block !important; visibility:visible !important; opacity:1 !important; pointer-events:auto !important; transform: translateX(-50%) translateY(0) scale(1) !important; } [data-am-v443-panel]::before { content:""; position:absolute; inset:0; z-index:-1; background:#ffffff; } /* ======================================================== CRITICAL GRID RESTORATION THIS is what V44.2 broke. Do not apply display:block to the inner __layout. Restore its real two-zone desktop structure. ======================================================== */ [data-am-v443-panel] > .am-mega-v3962__layout { display:grid !important; grid-template-columns: 255px minmax(0,1fr) !important; align-items:stretch !important; width:100% !important; height:auto !important; min-height:0 !important; margin:0 !important; padding:0 !important; } [data-am-v443-panel] .am-mega-v3962__rail { grid-column:1 !important; grid-row:1 !important; width:auto !important; min-width:0 !important; } [data-am-v443-panel] .am-mega-v3962__discover { grid-column:2 !important; grid-row:1 !important; display:grid !important; grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; align-content:start !important; min-width:0 !important; width:auto !important; } /* * BODY STYLE = left discovery column */ [data-am-v443-panel] .am-mega-v3962__discover > .am-mega-v3962__group:not(.am-mega-v3962__brands) { grid-column:1 !important; min-width:0 !important; } /* * BRANDS = right discovery column */ [data-am-v443-panel] .am-mega-v3962__brands { grid-column:2 !important; min-width:0 !important; } /* * CTA spans both discovery columns. */ [data-am-v443-panel] .am-mega-v3962__sell { grid-column: 1 / -1 !important; width:auto !important; } /* ======================================================== PRESERVE COMPACT BODY / BRAND GRIDS ======================================================== */ [data-am-v443-panel] .am-mega-v3962__body-grid { display:grid !important; grid-template-columns: repeat( 4, minmax(0,1fr) ) !important; } [data-am-v443-panel] .am-mega-v3962__brand-grid { display:grid !important; grid-template-columns: repeat( 4, minmax(0,1fr) ) !important; } /* ======================================================== TRIGGERS ======================================================== */ [data-am-v443-trigger] { position:relative !important; } body.am-v443-mode-new [data-am-v443-trigger="new"], body.am-v443-mode-used [data-am-v443-trigger="used"] { background:#edf8f2 !important; color:#087c4b !important; } body.am-v443-mode-new [data-am-v443-trigger="new"] svg, body.am-v443-mode-used [data-am-v443-trigger="used"] svg { transform: rotate(180deg) !important; } body.am-v443-mode-new [data-am-v443-trigger="used"], body.am-v443-mode-used [data-am-v443-trigger="new"] { background:transparent !important; color:#172334 !important; } body.am-v443-mode-new [data-am-v443-trigger="used"] svg, body.am-v443-mode-used [data-am-v443-trigger="new"] svg { transform: rotate(0deg) !important; } /* ======================================================== SEARCH BAR STAYS BELOW MEGA ======================================================== */ body.am-v443-open .am-global-search-v18, body.am-v443-open .am-header-search-stack, body.am-v443-open [data-am-global-search] { z-index:1200 !important; } } /* ============================================================ SMALL DESKTOP / TABLET-LANDSCAPE ============================================================ */ @media screen and (min-width:1024px) and (max-width:1180px) { [data-am-v443-panel] > .am-mega-v3962__layout { grid-template-columns: 225px minmax(0,1fr) !important; } [data-am-v443-panel] .am-mega-v3962__body-grid, [data-am-v443-panel] .am-mega-v3962__brand-grid { grid-template-columns: repeat( 4, minmax(0,1fr) ) !important; } } /* ============================================================ MOBILE V44.0 remains responsible for mobile New / Used navigation. V44.3 does not touch mobile. ============================================================ */ @media screen and (max-width:1023px) { [data-am-v443-panel] { display:none !important; } }