/* saa-strip-fix */
/* SAA 2026-11-02: category tile strip (Sub Categories module, "mobile horizontal scroll"). Platform sets overflow-x:scroll, which shows a permanent scrollbar on desktop browsers. Keep swipe/drag scrolling, hide the bar. */
html body .module-sub-categories.mob-horiz-scroll{overflow-x:auto!important;scrollbar-width:none!important;-ms-overflow-style:none}
html body .module-sub-categories.mob-horiz-scroll::-webkit-scrollbar{display:none!important;height:0!important}

/* saa-pdp-enquiry-fix */
/* SAA 2026-11-02: product page enquiry button. Live default Product page code block (grid_13696) still wraps the button in an old cart wrapper; the PDP script moves the button and leaves an empty 28px wrapper, and the button keeps an inline 10px top margin. Sandbox has neither. */
html body #grid_13696 .module-product-details__cartButton:not(:has(button,a,select,input:not([type=hidden]))){display:none!important}
html body .product-shop .contact-button{margin-top:0!important}

/* saa-pdp-title-fix */
/* SAA 2026-11-02: product title block (grid_249). Platform gives .product-shop overflow:auto; the brand logo box is 2px taller than the block at tablet/small-desktop widths, so a scrollbar appears beside the logo. Contain floats without scrolling. */
html body #grid_249,html body #grid_249 > .product-shop.module-product-details{overflow:visible!important;display:flow-root}
/* Same platform overflow:auto on the image column: the main image box is 2px wider than its column (778/776), so Windows shows a full-width
   scrollbar under the thumbnails (the thumb strip has its own arrows). */
html body .grid-column-wrapper:has(> .module-product-image),html body .module-product-image.product-img-column{overflow:visible!important;display:flow-root}

