.bottom-nav{--bottom-nav-height: 50px;--bottom-nav-bg-r: 255;--bottom-nav-bg-g: 255;--bottom-nav-bg-b: 255;--bottom-nav-bg-opacity: 1;--bottom-nav-blur: 0px;--bottom-nav-spacing: 50;--bottom-nav-icon-color: #000000;--bottom-nav-icon-size: 24px;--bottom-nav-text-shadow: none;--bottom-nav-font-size: 10px;position:fixed;bottom:0;left:0;right:0;z-index:99990;height:var(--bottom-nav-height);background-color:rgba(var(--bottom-nav-bg-r),var(--bottom-nav-bg-g),var(--bottom-nav-bg-b),var(--bottom-nav-bg-opacity));backdrop-filter:blur(var(--bottom-nav-blur));-webkit-backdrop-filter:blur(var(--bottom-nav-blur));border-top:1px solid rgba(0,0,0,.08);box-shadow:0 -1px 4px #0000000a;transition:transform .3s ease}.bottom-nav--hidden{transform:translateY(100%)}.bottom-nav__container{display:flex;justify-content:space-around;align-items:center;height:100%;margin:0 auto;padding:3px 15px;max-width:calc(200px + (var(--bottom-nav-spacing) * 6px))}.bottom-nav__item{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:var(--bottom-nav-icon-color);padding:4px 8px;border-radius:8px;transition:opacity .2s ease,background-color .2s ease;flex:1;max-width:80px}.bottom-nav__item:active{opacity:.7}.bottom-nav__icon{display:flex;align-items:center;justify-content:center;width:var(--bottom-nav-icon-size);height:var(--bottom-nav-icon-size);color:var(--bottom-nav-icon-color)}.bottom-nav__icon img,.bottom-nav__icon svg{width:100%;height:100%;object-fit:contain}.bottom-nav__label{font-size:var(--bottom-nav-font-size);font-weight:600;line-height:1.2;text-align:center;white-space:nowrap;color:var(--bottom-nav-text-color, var(--bottom-nav-icon-color));text-shadow:var(--bottom-nav-text-shadow);font-family:var(--font-body-family)}@media screen and (min-width: 750px){.bottom-nav{display:none}.bottom-nav--show-desktop{display:block}.bottom-nav--show-desktop .bottom-nav__item:hover{background-color:#0000000a}.bottom-nav--show-desktop .bottom-nav__item:hover .bottom-nav__icon{transform:scale(1.1);transition:transform .2s ease}}@media screen and (max-width: 749px){body{padding-bottom:60px}}@media screen and (min-width: 750px){body:has(.bottom-nav--show-desktop){padding-bottom:60px}}
/*# sourceMappingURL=/cdn/shop/t/30/assets/component-bottom-nav.css.map */
