/* Shared shopping UI. Homepage styling is intentionally scoped elsewhere. */
.shop-sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.shop-hub{margin:0;background:#050505;color:#f4f3f0;font-family:Inter,Arial,sans-serif}
.shop-hub *{box-sizing:border-box}
.shop-hub a{color:inherit;text-decoration:none}
.shop-hub .topbar{height:58px;background:#050505}
.shop-hub .topbar .shell{width:min(1180px,calc(100% - 32px));margin:auto;display:flex;align-items:center;justify-content:space-between;height:100%}
.shop-hub .topbar img{width:94px;max-height:48px;object-fit:contain}
.shop-hub .top-actions{display:flex}
.shop-hub .icon{display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:#fff}
.shop-hub .icon svg,.shop-search svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.shop-hub-main{width:min(1100px,calc(100% - 32px));margin:0 auto;padding:22px 0 36px}
.shop-hub h1{font:400 clamp(24px,4vw,40px)/1.2 'Russo One',Arial,sans-serif;margin:0 0 18px}
.shop-search{display:flex;background:#151517;border:1px solid #47474c;border-radius:8px;overflow:hidden}
.shop-search input{min-width:0;flex:1;height:48px;padding:0 12px;border:0;background:transparent;color:#fff;font:16px Inter,Arial}
.shop-search button{width:48px;flex-shrink:0;background:#f20210;border:0;color:white;cursor:pointer}
.shop-hub-vehicle{margin:12px 0 18px}
.hub-vehicle-toggle{width:100%;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:10px 12px;background:#111113;color:#fff;border:1px solid #303036;border-radius:8px;font:600 14px Inter,Arial;text-align:left;cursor:pointer}
#hubVehicleAction{color:#ff6670;flex-shrink:0}
.shop-hub-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.shop-hub-card{display:flex;flex-direction:column;border:1px solid #303036;border-radius:10px;overflow:hidden;background:#111113}
.hub-image{height:150px;background:#eeeeef;padding:12px}
.hub-image img{width:100%;height:100%;object-fit:contain}
.shop-hub-card strong{font-size:16px;line-height:1.35;padding:12px 12px 4px}
.shop-hub-card>span{font-size:13px;line-height:1.4;color:#b5b5bc;padding:0 12px 14px}
.shop-hub-card:hover{border-color:#f20210}
.shop-build-link{margin:20px 0 0;padding:18px 0;display:flex;justify-content:space-between;gap:12px;border-top:1px solid #f20210;border-bottom:1px solid #f20210;font-size:14px}
.shop-help{font-size:14px;color:#b5b5bc;line-height:1.6}
.shop-help a{text-decoration:underline}
.shop-nav-search{width:min(1180px,calc(100% - 32px));margin:12px auto}
.shop-nav-row{display:flex;justify-content:space-between;gap:12px;margin-bottom:8px;font:600 13px Inter,Arial}
.shop-nav-row a{color:#fff;text-decoration:none;display:flex;align-items:center;min-height:44px}
.shop-nav-vehicle{color:#c6c6cc!important;text-align:right}
.shop-filter-toolbar,.shop-filter-chips{display:none}
.shop-filter-dialog{background:#101012;color:#fff;border:1px solid #393940;border-radius:14px;padding:20px;width:min(440px,calc(100% - 24px));max-height:85dvh;box-sizing:border-box}
.shop-filter-dialog::backdrop{background:#000b}
.shop-filter-dialog header{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}
.shop-filter-dialog h2{font:700 22px Inter,Arial;margin:0}
.shop-filter-dialog button{min-height:44px;padding:10px 14px;font:600 14px Inter,Arial;border:1px solid #484850;border-radius:6px;color:#fff;background:#242428;cursor:pointer}
.shop-filter-fields{display:grid;gap:16px}
.shop-filter-fields label{display:grid;gap:8px;font:600 14px Inter,Arial}
.shop-filter-fields select{width:100%;min-height:48px;background:#202024;color:#fff;border:1px solid #55555c;padding:10px;font:16px Inter,Arial}
.shop-filter-dialog footer{display:flex;gap:10px;margin-top:24px}
.shop-filter-dialog .shop-filter-apply{background:#f20210;border-color:#f20210;flex:1}
.shop-filter-dialog .shop-filter-note{font:13px/1.5 Inter,Arial;color:#bbb}
.shop-hub [hidden]{display:none!important}
@media(max-width:800px){
 .shop-hub-main{padding-top:16px}.shop-hub-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 .hub-image{height:100px;padding:8px}.shop-hub-card strong{font-size:14px;padding:10px 10px 4px}.shop-hub-card>span{padding:0 10px 12px;font-size:12px}
 .shop-build-link{flex-direction:column;gap:6px}
 body.shop-mobile-ready input,body.shop-mobile-ready select{font-size:16px!important;min-height:44px}
 body.shop-mobile-ready :is(.change,.as-vehicle-edit,#sjEditVehicle,#editVehicle,#sjCancelVehicle){font-size:12px!important;min-height:44px!important;padding:8px!important}
 body.shop-mobile-ready :is(.hero h1,.shop-hero h1){font-size:30px!important;line-height:1.15!important;white-space:normal!important;margin:12px 0!important}
 body.shop-mobile-ready :is(.hero p,.choice p,.category p,.sj-help,.catalog-hint){font-size:14px!important;line-height:1.5!important}
 body.shop-mobile-ready :is(.choice .cta,.category span,.quick-note){font-size:12px!important;line-height:1.5}
 body.shop-mobile-ready :is(.choice small,.option-number){font-size:11px!important}
 body.shop-mobile-ready .controls{grid-template-columns:1fr!important}
 body.shop-mobile-ready .controls>.shop-filter-anchor{display:none}
 .shop-filter-toolbar{display:flex;position:sticky;top:58px;z-index:20;padding:8px 0;background:#050505;align-items:center;justify-content:space-between;gap:12px}
 .shop-filter-toolbar button{min-height:44px;padding:10px 16px;background:#18181c;border:1px solid #55555e;border-radius:7px;color:#fff;font:600 14px Inter,Arial;cursor:pointer}
 .shop-filter-chips{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
 .shop-filter-chips button{min-height:36px;background:#242429;border:1px solid #48484e;border-radius:18px;padding:6px 12px;color:#fff;font:13px Inter,Arial}
 body.shop-mobile-ready :is(#sjCategories,.category-chips){gap:8px}
 body.shop-mobile-ready :is(#sjCategories button,.height-filter.show){font-size:12px!important;min-height:44px!important}
 body.shop-mobile-ready #sjProducts :is(.shot,.lift-product-image){background:#ededee}
 body.shop-mobile-ready #sjProducts :is(.shot img,.lift-product-image img){object-fit:contain}
 body.shop-mobile-ready #sjProducts :is(.pill,.meta){font-size:11px!important}
 body.shop-mobile-ready :is(.qty button:not(.remove)){width:44px;height:44px}
 body.shop-mobile-ready :is(.service-pill,.note){font-size:12px!important;line-height:1.5}
 body.shop-mobile-ready .qty .remove{font-size:12px;padding:14px 8px}
}
@media(prefers-reduced-motion:reduce){.shop-hub *{scroll-behavior:auto}}

.shop-filter-anchor{display:none!important}
.shop-hub .sj-vehicle-top{display:flex;justify-content:space-between;gap:12px;margin-bottom:12px}
.shop-hub .sj-kicker{font-size:12px;color:#ff6670;margin-bottom:6px}
.shop-hub .sj-fields{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.shop-hub .sj-fields label{display:grid;gap:8px;font-size:14px}
.shop-hub .sj-fields :is(select,input){box-sizing:border-box;width:100%;min-width:0;min-height:48px;padding:10px;border:1px solid #55555c;border-radius:6px;color:#fff;background:#19191d;font:16px Inter,Arial}
.shop-hub .sj-help{font-size:13px;line-height:1.5;color:#bbb}
.shop-hub .sj-form-actions{display:flex;gap:10px;flex-wrap:wrap}
.shop-hub .sj-button{min-height:44px;padding:10px 14px;border:1px solid #55555c;border-radius:6px;background:#19191d;color:#fff;font:600 14px Inter,Arial;cursor:pointer}
.shop-hub .sj-button:disabled{opacity:.5;cursor:not-allowed}
.shop-hub .sj-button.primary{background:#f20210;border-color:#f20210}
.shop-hub :is(a,button,input,select):focus-visible{outline:2px solid #fff;outline-offset:3px}
@media(max-width:800px){.shop-hub .sj-fields{grid-template-columns:1fr}}

/* Product-first mobile shopping headers and expandable vehicle details. */
@media(max-width:800px){
 body.shop-mobile-ready .shop-nav-search{margin:6px auto 10px}
 body.shop-mobile-ready .shop-nav-row{margin-bottom:4px;font-size:12px}
 body.shop-mobile-ready .shop-search input{height:44px;font-size:14px!important}
 body.shop-mobile-ready main .hero{padding:8px 0 12px}
 body.shop-mobile-ready main .hero h1{font-size:24px!important;line-height:1.2!important;margin:6px 0 12px!important;letter-spacing:-.02em}
 body.shop-mobile-ready main .hero :is(.eyebrow,.back){display:none!important}
 body.shop-mobile-ready main .hero>.shell>p{display:none}
 body.shop-compact-configurator main>.hero{display:none}
 body.shop-compact-configurator :is(#wheelStage,#liveTireSection,#fitmentStep){padding-top:8px}
 body.shop-compact-configurator :is(#wheelStage,#liveTireSection)>.shell>.panel>:is(.step-kicker,.step-copy){display:none}
 body.shop-compact-configurator :is(#wheelStage,#liveTireSection)>.shell>.panel>h2{font-size:24px!important;line-height:1.2;margin:4px 0 12px}
 body.shop-compact-configurator #fitmentStep.is-complete .step-kicker{display:none}
 body.shop-compact-configurator #fitmentStep.is-complete .panel{padding:0!important}
 body.shop-compact-configurator #liveWheelBlock{margin-top:10px;padding-top:0;border-top:0}
 body.shop-compact-configurator #liveWheelBlock .live-head{display:none}

 body.shop-has-vehicle-row .shop-nav-vehicle{display:none}
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady,[data-shop-vehicle]){
  padding:8px 12px!important;margin:8px 0 12px!important;
  border:1px solid #303036!important;border-radius:8px!important;background:#111113!important;
 }
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady){flex-direction:row!important;align-items:center!important;gap:12px!important}
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady)>div:first-child{min-width:0;flex:1}
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady,[data-shop-vehicle]) :is(.as-vehicle-label,.panel-title,.selector-label,.sj-kicker,.as-vehicle-detail,.fitment-pill){display:none!important}
 body.shop-mobile-ready #vehicleReady>div:first-child>span{display:none!important}
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady,[data-shop-vehicle]) :is(.as-vehicle-name,#vehicleName,#sjVehicleName){font:600 13px/1.4 Inter,Arial,sans-serif!important}
 body.shop-mobile-ready :is(#wheelVehicleSummary,#vehicleReady,[data-shop-vehicle]) :is(.as-vehicle-edit,#editVehicle,#sjEditVehicle){min-height:44px!important;font:600 13px/1.4 Inter,Arial,sans-serif!important;text-transform:none!important;padding:8px 0 8px 8px!important}
 body.shop-mobile-ready [data-shop-vehicle] :is(.vehicle-summary,.sj-vehicle-top){display:flex;align-items:center!important;gap:12px!important;margin-bottom:0}
 body.shop-mobile-ready [data-shop-vehicle] #sjVehicleForm:not([hidden]){margin-top:12px}
}

/* Show wheel bolt pattern once alongside the selected vehicle. */
.shop-vehicle-lug{display:none}
@media(max-width:800px){
 body.shop-mobile-ready .shop-vehicle-lug:not([hidden]){
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  min-height:24px;padding:3px 8px;border:1px solid #44825c;border-radius:999px;
  background:#20352a;color:#d5f4df;font:700 10px/1.3 Inter,Arial,sans-serif;white-space:nowrap;
 }
 body.shop-mobile-ready #wheelCatalogStatus.shop-loaded-summary{display:none}
}

/* Shop landing page: use the established Russo One brand face throughout. */
.shop-hub .shop-search input{font-family:'Russo One',Arial,sans-serif;font-weight:400;font-size:16px;letter-spacing:.015em;text-transform:uppercase}
.shop-hub .shop-search input::placeholder{font-family:inherit;font-weight:400;opacity:1}
.shop-hub .hub-vehicle-toggle{font-family:'Russo One',Arial,sans-serif;font-weight:400;font-size:13px;line-height:1.4}
.shop-hub #hubVehicleLabel{min-width:0;overflow-wrap:anywhere}
.shop-hub #hubVehicleAction{font-size:12px;text-transform:uppercase}
.shop-hub .shop-hub-card strong,.shop-hub .shop-atv-selector strong{font-family:'Russo One',Arial,sans-serif;font-weight:400;font-size:16px;line-height:1.35}
.shop-hub .shop-hub-card>span,.shop-hub .shop-atv-selector span{font-family:'Russo One',Arial,sans-serif;font-weight:400;font-size:12px;line-height:1.5}
.shop-hub .shop-build-link,.shop-hub .shop-help{font-family:'Russo One',Arial,sans-serif;font-weight:400;font-size:12px}
.shop-hub .shop-build-link strong{font-weight:400}
@media(max-width:800px){
 body.shop-hub.shop-mobile-ready .shop-search input{font-size:16px!important}
 .shop-hub .hub-vehicle-toggle{font-size:12px}
 .shop-hub #hubVehicleAction{font-size:11px}
 .shop-hub .shop-hub-card strong,.shop-hub .shop-atv-selector strong{font-size:13px}
 .shop-hub .shop-hub-card>span,.shop-hub .shop-atv-selector span{font-size:11px}
}

/* One opaque edge trigger for every shopping filter drawer, at every width. */
html body .shop-filter-edge:not([hidden]){
 display:flex!important;align-items:center;justify-content:center;position:fixed;right:0;top:45%;z-index:60;
 width:36px;min-height:164px;padding:16px 8px;box-sizing:border-box;border:0;border-radius:8px 0 0 8px;
 background:#f20210!important;background-image:none!important;opacity:1;color:#fff;
 font:400 11px/1.2 'Russo One',Arial,sans-serif;letter-spacing:.05em;text-transform:uppercase;
 writing-mode:vertical-rl;cursor:pointer;box-shadow:none;
}
@keyframes shopFilterShake{0%,88%,100%{transform:translateX(0) rotate(0)}90%{transform:translateX(-3px) rotate(-1.5deg)}92%{transform:translateX(2px) rotate(1.5deg)}94%{transform:translateX(-2px) rotate(-1deg)}96%{transform:translateX(1px) rotate(.75deg)}98%{transform:translateX(0) rotate(0)}}
html body .shop-filter-edge:not([hidden]){animation:shopFilterShake 4.5s ease-in-out infinite;transform-origin:right center}
@media(prefers-reduced-motion:reduce){html body .shop-filter-edge:not([hidden]){animation:none}}
html body .shop-filter-edge[hidden]{display:none!important}
html body .shop-filter-edge:focus-visible{outline:2px solid #fff;outline-offset:-4px}
html body .shop-filter-toolbar{display:none!important}
html body #sjClear[hidden]{display:none!important}
html body .mobile-refine{position:static;min-height:0;background:transparent;padding:4px 0 8px;border:0}
html body .mobile-refine>button{display:none!important}
html body .mobile-refine-dialog #filters{display:block!important}

html body #filterTrigger{display:none!important}
