/* Shop rail + panel for the product and shop pages (they keep their own styles; this only adds the shop.com frame) */
body.sx{background:#f4f4f5}
body.sx .hd,body.sx .sf{display:none}
.sx-rail{position:fixed;left:0;top:0;bottom:0;width:4.75rem;display:flex;flex-direction:column;align-items:center;padding:1.1rem 0 1rem;z-index:30}
.sx-rail__logo img{width:2rem;height:2rem;border-radius:.5rem;display:block}
.sx-rail__mid{flex:1;display:flex;flex-direction:column;justify-content:center;gap:1.1rem}
body.sx .sx-rail a{color:#b4b4bb;display:grid;place-items:center;width:2.9rem;height:2.9rem;border-radius:.8rem;position:relative;text-decoration:none;transition:color .15s,background .15s}
body.sx .sx-rail a:hover{color:#18181b;background:rgba(0,0,0,.04)}
body.sx .sx-rail a.on{color:#18181b}
.sx-rail__mid a::after{content:attr(data-t);position:absolute;left:calc(100% + .5rem);top:50%;transform:translateY(-50%);background:#fff;color:#18181b;box-shadow:0 0 0 1px rgba(0,0,0,.06),0 4px 12px -4px rgba(0,0,0,.2);font-size:.78rem;padding:.3rem .6rem;border-radius:.5rem;white-space:nowrap;opacity:0;pointer-events:none;transition:opacity .12s}
.sx-rail__mid a:hover::after{opacity:1}
.sx-rail__me{height:auto!important;gap:.2rem;font-size:.72rem;color:#71717a!important}
.sx-av{width:2.2rem;height:2.2rem;border-radius:50%;background:#2f6b3a;color:#fff;display:grid;place-items:center;font-size:.95rem;font-weight:600}
.sx-ask{position:fixed;left:calc(50% + 2.375rem);bottom:1.4rem;transform:translateX(-50%);z-index:20;width:min(30rem,calc(100% - 7rem));display:flex;align-items:center;gap:.5rem;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-radius:999px;padding:.4rem .4rem .4rem 1.3rem;box-shadow:0 14px 40px -12px rgba(0,0,0,.25),0 0 0 1px rgba(0,0,0,.04)}
.sx-ask input{flex:1;min-width:0;border:0;outline:0;background:none;font:inherit;font-size:1rem;height:2.6rem;color:#18181b}
.sx-ask button{flex:none;width:2.6rem;height:2.6rem;border-radius:50%;border:0;background:#f1f1f3;color:#3f3f46;display:grid;place-items:center;cursor:pointer}
.sx-ask button:hover{background:#e4e4e7}
.sx-panel{position:relative;margin:.55rem .55rem .55rem 4.75rem;background:#fff;border-radius:1.4rem;overflow:hidden;box-shadow:0 0 0 1px rgba(0,0,0,.05),0 6px 24px -12px rgba(0,0,0,.12);min-height:calc(100vh - 1.1rem);padding-bottom:6rem}
body.sx .mx-crumbs{padding-top:1.6rem}
.sx-ask{font-family:inherit}
@media (max-width:640px){.sx-rail{top:auto;bottom:0;right:0;width:auto;height:3.8rem;flex-direction:row;background:#fff;box-shadow:0 -1px 0 #e4e4e7;padding:0 .6rem}body.sx .sx-rail .sx-rail__logo,.sx-rail__me span{display:none}.sx-rail__mid{flex-direction:row;justify-content:space-around}.sx-rail__mid a::after{display:none}.sx-panel{margin:0 0 3.8rem;border-radius:0}.sx-ask{left:50%;bottom:4.6rem;width:calc(100% - 2rem)}}

/* phone: on a product page the floating "What are you shopping for today?" bar sat over Add to bag and the title, so it
   hides there (search is one tap away in the rail). Kaysi 2026-10-21 */
@media (max-width:640px){body[data-slug] .sx-ask{display:none}}
