/* HSN Bearing Inquiry Dock V1.0.0 — right-edge dock + adjacent popovers */
.hsnbi-root,.hsnbi-root *,.hsnbi-root *::before,.hsnbi-root *::after{box-sizing:border-box}
.hsnbi-root{--hsnbi-primary:#2368FF;--hsnbi-deep:#1556E8;--hsnbi-accent:#08C5ED;--hsnbi-size:54px;--hsnbi-tabw:calc(var(--hsnbi-size) + 13px);font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;color:#101c35;line-height:1.5}
.hsnbi-root [hidden]{display:none!important}
.hsnbi-root .hsnbi-bar{position:fixed!important;z-index:2147482000;right:0;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;align-items:flex-end;gap:8px;margin:0!important;padding:0!important;width:auto;list-style:none;overflow:visible}
.hsnbi-root .hsnbi-button{position:relative;isolation:isolate;display:flex!important;align-items:center!important;justify-content:center!important;flex:none;width:var(--hsnbi-tabw)!important;height:var(--hsnbi-size)!important;min-height:0!important;min-width:0!important;max-width:none!important;margin:0!important;padding:0!important;border:0!important;border-radius:999px 0 0 999px!important;background:linear-gradient(115deg,var(--hsnbi-primary) 5%,var(--hsnbi-deep) 95%)!important;box-shadow:0 5px 14px rgba(25,84,211,.16)!important;color:#fff!important;text-decoration:none!important;cursor:pointer;appearance:none;-webkit-appearance:none;transition:width .2s ease,filter .2s ease,box-shadow .2s ease!important}
.hsnbi-root .hsnbi-button:visited{color:#fff!important}
.hsnbi-root .hsnbi-button--inquiry{background:linear-gradient(116deg,var(--hsnbi-deep),var(--hsnbi-primary) 55%,var(--hsnbi-accent))!important}
.hsnbi-root .hsnbi-button--whatsapp{background:linear-gradient(120deg,var(--hsnbi-primary),var(--hsnbi-accent))!important}
.hsnbi-root .hsnbi-button--wechat{background:linear-gradient(115deg,#128CFE,var(--hsnbi-accent))!important}
.hsnbi-root .hsnbi-button--top{background:linear-gradient(115deg,var(--hsnbi-primary),var(--hsnbi-deep))!important}
.hsnbi-root .hsnbi-button:hover,.hsnbi-root .hsnbi-button:focus-visible,.hsnbi-root .hsnbi-button[aria-expanded="true"]{width:calc(var(--hsnbi-tabw) + 7px)!important;box-shadow:0 7px 22px rgba(36,107,255,.24)!important;filter:brightness(1.06)}
.hsnbi-root .hsnbi-button:focus-visible{outline:3px solid #6ce5ff!important;outline-offset:-3px}
.hsnbi-root .hsnbi-button svg{display:block!important;flex:none;width:23px!important;height:23px!important;margin:0!important;padding:0!important;stroke:#fff!important;color:#fff!important;fill:none!important}
.hsnbi-root .hsnbi-tip{position:absolute;z-index:10;right:calc(100% + 12px);top:50%;transform:translate(5px,-50%);display:block;white-space:nowrap;pointer-events:none;visibility:hidden;opacity:0;padding:9px 12px;background:#fff;border:1px solid #e7eef8;border-radius:9px;box-shadow:0 7px 20px rgba(7,34,74,.13);color:#152b4b;font-size:13px;font-weight:600;line-height:1.25;transition:opacity .16s ease,transform .16s ease}
.hsnbi-root .hsnbi-button:hover .hsnbi-tip,.hsnbi-root .hsnbi-button:focus-visible .hsnbi-tip{visibility:visible;opacity:1;transform:translate(0,-50%)}
.hsnbi-root .hsnbi-button[aria-expanded="true"] .hsnbi-tip{visibility:hidden!important;opacity:0!important}
/* Popover: anchored by JS to the opened button; NOT an overlay */
.hsnbi-root .hsnbi-popover{position:fixed!important;z-index:2147482001;right:calc(var(--hsnbi-tabw) + 13px)!important;top:16px;display:block!important;width:min(430px,calc(100vw - var(--hsnbi-tabw) - 29px));max-height:calc(100dvh - 24px);overflow:visible!important;margin:0!important;padding:22px!important;background:#fff!important;border:1px solid rgba(195,215,245,.9)!important;border-radius:17px!important;box-shadow:0 14px 45px rgba(9,51,112,.18)!important;text-align:left;line-height:1.5;overscroll-behavior:contain}
.hsnbi-root .hsnbi-popover::after{content:"";position:absolute;right:-7px;top:var(--hsnbi-arrow-top,40px);width:13px;height:13px;background:#fff;border-top:1px solid #dce8f7;border-right:1px solid #dce8f7;transform:rotate(45deg);pointer-events:none}
.hsnbi-root .hsnbi-panel-topline{position:absolute;top:0;left:0;right:0;height:4px;border-radius:16px 16px 0 0;background:linear-gradient(90deg,var(--hsnbi-primary),var(--hsnbi-accent))}
.hsnbi-root .hsnbi-close{position:absolute;top:13px;right:13px;z-index:2;display:flex;align-items:center;justify-content:center;width:28px;height:28px;padding:0!important;border:0!important;border-radius:8px!important;background:#F2F7FF!important;color:#6b7890!important;cursor:pointer}
.hsnbi-root .hsnbi-close:hover,.hsnbi-root .hsnbi-close:focus-visible{background:#E7F1FF!important;color:var(--hsnbi-primary)!important}
.hsnbi-root .hsnbi-close svg{width:16px;height:16px;stroke:currentColor}
.hsnbi-root .hsnbi-kicker{display:block;margin:0 0 6px;color:var(--hsnbi-primary);font-size:10px;font-weight:800;letter-spacing:.11em}
.hsnbi-root .hsnbi-pane{display:block;max-height:calc(100dvh - 75px);overflow-y:auto;overflow-x:hidden;scrollbar-width:thin}
.hsnbi-root .hsnbi-pane h2{margin:0 0 6px!important;padding:0!important;color:#101e36!important;font-size:22px!important;font-weight:750!important;line-height:1.33!important;letter-spacing:-.02em}
.hsnbi-root .hsnbi-desc{margin:0 0 14px!important;padding:0!important;color:#66758b!important;font-size:13px!important;line-height:1.65!important}
.hsnbi-root .hsnbi-form{margin:0!important;padding:0!important}
.hsnbi-root .hsnbi-form-row{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-bottom:9px}
.hsnbi-root .hsnbi-form label:not(.hsnbi-consent){display:block;margin:0!important;padding:0!important;color:#293a56!important;font-size:12px!important;font-weight:650!important;line-height:1.65!important}
.hsnbi-root .hsnbi-form label b{color:#ea4e5b;font-weight:700}
.hsnbi-root .hsnbi-form input:not([type="checkbox"]),.hsnbi-root .hsnbi-form textarea{display:block;width:100%!important;max-width:100%!important;min-width:0!important;min-height:37px!important;height:auto;margin:4px 0 0!important;padding:8px 10px!important;border:1px solid #dce7f4!important;border-radius:9px!important;background:#FCFDFF!important;box-shadow:none!important;outline:none;color:#17253f!important;font-family:inherit!important;font-size:12px!important;font-weight:400!important;line-height:1.4!important;appearance:none}
.hsnbi-root .hsnbi-form input:focus,.hsnbi-root .hsnbi-form textarea:focus{border-color:var(--hsnbi-primary)!important;box-shadow:0 0 0 3px rgba(47,107,255,.10)!important}
.hsnbi-root .hsnbi-form textarea{resize:vertical;min-height:64px!important}
.hsnbi-root .hsnbi-form .hsnbi-wide-field{margin-bottom:9px!important}
.hsnbi-root .hsnbi-consent{display:flex;gap:8px;align-items:flex-start;margin:9px 0 10px!important;padding:0!important;color:#65738b!important;font-size:11px!important;font-weight:400!important;line-height:1.6!important}
.hsnbi-root .hsnbi-consent input{flex:none;width:15px;height:15px;min-height:0;margin:1px 0 0!important;accent-color:var(--hsnbi-primary)}
.hsnbi-root .hsnbi-consent a{color:var(--hsnbi-primary)!important;text-decoration:underline}
.hsnbi-root .hsnbi-honeypot{position:absolute;left:-10000px;top:-10000px;width:1px;height:1px;overflow:hidden;opacity:0;pointer-events:none}
.hsnbi-root .hsnbi-feedback{margin:0 0 8px!important;font-size:12px;line-height:1.5;color:#bf4553}
.hsnbi-root .hsnbi-feedback[data-success="1"]{color:#148467}
.hsnbi-root .hsnbi-submit{display:flex!important;align-items:center!important;justify-content:center!important;gap:8px;width:100%!important;min-height:42px!important;padding:9px 14px!important;margin:0!important;border:0!important;border-radius:9px!important;background:linear-gradient(105deg,var(--hsnbi-deep),var(--hsnbi-primary),var(--hsnbi-accent))!important;box-shadow:none!important;color:#fff!important;font-size:13px!important;font-weight:700!important;line-height:1.5!important;cursor:pointer}
.hsnbi-root .hsnbi-submit:disabled{opacity:.65;cursor:wait}
.hsnbi-root .hsnbi-submit:hover:not(:disabled){filter:brightness(1.05)}
/* WeChat popup */
.hsnbi-root .hsnbi-wx-heading{display:flex;align-items:center;gap:12px;margin:0 25px 16px 0}
.hsnbi-root .hsnbi-wx-heading h2{margin:0!important;font-size:20px!important}
.hsnbi-root .hsnbi-wx-mark{display:flex;align-items:center;justify-content:center;flex:none;width:41px;height:41px;border-radius:14px;background:linear-gradient(135deg,#1CC9D9,var(--hsnbi-primary));color:#fff}
.hsnbi-root .hsnbi-wx-mark svg{width:26px;height:26px;stroke:#fff}
.hsnbi-root .hsnbi-wx-person{margin:0 0 8px!important;font-size:15px;font-weight:700;text-align:center;color:#162749}
.hsnbi-root .hsnbi-qr-frame{position:relative;display:flex;align-items:center;justify-content:center;width:100%;margin:0 auto 12px;padding:13px;border:1px solid #DCEBFD;border-radius:14px;background:linear-gradient(135deg,#F4FAFF 0%,#FFFFFF 56%,#EDF8FF 100%)}
.hsnbi-root .hsnbi-qr-frame img{display:block!important;width:min(100%,240px)!important;height:auto!important;max-height:250px!important;object-fit:contain!important;margin:0!important;padding:0!important;border:0!important;border-radius:5px!important;box-shadow:none!important;background:#fff}
.hsnbi-root .hsnbi-wx-caption{margin:0!important;color:#6c7890!important;text-align:center;font-size:12px!important;line-height:1.6!important}
/* Tablet / phone */
@media(max-width:767px){
 .hsnbi-root{--hsnbi-mobile-size:45px;--hsnbi-tabw:56px}
 .hsnbi-root .hsnbi-bar{top:auto;bottom:16vh;transform:none;gap:6px}
 .hsnbi-root .hsnbi-button{width:56px!important;height:45px!important}
 .hsnbi-root .hsnbi-button:hover,.hsnbi-root .hsnbi-button:focus-visible,.hsnbi-root .hsnbi-button[aria-expanded="true"]{width:58px!important}
 .hsnbi-root .hsnbi-button svg{width:21px!important;height:21px!important}
 .hsnbi-root .hsnbi-tip{display:none!important}
 .hsnbi-root .hsnbi-popover{right:68px!important;width:min(340px,calc(100vw - 80px))!important;max-height:calc(100dvh - 20px);padding:20px 16px!important;border-radius:14px!important}
 .hsnbi-root .hsnbi-popover::after{display:none}
 .hsnbi-root .hsnbi-form-row{grid-template-columns:1fr;gap:9px}
 .hsnbi-root .hsnbi-form .hsnbi-wide-field{margin-bottom:9px!important}
 .hsnbi-root .hsnbi-pane h2{font-size:21px!important}
 .hsnbi-root .hsnbi-qr-frame img{max-height:210px!important}
}
@media(max-height:560px){.hsnbi-root .hsnbi-bar{gap:3px}.hsnbi-root .hsnbi-button{height:40px!important}.hsnbi-root .hsnbi-button svg{width:19px!important;height:19px!important}}
@media(prefers-reduced-motion:reduce){.hsnbi-root .hsnbi-button,.hsnbi-root .hsnbi-tip{transition:none!important}}
/* Keep the native hidden state stronger than the visible popover declarations. */
.hsnbi-root .hsnbi-popover[hidden],.hsnbi-root .hsnbi-pane[hidden]{display:none!important}

/* HSN RFQ compact bilingual-free English form */
.hsnbi-root .hsnbi-popover{border-top:4px solid var(--hsnbi-accent)!important;padding-top:20px!important}
.hsnbi-root .hsnbi-pane{padding-right:2px}
.hsnbi-root .hsnbi-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:10px;margin-bottom:10px}
.hsnbi-root .hsnbi-row--product{grid-template-columns:minmax(0,1.5fr) minmax(0,.75fr)}
.hsnbi-root .hsnbi-form>label:not(.hsnbi-consent){display:block;margin-bottom:10px!important}
.hsnbi-root .hsnbi-form label span:not(.hsnbi-consent span){font-weight:400;color:#8290a2}
.hsnbi-root .hsnbi-form select{display:block!important;width:100%!important;height:38px!important;min-height:38px!important;max-width:100%!important;padding:7px 30px 7px 10px!important;margin:4px 0 0!important;background:#FCFDFF!important;border:1px solid #dce7f4!important;border-radius:9px!important;box-shadow:none!important;color:#17253f!important;font-family:inherit!important;font-size:12px!important;line-height:1.4!important;cursor:pointer}
.hsnbi-root .hsnbi-form select:focus-visible{outline:2px solid var(--hsnbi-primary)!important;outline-offset:2px}
.hsnbi-root .hsnbi-form input::placeholder,.hsnbi-root .hsnbi-form textarea::placeholder{color:#97A3B6!important;opacity:1}
.hsnbi-root .hsnbi-kicker{font-size:10px;letter-spacing:.12em}
.hsnbi-root .hsnbi-pane h2{font-size:21px!important}
.hsnbi-root .hsnbi-form .hsnbi-feedback:empty{display:none}
.hsnbi-root .hsnbi-form .hsnbi-feedback:not(:empty){margin:0 0 9px!important}
.hsnbi-root .hsnbi-button{background:linear-gradient(116deg,var(--hsnbi-deep),var(--hsnbi-primary))!important}
.hsnbi-root .hsnbi-button--quote,.hsnbi-root .hsnbi-button--wechat{background:linear-gradient(112deg,var(--hsnbi-primary) 12%,var(--hsnbi-accent) 100%)!important}
.hsnbi-root .hsnbi-wx-name{margin:5px 0 10px!important;text-align:center;font-weight:700;color:#183059}
.hsnbi-root .hsnbi-qr-frame{display:flex;align-items:center;justify-content:center;margin:0 auto 14px;max-width:290px;padding:12px;border:1px solid #d7e9fb;border-radius:12px;background:#f4faff}
.hsnbi-root .hsnbi-qr-frame img{display:block!important;max-width:250px!important;width:100%!important;height:auto!important;max-height:260px!important;object-fit:contain!important;background:#fff!important;margin:0!important}
.hsnbi-root .hsnbi-wx-caption{text-align:center;color:#6b7890;font-size:13px;line-height:1.6}
.hsnbi-root .hsnbi-consent span{font-size:11px;line-height:1.5}
@media(max-width:767px){
 .hsnbi-root .hsnbi-popover{right:64px!important;width:min(362px,calc(100vw - 76px))!important;padding:17px 14px!important}
 .hsnbi-root .hsnbi-row{grid-template-columns:minmax(0,1fr);gap:7px;margin-bottom:8px}
 .hsnbi-root .hsnbi-row--product{grid-template-columns:minmax(0,1fr)}
 .hsnbi-root .hsnbi-form>label:not(.hsnbi-consent){margin-bottom:8px!important}
 .hsnbi-root .hsnbi-pane h2{font-size:19px!important}
 .hsnbi-root .hsnbi-desc{font-size:12px!important;margin-bottom:10px!important}
}
/* Prevent automatic input zoom on mobile Safari; retain the scrollable panel. */
@media(max-width:767px){
 .hsnbi-root .hsnbi-form input:not([type="checkbox"]),
 .hsnbi-root .hsnbi-form select,
 .hsnbi-root .hsnbi-form textarea{font-size:16px!important}
 .hsnbi-root .hsnbi-pane{max-height:calc(100dvh - 74px);overflow-y:auto}
}
