:root{--p:var(--mds-color-main);--pl:var(--mds-color-main);--bg:#eef1f8;--nb:#fff;--off:#b0b8d0;--on:var(--mds-color-main)}

/* Ensure body and html allow scrolling from page load */
html, body {
    overflow-x: hidden;
    overflow-y: auto !important;
}
.nav-wrap{position:fixed;bottom:0;left:0;right:0;padding-bottom:env(safe-area-inset-bottom,0px);display:flex;justify-content:center;filter:drop-shadow(0 -1px 0 rgba(0,0,0,.04)) drop-shadow(0 -3px 12px rgba(0,0,0,.08)) drop-shadow(0 6px 20px rgba(0,0,0,.06));will-change:transform;z-index:99999;height:62px}
.nav-bar{background:var(--nb);width:100%;height:62px;padding:0 6px;display:flex;align-items:center;justify-content:space-around;position:relative;z-index:99999}
.ni{display:flex;align-items:center;justify-content:center;flex:1;height:100%;border:none;background:none;outline:none;cursor:pointer;position:relative;-webkit-tap-highlight-color:transparent;transition:transform .14s cubic-bezier(.34,1.56,.64,1)}
.ni:active{transform:scale(.82)}
.ni svg{width:26.4px;height:26.4px;color:var(--off);transition:color .18s,transform .2s cubic-bezier(.34,1.56,.64,1)}
.ni.on svg{color:var(--on);transform:translateY(-2px) scale(1.12)}
.ni.on::after{content:'';position:absolute;bottom:7px;width:4px;height:4px;border-radius:50%;background:var(--p);animation:dotPop .2s cubic-bezier(.34,1.56,.64,1) both}
.ni.on.wa svg{color:#25D366}
.ni.on.wa::after{background:#25D366}
.fab-wrap{flex:0 0 62px;display:flex;align-items:center;justify-content:center;margin-top:-24px}
.fab{width:52px;height:52px;border-radius:50%;border:none;outline:none;background:linear-gradient(145deg,var(--pl),var(--p));box-shadow:0 2px 5px rgba(0,0,0,.22),0 5px 14px rgba(0,0,0,.26);display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform .14s cubic-bezier(.34,1.56,.64,1),box-shadow .14s;will-change:transform}
.fab:active{transform:scale(.87);box-shadow:0 1px 4px rgba(0,0,0,.18),0 3px 8px rgba(0,0,0,.18)}
.fab svg{width:23px;height:23px;color:#fff}
.stt{position:fixed;bottom:calc(62px + env(safe-area-inset-bottom,0px) + 14px);right:18px;width:44px;height:44px;border-radius:50%;border:none;outline:none;background:var(--nb);box-shadow:0 2px 10px rgba(0,0,0,.12),0 1px 4px rgba(0,0,0,.07);display:flex;align-items:center;justify-content:center;cursor:pointer;-webkit-tap-highlight-color:transparent;opacity:0;pointer-events:none;transform:translateY(10px) scale(.8);transition:opacity .22s,transform .22s cubic-bezier(.34,1.56,.64,1);will-change:transform,opacity;z-index:200}
.stt.show{opacity:1;pointer-events:auto;transform:translateY(0) scale(1)}
.stt:active{transform:scale(.88)}
.stt svg{width:20px;height:20px;color:var(--p)}
.rpl{position:absolute;border-radius:50%;width:44px;height:44px;left:50%;top:50%;margin:-22px 0 0 -22px;background:var(--p);transform:scale(0);animation:ripple .36s ease-out forwards;pointer-events:none;opacity:0.1}
.mobile-cart-badge{position:absolute;top:10%;right:35%;background:var(--p);color:#fff;font-size:10px;font-weight:bold;min-width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;padding:0 4px}
@keyframes slideUp{from{opacity:0;transform:translateY(60px)}to{opacity:1;transform:translateY(0)}}
@keyframes dotPop{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes ripple{to{transform:scale(3.4);opacity:0}}
@media (min-width:769px){.nav-wrap,.stt{display:none!important}}
@media (max-width:768px){footer{padding-bottom:70px}.scrollup{display:none!important}}
.visibility-hidden{visibility:hidden}