/* saa-pdp-tabs-gap */
/* SAA 2026-11-02: when the product page stacks (below 960px), the tabs (Description/Fitment/Media) sat ~60px below the "Supplier design and components" block (28px container + 24px tabs margin + 8px). Tighten to ~24px. Desktop side-by-side layout unchanged. */
@media (max-width:959px){html body #grid-container-157.prod-tabs{margin-top:16px!important}html body #grid-container-157 .box-additional.box-tabs{margin-top:0!important}}

/* saa-fitment-mobile */
/* SAA 2026-11-02: fitment / spec tables in product tabs. Data contract (saa/PDP-CONTENT-CONTRACT.md): .sa-table-wrap[--capped] > table.sa-table.sa-table--fitment|--specs
   with thead th; legacy .table-container > table.fitment-table. The PDP script (tag 37) adds data-label + class saa-fit-labelled, and marks rows past 25
   (saa-row-more) with a "Show all" button. Phones: each row becomes a labelled card (label above value, 2-3 per line). */
html body .prod-tabs .sa-table-wrap{max-width:100%;max-height:none!important;overflow-x:auto} /* theme caps the wrap at 480px with an inner vertical scrollbar; long tables use the 25-row cap + Show all instead */
html body .prod-tabs table tr.saa-row-more,html body .prod-tabs table.saa-fit-labelled tr.saa-row-more{display:none!important}
html body .prod-tabs .saa-rows-open table tr.saa-row-more{display:table-row!important}
html body .prod-tabs .saa-rows-toggle{display:block;margin:10px 0 0;padding:0;border:0;background:none;color:var(--saa-red,#d71920);font:700 11px/1.4 var(--saa-display,inherit);letter-spacing:.12em;text-transform:uppercase;cursor:pointer}
html body .prod-tabs .saa-rows-toggle:hover{text-decoration:underline}
@media (max-width:768px){
html body .prod-tabs table.saa-fit-labelled thead,html body .prod-tabs table.saa-fit-labelled tr:has(> th){display:none!important}
html body .prod-tabs table.saa-fit-labelled,html body .prod-tabs table.saa-fit-labelled tbody{display:block!important;width:100%!important;min-width:0!important;border:0!important}
html body .prod-tabs table.saa-fit-labelled tr{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:0;margin:0 0 8px!important;border:1px solid var(--saa-line-soft,#e4e4e0)!important;background:#fff!important}
html body .prod-tabs .saa-rows-open table.saa-fit-labelled tr.saa-row-more{display:grid!important}
html body .prod-tabs table.saa-fit-labelled td{display:block!important;position:static!important;width:auto!important;padding:7px 10px!important;text-align:left!important;background:transparent!important;border:0!important;font-size:13px!important;line-height:1.35;white-space:normal!important;overflow-wrap:anywhere}
html body .prod-tabs table.saa-fit-labelled td::before{content:attr(data-label)!important;display:block;position:static!important;width:auto!important;padding:0!important;margin:0 0 1px;font:700 9.5px/1.4 var(--saa-display,inherit)!important;letter-spacing:.12em;text-transform:uppercase;color:var(--saa-grey-2,#777)}
html body .prod-tabs table.saa-fit-labelled td::after,html body .prod-tabs table.saa-fit-labelled td:not([data-label])::before{content:none!important}
html body .prod-tabs table.saa-fit-labelled tr:nth-child(2n) td{background:transparent!important}
}

/* saa-website-help */
/* SAA 2026-11-02: Website help entry points added by tag 34 (saa-pages.js "Website help"): empty-results card and the product-page report link. */
html body .saa-help-card{display:flex;flex-wrap:wrap;align-items:center;gap:6px 16px;margin:16px 0 8px;padding:16px 18px;border:1px solid var(--saa-line-soft,#e4e4e0);border-left:3px solid var(--saa-red,#d71920);background:#fff}
html body .saa-help-card b{font:800 15px/1.3 var(--saa-display,inherit);flex:1 1 100%}
html body .saa-help-card span{flex:1 1 280px;font-size:14px;line-height:1.5;color:var(--saa-grey-1,#555)}
html body .saa-help-card a{flex:none;background:var(--saa-ink,#111);color:#fff!important;padding:12px 18px;font:700 11px/1 var(--saa-display,inherit);letter-spacing:.14em;text-transform:uppercase;text-decoration:none}
html body .saa-help-report{display:block;margin:12px 0 0;font-size:12.5px;line-height:1.4;color:var(--saa-grey-2,#777)!important;text-decoration:underline;text-underline-offset:2px}
html body .saa-help-report:hover{color:var(--saa-ink,#111)!important}

/* saa-hdr-fit */
/* SAA 2026-11-02: desktop header (3-column grid from 1181px: left welcome | logo | right icons). The right column was 1fr with min 0, so a long
   name/cart total (e.g. "Hello, Bruno" + AU$20,287.25) overflowed left and the WeChat button sat on the logo. Right column now never narrower
   than its content; the left column gives way and the company name truncates. */
@media (min-width:1181px){html body .saa-hdr-brand-in{grid-template-columns:minmax(0,1fr) auto minmax(max-content,1fr)!important;column-gap:24px!important}html body .saa-hdr-left>*{min-width:0;max-width:100%}html body .saa-hdr-acct{display:inline-flex;min-width:0;max-width:100%}html body .saa-hdr-acct .saa-hdr-muted{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}

/* saa-fad-mobile */
/* SAA 2026-11-02: Find a Dealer (Storepoint). Storepoint floats the results list (~35%) beside the map until its own phone breakpoint, so between
   ~600 and 970px the list was too narrow: name clipped under the distance, Enquire button cut off. 601-1023px: map on top, full-width list. At 600px and below Storepoint uses its own phone layout (map over a 350px panel gap) - do not touch. */
@media (min-width:601px) and (max-width:1023px){html body #storepoint-container{display:flex!important;flex-direction:column}html body #storepoint-container>#storepoint-search{order:0}html body #storepoint-container>.de-count{order:1}html body #storepoint-container>#storepoint-map{order:2;float:none!important;width:100%!important;height:320px!important;margin:0 0 12px!important}html body #storepoint-container>#storepoint-panel{order:3;float:none!important;width:100%!important;height:auto!important}html body #storepoint-container #storepoint-results{height:auto!important;max-height:none!important;overflow:visible!important}html body #storepoint-container>#storepoint-clear{order:4}}

/* saa-fad-phone */
/* SAA 2026-11-02: Find a Dealer cards at <=600px (Storepoint phone layout). Phone/email on its own row, website+social icons on the next,
   Website|Enquire side by side full card width, Directions full width. Stops icons/Enquire spilling past the card on 360-390px phones. */
@media (max-width:600px){html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-contact:not(.storepoint-contact-website){grid-column:3/-1!important;grid-row:4!important}html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-contact-website{grid-column:3/-1!important;grid-row:5!important;justify-self:start!important;align-self:center!important}html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-description{grid-column:3/-1!important;grid-row:5!important;justify-self:start!important;align-self:center!important;margin-left:26px!important}html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-website-btn{grid-row:6!important;grid-column:1/-1!important;margin-top:4px!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:8px!important}html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-website-btn>.storepoint-btn{width:auto!important;min-width:0!important;margin:0!important;padding-left:6px!important;padding-right:6px!important;justify-content:center!important;white-space:nowrap!important}html body #storepoint-container #storepoint-results #storepoint-results-container .storepoint-location>.storepoint-website-btn>.de-directions-btn{grid-column:1/-1!important}}

/* saa-wechat-pop */
/* SAA 2026-11-02: WeChat - one QR in a centred pop-up card (replaces the 2-code full-screen panel). Markup in CMS footer (code editor 950297) #saa-wechat-qr.saa-qrpop;
   header icon + footer button open it (popover). Phones (<768px or touch): "Open in WeChat" deep link + screenshot hint, since you cannot scan your own screen. */
html body #saa-wechat-qr.saa-qrpop{position:fixed!important;inset:0!important;margin:auto!important;width:min(340px,calc(100vw - 32px))!important;height:fit-content!important;max-height:calc(100dvh - 32px)!important;overflow-y:auto!important;padding:26px 24px 22px!important;border:0!important;border-radius:6px!important;background:#fff!important;color:#111!important;box-shadow:0 24px 64px rgba(0,0,0,.45)!important;text-align:center!important;box-sizing:border-box!important;font-family:var(--saa-text,inherit);line-height:1.45}
html body #saa-wechat-qr.saa-qrpop:not(:popover-open){display:none!important}
html body #saa-wechat-qr.saa-qrpop:popover-open{display:block!important;animation:saaQrIn .18s ease}
html body #saa-wechat-qr.saa-qrpop::backdrop{background:rgba(10,10,12,.72);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
@keyframes saaQrIn{from{opacity:0;transform:translateY(8px) scale(.98)}to{opacity:1;transform:none}}
html body .saa-qrpop .saa-qrpop-x{position:absolute;top:4px;right:4px;width:44px;height:44px;margin:0;padding:0;display:flex;align-items:center;justify-content:center;background:none!important;border:0!important;color:#111!important;font-size:28px!important;line-height:1!important;cursor:pointer}
html body .saa-qrpop .saa-qrpop-x:hover,html body .saa-qrpop .saa-qrpop-x:focus-visible{color:#E10600!important;outline:none}
html body .saa-qrpop .saa-qrpop-head{display:flex;align-items:center;justify-content:center;gap:10px}
html body .saa-qrpop .saa-qrpop-head b{font-family:var(--saa-display,inherit);font-size:17px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#111}
html body .saa-qrpop .saa-qrpop-sub{margin:6px 0 0!important;font-size:13px;color:#555}
html body .saa-qrpop .saa-qrpop-code{display:block;width:min(240px,64vw,46vh);height:auto;aspect-ratio:1;margin:16px auto 0;border:1px solid #e6e6e6}
html body .saa-qrpop .saa-qrpop-hint{margin:14px 0 0!important;font-size:12.5px;color:#666}
html body .saa-qrpop .saa-qrpop-hint b{color:#111}
html body .saa-qrpop .saa-qrpop-open{display:none;align-items:center;justify-content:center;min-height:48px;margin:18px 0 0;padding:0 16px;background:#07C160;color:#fff!important;font-weight:700;font-size:14px;letter-spacing:.04em;text-decoration:none!important;border-radius:4px}
html body .saa-qrpop .saa-qrpop-hint--phone{display:none}
@media (hover:none) and (pointer:coarse),(max-width:767px){html body .saa-qrpop .saa-qrpop-open{display:flex}html body .saa-qrpop .saa-qrpop-hint--phone{display:block}html body .saa-qrpop .saa-qrpop-hint--desk{display:none}}

/* saa-blog-toppager */
/* SAA 2026-11-02: /blog - the theme prints the pager twice (under the title and at the bottom). The top copy added a 2nd rule under the heading and sat above the posts; keep the bottom one only. */
html body .blog-index>#blog-title+.pager{display:none!important}

/* saa-doc-badges */
/* SAA 2026-11-02: media tab link badges. The theme labels every .sa-doc "PDF"; the data has no type, so the badge comes
   from the href: .pdf = PDF, video files / YouTube / Vimeo = VIDEO, anything else = LINK (theme ZIP/IMG/DOC rules still win). */
html body .sa-content a.sa-doc::before{content:"LINK";width:auto;min-width:36px;padding:0 5px}
html body .sa-content a.sa-doc[href*=".pdf" i]::before{content:"PDF"}
html body .sa-content a.sa-doc:is([href*=".mp4" i],[href*=".mov" i],[href*=".webm" i],[href*="youtube.com" i],[href*="youtu.be" i],[href*="vimeo.com" i])::before{content:"VIDEO"}

/* saa-a11y-20261103 */
/* SAA 2026-11-03 a11y: A11Y-04 small muted price/vehicle labels to >=4.5:1 and >=10.5px; A11Y-02 hero pause button; A11Y-05 skip link */
html body .saa-card-gst{font-size:10.5px!important;color:#5f5f66!important}
html body .saa-card-rrp b,html body .saa-card-rrp s{color:#5f5f66!important}
html body .saa-card-rrp b{font-size:11px!important}
html body .saa-m-veh b{font-size:11px!important;color:#5f5f66!important}
html body .saa-hx-dots button.saa-hx-pause{width:24px!important;height:24px!important;margin:-10px 0 -10px 6px!important;padding:0!important;display:inline-flex!important;align-items:center;justify-content:center;flex:none;border-radius:50%!important;background:rgba(17,17,20,.55)!important;color:#fff!important;border:1px solid rgba(255,255,255,.65)!important;cursor:pointer}
html body .saa-hx-dots button.saa-hx-pause svg{display:block;pointer-events:none}
.saa-skip{position:fixed;left:8px;top:-80px;z-index:2147483000;padding:12px 18px;background:#111114;color:#fff!important;font:600 14px/1.2 "Instrument Sans",Arial,sans-serif;text-decoration:none!important}
.saa-skip:focus,.saa-skip:focus-visible{top:8px;outline:2px solid #e10600;outline-offset:2px}
#saa-main:focus,#saa-content:focus{outline:none}