/* Keep storefront navigation available and primary account/cart actions visible. */
.announcement-bar__phone { display: none; }
.announcement-bar__phone-icon { flex: 0 0 20px; color: #43c568; }
@media (max-width: 720px) {
    .announcement-bar--phone-hours .announcement-bar__message { display: none; }
    .announcement-bar .container { justify-content: center; }
    .announcement-bar--phone-hours .announcement-bar__phone {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        min-height: 44px;
        color: inherit;
        font-size: 15px;
        font-weight: 700;
        letter-spacing: .03em;
        text-decoration: none;
    }
    .announcement-bar__phone:focus-visible { outline: 2px solid currentColor; outline-offset: -3px; }
}
.flash { margin-bottom: 16px; }
.contact-enquiry { margin-bottom: 36px; padding: 24px; border: 1px solid #d9dee6; border-radius: 6px; background: #fff; }
.contact-enquiry__form { display: grid; gap: 16px; }
.contact-enquiry__fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.contact-enquiry__form label { display: block; margin-bottom: 8px; font-weight: 700; }
.contact-enquiry__form input, .contact-enquiry__form textarea { width: 100%; box-sizing: border-box; }
.contact-enquiry__form .button { justify-self: start; }
.contact-enquiry__form ul { color: #a31528; }
.contact-enquiry__honeypot { display: none; }
@media (max-width: 600px) { .contact-enquiry { padding: 18px; } .contact-enquiry__fields { grid-template-columns: minmax(0, 1fr); } }

.page-order-portal .portal-hero:not(.portal-hero--compact) .portal-hero__grid {
    grid-template-columns: minmax(0, 1fr);
}

.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    box-shadow: 0 3px 12px rgb(23 25 29 / 10%);
}
html { scroll-padding-top: calc(var(--site-header-height, 180px) + 16px); }
.site-header .header-search input { font-size: 16px; }
.site-header .shortcut--account,
.site-header .shortcut--cart {
    min-height: 44px;
    gap: 8px;
    padding: 10px 14px;
    border: 1px solid transparent;
    border-radius: 5px;
    box-shadow: none;
    text-decoration: none;
    line-height: 1.2;
}
.site-header .shortcut--account { background: #252930; border-color: #252930; color: #fff; }
.site-header .shortcut--account:hover { background: #414751; border-color: #414751; color: #fff; }
.site-header .shortcut--cart { background: #b9152d; border-color: #b9152d; color: #fff; }
.site-header .shortcut--cart:hover { background: #991126; border-color: #991126; color: #fff; }
.site-header .shortcut--cart [data-cart-count] { margin-left: 0; background: #fff; color: #991126; }
.site-header .header-shortcuts--desktop { gap: 10px; }
.brand-directory__letters { top: var(--site-header-height, 180px); }
@media (min-width: 961px) {
    .summary-card { top: calc(var(--site-header-height, 180px) + 24px); }
}
@media (max-width: 720px) {
    .site-header .wrapper-header {
        grid-template-columns: minmax(0, 1fr) auto;
        grid-template-areas: 'brand shortcuts';
        gap: 8px;
        padding: 10px 0;
    }
    .site-header .brand-column { min-width: 0; gap: 8px; }
    .site-header .site-logo { min-width: 0; padding: 0; }
    .site-header .site-logo img { max-width: 100%; object-fit: contain; }
    .site-header .header-shortcuts--mobile { display: flex; width: auto; gap: 0; }
    .site-header .header-shortcuts--mobile .shortcut--account,
    .site-header .header-shortcuts--mobile .shortcut--phone { display: none; }
    .site-header .header-shortcuts--mobile .shortcut--cart { font-size: 13px; padding: 8px 10px; }
    .site-header .header-shortcuts--mobile .shortcut__label--full { display: none; }
    .site-header .header-shortcuts--mobile .shortcut__label--compact { display: inline; }
    .mobile-header-search { padding-top: 12px; padding-bottom: 12px; }
    .mobile-header-search .header-search input { font-size: 16px; }
    .site-header .subnav.is-mobile-open { max-height: 70dvh; overflow-y: auto; }
    .site-header .subnav.is-mobile-open .subnav__inner { display: flex; flex-direction: column; align-items: stretch; }
    .site-header .subnav.is-mobile-open .header-shortcuts--desktop { display: flex; flex-direction: column; align-items: stretch; gap: 0; width: 100%; margin: 0; padding: 0; }
    .site-header .subnav.is-mobile-open .header-shortcuts--desktop .shortcut {
        display: flex;
        justify-content: flex-start;
        min-height: 44px;
        padding: 13px 20px;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: inherit;
        line-height: inherit;
    }
    .site-header .subnav.is-mobile-open .header-shortcuts--desktop .shortcut--cart { display: none; }
    .site-header .subnav.is-mobile-open .subnav-menu > summary,
    .site-header .subnav.is-mobile-open .subnav__primary > div > a,
    .site-header .subnav.is-mobile-open .header-shortcuts--desktop .shortcut {
        box-sizing: border-box;
        width: 100%;
        margin-bottom: 6px;
        border: 1px solid #e2e5e9;
        border-radius: 3px;
    }
}
.site-header .shortcut--phone { gap: 8px; }
.site-header .shortcut--phone::before {
    content: '';
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%2316803c'%3E%3Cpath d='M22 16.92v3a2 2 0 0 1-2.18 2 19.79 19.79 0 0 1-8.63-3.07 19.5 19.5 0 0 1-6-6 19.79 19.79 0 0 1-3.07-8.67A2 2 0 0 1 4.11 2h3a2 2 0 0 1 2 1.72c.12.96.36 1.9.7 2.79a2 2 0 0 1-.45 2.11L8.09 9.89a16 16 0 0 0 6 6l1.27-1.27a2 2 0 0 1 2.11-.45c.89.34 1.83.58 2.79.7A2 2 0 0 1 22 16.92z'/%3E%3C/svg%3E") center / contain no-repeat;
}
/* iOS zooms focused controls below 16px. Keep pinch-to-zoom available. */
@media (max-width: 960px), (hover: none) and (pointer: coarse) {
    input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='submit']):not([type='button']):not([type='range']):not([type='color']),
    select,
    textarea { font-size: max(16px, 1rem) !important; }
}

.cart-mobile-checkout { display: none; }
.page-cart .sfx-garage-bar,
.page-checkout .sfx-garage-bar,
.page-order-portal .sfx-garage-bar,
body:has(main .product-detail) .sfx-garage-bar { display: none; }
@media (max-width: 720px) {
    .page-cart .mobile-header-search,
    .page-checkout .mobile-header-search { display: none; }
    .page-cart .cart-mobile-checkout { display: block; margin-bottom: 20px; }
}

/* Decorative arrows use CSS so legacy text encoding cannot corrupt the glyph. */
.performance-arrow{display:inline-block;position:relative;width:20px;height:12px;margin-left:8px;flex:0 0 20px}
.performance-arrow::before{content:'';position:absolute;top:5px;left:0;width:18px;border-top:2px solid currentColor}
.performance-arrow::after{content:'';position:absolute;right:1px;top:1px;width:9px;height:9px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.performance-arrow--previous{transform:rotate(180deg)}
.performance-arrow--up{transform:rotate(-90deg)}

/* Keep search metadata and controls close to the products at every viewport width. */
.section.section--search-heading { padding-top: 14px; }
.section--search-heading .breadcrumbs { margin-bottom: 6px; }
.section--search-heading .section-heading--search-results {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 4px 12px;
    margin: 0 0 8px;
}
.section--search-heading .section-heading--search-results .eyebrow { margin: 0; line-height: 1.4; }
.section--search-heading .section-heading--search-results > p:last-child { margin: 0; font-size: .86rem; }
.section--search-heading .section--search-results { padding: 0 0 22px; }
.search-results-toolbar {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-bottom: 10px;
}
.search-results-toolbar .active-filter-strip { flex: 1; min-width: 0; margin: 0; gap: 6px; }
.search-results-toolbar .active-filter { max-width: 100%; min-height: 32px; gap: 6px; padding: 4px 10px; font-size: .78rem; line-height: 1.35; }
.search-results-toolbar .active-filter span { min-width: 0; overflow-wrap: anywhere; }
.search-results-toolbar .active-filter svg { flex: 0 0 14px; }
.search-results-toolbar .product-view-toolbar { flex: 0 0 auto; margin: 0 0 0 auto; }
.section--search-results .fitment-summary { margin: 0 0 10px; }
@media (max-width: 980px) {
    .section.section--search-heading { padding-top: 10px; }
    .section--search-heading .section-heading--search-results > p:last-child { font-size: .78rem; white-space: normal; }
    .section--search-heading .section-heading--search-results .eyebrow { font-size: .68rem; }
    .search-results-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 10px; margin-bottom: 8px; }
    .search-results-toolbar .search-results-mobile-bar { display: block; margin: 0; min-width: 0; }
    .search-results-toolbar .filters-button { min-height: 44px; gap: 7px; padding: 6px 10px; border-radius: 4px; font-size: .82rem; }
    .search-results-toolbar .product-view-toggle__button { min-height: 36px; padding: 0 12px; }
    .search-results-toolbar .active-filter-strip { grid-column: 1 / -1; grid-row: 2; }
    .search-results-toolbar .active-filter { min-height: 36px; }
}
.performance-arrow--down{transform:rotate(90deg)}
.performance-arrow--up-right{transform:rotate(-45deg)}
.performance-arrow--down-right{transform:rotate(45deg)}
.performance-arrow--down-left{transform:rotate(135deg)}
.performance-arrow--up-left{transform:rotate(-135deg)}
.compatibility-nav__button .performance-arrow{margin:0}

/* Keep the delivery toggle beside the first line of its wrapping label. */
.checkout-form div:has(> #checkout_shipToDifferentAddress) {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin: 16px 0;
}
.checkout-form #checkout_shipToDifferentAddress {
    order: -1;
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    min-height: 18px;
    margin: 3px 0 0;
    padding: 0;
}
.checkout-form label[for="checkout_shipToDifferentAddress"] {
    display: block;
    min-width: 0;
    margin: 0;
    line-height: 24px;
    cursor: pointer;
}

/* A sidebar can leave cart items narrow even on a desktop-sized viewport. */
.page-cart .cart-table {
    container: cart-items / inline-size;
}
@container cart-items (max-width: 940px) {
    .page-cart .cart-line {
        display: grid;
        grid-template-columns: 80px minmax(0, 1fr);
        align-items: start;
        gap: 16px;
        padding: 20px;
    }
    .page-cart .cart-line__media {
        grid-column: 1;
        grid-row: 1;
        width: 80px;
        height: 80px;
    }
    .page-cart .cart-line__content {
        grid-column: 2;
        grid-row: 1;
        min-width: 0;
        overflow-wrap: anywhere;
    }
    .page-cart .cart-line__actions {
        grid-column: 1 / -1;
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: center;
        justify-content: flex-start;
        gap: 16px;
        min-width: 0;
    }
    .page-cart .cart-line__total {
        grid-column: 1 / -1;
        padding-top: 12px;
        border-top: 1px solid var(--line);
        text-align: right;
    }
}
@container cart-items (max-width: 400px) {
    .page-cart .cart-line {
        grid-template-columns: 64px minmax(0, 1fr);
        gap: 12px;
        padding: 16px 12px;
    }
    .page-cart .cart-line__media {
        width: 64px;
        height: 64px;
    }
}

/* Imported fitment JSON contains tables inside table cells. Give each level
   the full mobile width instead of reserving a 240px column at every level. */
@media (max-width: 640px) {
    #detail-panel-compatibility .compatibility-copy .reference-table,
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody {
        display: block;
        width: 100%;
        overflow: visible;
    }
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody > tr {
        display: grid;
        grid-template-columns: minmax(0, 2fr) minmax(0, 3fr);
    }
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody > tr > th,
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody > tr > td {
        display: block;
        min-width: 0;
        width: auto;
        padding: 8px 10px;
        overflow-wrap: break-word;
        word-break: normal;
    }
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody > tr:has(> td .reference-table) {
        grid-template-columns: minmax(0, 1fr);
    }
    #detail-panel-compatibility .compatibility-copy .reference-table > tbody > tr > td:has(.reference-table) {
        padding: 0;
        border: 0;
    }
    #detail-panel-compatibility .compatibility-copy .reference-table td > ul:has(.reference-table) {
        display: grid;
        gap: 12px;
        margin: 12px 0 0;
        padding: 0;
        list-style: none;
    }
}

/* SSOT owns product content; Trade supplies its presentation. Inline legacy
   styles need !important here. Keep nested mobile fitment tables on their
   existing layout rules above. */
.detail-panel .compatibility-copy {
    min-width: 0;
    font-size: .9375rem;
    line-height: 1.6;
    overflow-wrap: anywhere;
}
.detail-panel .compatibility-copy :is(h3, h4) {
    margin: 1.5rem 0 .75rem;
    color: var(--dark, #20252b);
    font-family: inherit;
    font-size: 1.0625rem;
    font-weight: 700;
    line-height: 1.4;
}
.detail-panel .compatibility-copy > :first-child { margin-top: 0; }
.detail-panel .compatibility-copy p { margin-bottom: 1rem; }
.detail-panel .compatibility-copy :is(ul, ol) { padding-left: 1.35rem; }
.detail-panel .compatibility-copy li + li { margin-top: .3rem; }
.detail-panel .compatibility-copy small {
    font-size: .8125rem;
    line-height: 1.55;
    color: #596273;
}
.detail-panel .compatibility-copy p:has(> small) {
    margin: .75rem 0 1.25rem;
    line-height: 1.55;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy table {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 1rem 0 !important;
    border: 1px solid var(--line, #dfe3e8) !important;
    border-collapse: collapse !important;
    border-spacing: 0 !important;
    font-size: .875rem !important;
    line-height: 1.55 !important;
    color: var(--dark, #20252b) !important;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy :is(th, td) {
    padding: .625rem .875rem !important;
    border: 0 !important;
    border-bottom: 1px solid var(--line, #dfe3e8) !important;
    font-size: inherit !important;
    line-height: inherit !important;
    text-align: left !important;
    vertical-align: top;
    white-space: normal !important;
    overflow-wrap: anywhere;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy thead :is(tr, th, td) {
    background-color: #303740 !important;
    color: #fff !important;
    font-weight: 600;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy tbody :is(tr, th, td) {
    background-color: #fff !important;
    color: inherit !important;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy tbody tr:nth-child(even) > :is(th, td) {
    background-color: #f5f6f8 !important;
}
.detail-panel .compatibility-copy .product-downloads-section { margin-top: 1.5rem !important; }
.detail-panel .compatibility-copy .product-downloads-section :is(th, td):first-child { width: 3rem !important; }
.detail-panel .compatibility-copy .product-downloads-section :is(th, td):nth-child(2) { width: auto !important; }
.detail-panel .compatibility-copy .product-downloads-section :is(th, td):last-child { width: 7rem !important; }

/* The legacy core-charge callout has no class; identify its generator's neutral
   #555555 background without changing other promotional/warning callouts. */
.detail-panel .compatibility-copy div[style*="#555555" i] {
    margin: 1rem 0 !important;
    padding: 1rem 1.125rem !important;
    border: 1px solid var(--line, #dfe3e8);
    border-left: 3px solid #d71935;
    border-radius: 6px !important;
    background-color: #f5f6f8 !important;
    color: var(--dark, #20252b) !important;
    text-align: left !important;
}
.detail-panel .compatibility-copy div[style*="#555555" i] > h3 {
    margin: 0 0 .5rem !important;
    color: inherit !important;
    font-size: 1rem !important;
}
.detail-panel .compatibility-copy div[style*="#555555" i] > p {
    margin: 0 !important;
    font-style: normal !important;
}
@media (max-width: 640px) {
    .detail-panel:not(#detail-panel-compatibility) .compatibility-copy :is(th, td) {
        padding: .5rem .625rem !important;
    }
    .detail-panel .compatibility-copy .product-downloads-section :is(th, td):first-child { width: 2rem !important; }
    .detail-panel .compatibility-copy .product-downloads-section :is(th, td):last-child { width: 4.5rem !important; }
}
.detail-panel .compatibility-copy .product-downloads-section > p {
    margin: .75rem 0 !important;
    padding: 0 !important;
    color: #596273;
    font-size: .8125rem;
    font-style: normal !important;
    line-height: 1.55;
}
.detail-panel:not(#detail-panel-compatibility) .compatibility-copy td:first-child:has(> strong) {
    min-width: 7rem;
}