/* 88HARDWARE rail flush 1.0.4 (2026-10-31; was 1.0.1). PC only, every page except the homepage (r15.3 already does this there).
   Reserve the desktop lane before drawer JS runs to prevent CLS on non-home pages with the drawer.
   1) rail: same flush-right panel as the r15.3 homepage.
   2) content: the page's centred wrapper keeps its left edge (lined up with the header logo) and runs right to 14px
      before the rail (max 1600px wide, like the homepage). rail-flush.js measures and only ever WIDENS a wrapper;
      without JS nothing below part 2 applies. Header, nav, footer and page markup are untouched. */
@media (min-width:1200px) and (any-pointer:fine){
  html.h88-category-desktop body.hardware-club-theme:not(.home){--h88-tool-rail-right:0px;--h88-tool-rail-width:70px}
  html.h88-category-desktop body.hardware-club-theme:not(.home) .h88-desktop-tool-rail{right:0;border:1px solid #E3E6EA;border-right:0;border-radius:14px 0 0 14px;background:#fff;box-shadow:-8px 0 26px -16px rgba(22,25,30,.35)}
  html.h88-category-desktop body.hardware-club-theme:not(.home) .h88-desktop-account-shortcut{border-radius:14px 0 0 0}
  html.h88-category-desktop body.hardware-club-theme:not(.home) .h88-back-to-top{border-radius:0 0 0 14px}

  /* part 2 is applied by rail-flush.js as inline margin/width on the measured wrapper (class .h88rf-t), so it also wins
     over page CSS that uses ID selectors; resize/out of PC removes it again. */
}

/* 1.0.4 part 3: 1241-1439px. The header container uses a 40px gutter here, but these pages' CSS uses min(1280px,100% - 48px)
   (24px), so their content ran 16px past the header on both sides. Set the same 40px gutter in CSS so the FIRST paint is
   already aligned (1.0.3 did it in JS after paint = CLS). Plain media query only: no JS-added classes. rail-flush.js
   then measures 0/0 and leaves these wrappers alone. Outside 1241-1439 nothing here applies.
   (1.0.4 also drops the dead 1.0.1 rule #h88bp2-page .wrap.desk-in.h88rf-t{padding:0}.) */
@media (min-width:1241px) and (max-width:1439px) and (any-pointer:fine){
  html body.hardware-club-theme:not(.home) #h88ab1-page.h88ab1 .wrap,
  html body.hardware-club-theme:not(.home) #h88ct1-page.h88ct1 .wrap,
  html body.hardware-club-theme:not(.home) #h88hc1-page.h88hc1 .wrap,
  html body.hardware-club-theme:not(.home) #h88dp1-page.h88dp1 .wrap,
  html body.hardware-club-theme:not(.home) #h88rr1-page.h88rr1 .wrap,
  html body.hardware-club-theme:not(.home) #h88pp1-page.h88pp1 .wrap,
  html body.hardware-club-theme:not(.home) #h88to1-page.h88to1 .wrap,
  html body.hardware-club-theme:not(.home) #h88sp2-page.h88sp2 .sx-wrap{width:min(1280px,calc(100% - 80px))}
  /* Business Purchasing: the bands are inset by the page root's side padding (24px here); make it 40px. */
  html body.hardware-club-theme:not(.home) #h88bp2-page.h88bp2{padding-left:max(40px,(100% - 1280px) / 2);padding-right:calc(max(40px,(100% - 1280px) / 2) + var(--bp-lane,0px))}
}

/* Pre-JS lane reservation; matches desktop-tool-rail.css until the drawer is ready. */
@media (min-width:1200px) and (any-pointer:fine) and (not (any-pointer:coarse)){
  html:not(.h88-drawer-ready) body.hardware-club-theme:not(.home):has(#h88-site-drawer){
    --h88-tool-rail-lane:calc(80px + env(safe-area-inset-right,0px));
    box-sizing:border-box;
    padding-right:var(--h88-tool-rail-lane);
  }
  html:not(.h88-drawer-ready) body.hardware-club-theme:not(.home):has(#h88-site-drawer) > .site-header > .header-masthead > :is(.utility-bar,.header-main-band),
  html:not(.h88-drawer-ready) body.hardware-club-theme:not(.home):has(#h88-site-drawer) > .site-footer.club-footer{
    margin-right:calc(0px - var(--h88-tool-rail-lane));
    padding-right:var(--h88-tool-rail-lane);
  }
}