@media (min-width: 769px){
.dsmm-mobile-nav{ display:none !important; }
} .dsmm-mobile-nav{
position: fixed;
left: 12px;
right: 12px;
width: auto;
bottom: 10px;
bottom: calc(env(safe-area-inset-bottom) + 10px);
z-index: 9999;
display: flex;
justify-content: space-between;
align-items: center;
gap: 10px;
box-sizing: border-box;
height: var(--dsmm-bar-height, 56px);
padding: 10px 12px;
border-radius: 22px;
border: 1px solid rgba(0,0,0,.06);
background: var(--dsmm-bar-bg, rgba(255,255,255,.88));
box-shadow: 0 12px 30px rgba(0,0,0,.14);
-webkit-tap-highlight-color: transparent;
}
@supports ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))){
.dsmm-mobile-nav{
background: var(--dsmm-bar-bg, rgba(255,255,255,.78));
backdrop-filter: blur(14px);
-webkit-backdrop-filter: blur(14px);
}
} .dsmm-mobile-nav .dsmm-item{
flex: 1;
text-decoration: none;
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 4px;
padding: 10px 8px;
border-radius: 18px;
color: var(--dsmm-text-color, rgba(17,24,39,.55));
user-select: none;
-webkit-tap-highlight-color: transparent;
transition: transform .12s ease, background-color .12s ease, color .12s ease;
}
.dsmm-mobile-nav .dsmm-item:active{
transform: scale(.98);
} .dsmm-mobile-nav .dsmm-item.is-active,
.dsmm-mobile-nav .dsmm-item[aria-current="page"],
.dsmm-mobile-nav .dsmm-item.current-menu-item,
.dsmm-mobile-nav .dsmm-item.current_page_item{
background: rgba(0,0,0,.06);
color: var(--dsmm-accent, #2c7be5);
} .dsmm-mobile-nav .dsmm-icon{
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
}
.dsmm-icon-img{
width: 22px;
height: 22px;
object-fit: contain;
display: block;
}
.dsmm-mobile-nav svg{ fill: currentColor; } .dsmm-mobile-nav .dsmm-label{
font-size: 12px;
line-height: 1.05;
font-weight: 700;
opacity: 1;
} .dsmm-cart-count{
position: absolute;
top: -7px;
right: -9px;
left: auto;
transform: none;
min-width: 18px;
height: 18px;
padding: 0 6px;
border-radius: 999px;
font-size: 12px;
line-height: 18px;
font-weight: 800;
color: #fff;
background: #e11d48;
text-align: center;
pointer-events: none;
border: 2px solid rgba(255,255,255,.92);
box-shadow: 0 8px 16px rgba(0,0,0,.18);
}
.dsmm-cart-count.is-empty{ display:none; } .dsmm-modal{
display:none;
position: fixed;
inset: 0;
z-index: 10000;
}
.dsmm-modal.is-open{ display:block; }
.dsmm-overlay{
position:absolute;
inset:0;
background: rgba(0,0,0,.45);
}
.dsmm-sheet{
position:absolute;
left: 0;
right: 0;
bottom: 0;
max-height: 86vh;
background: #fff;
border-radius: 18px 18px 0 0;
box-shadow: 0 -20px 60px rgba(0,0,0,.25);
overflow: hidden;
}
.dsmm-head{
position: relative;
padding: 14px 16px;
border-bottom: 1px solid rgba(0,0,0,.08);
background: #f7f8fa;
z-index: 1;
}
.dsmm-head h2{
margin: 0;
font-size: 22px;
font-weight: 900;
letter-spacing: -.2px;
}
.dsmm-close{
position:absolute;
right: 10px;
top: 8px;
width: 40px;
height: 40px;
border: 0;
background: transparent;
font-size: 28px;
line-height: 40px;
cursor: pointer;
opacity: .75;
color: var(--dsmm-accent, #2c7be5);
z-index: 10;
display: inline-flex;
align-items: center;
justify-content: center;
border-radius: 999px;
background: rgba(255,255,255,.7);
border: 1px solid rgba(0,0,0,.08);
}
.dsmm-body{
padding: 14px 16px 18px;
overflow: auto;
max-height: calc(86vh - 62px);
} .dsmm-catalog-ui{ padding-bottom: 2px; }
.dsmm-quick,
.dsmm-chips{
display: flex;
flex-wrap: nowrap;
gap: 10px;
overflow-x: auto;
-webkit-overflow-scrolling: touch;
padding-bottom: 2px;
scrollbar-width: none;
}
.dsmm-quick::-webkit-scrollbar,
.dsmm-chips::-webkit-scrollbar{ display:none; }
.dsmm-chip{
flex: 0 0 auto;
display: inline-flex;
align-items: center;
justify-content: center;
text-decoration: none;
padding: 10px 12px;
border-radius: 999px;
background: #f3f4f6;
border: 1px solid rgba(0,0,0,.08);
color: #111827;
font-weight: 750;
font-size: 13px;
white-space: nowrap;
}
.dsmm-chip:before{
content:'';
width: 10px;
height: 10px;
border-radius: 3px;
background: rgba(17,24,39,.85);
display:inline-block;
margin-right: 8px;
}
.dsmm-section{ margin: 14px 0; }
.dsmm-section-title{
font-size: 13px;
font-weight: 900;
opacity: .8;
margin: 0 0 10px;
} .dsmm-menu, .dsmm-submenu,
.dsmm-catalog-tree .dsmm-tree{
list-style: none;
padding: 0;
margin: 0;
}
.dsmm-menu > li,
.dsmm-catalog-tree .dsmm-node{
border-bottom: 1px solid rgba(0,0,0,.06);
padding: 10px 0;
position: relative;
}
.dsmm-menu-link,
.dsmm-tree-link{
display: inline-block;
padding: 10px 0;
text-decoration: none;
color: #111827;
font-weight: 780;
}
.dsmm-has-submenu{ position: relative; }
.dsmm-submenu-toggle,
.dsmm-tree-toggle{
position:absolute;
right: 0;
top: 6px;
border: 0;
background: transparent;
width: 42px;
height: 42px;
cursor: pointer;
opacity: .7;
}
.dsmm-submenu{ display:none; padding-left: 14px; margin-top: 4px; }
.dsmm-has-submenu.dsmm-open > .dsmm-submenu{ display:block; }
.dsmm-node.has-children{ padding-right: 40px; }
.dsmm-node > .dsmm-tree{
display:none;
padding-left: 14px;
margin-top: 4px;
border-top: 1px dashed rgba(0,0,0,.08);
}
.dsmm-node.dsmm-open > .dsmm-tree{ display:block; } .dsmm-cart-body .woocommerce-mini-cart{
margin: 0;
padding: 0;
} @media (max-width: 360px){
.dsmm-mobile-nav{
left: 10px;
right: 10px;
padding: 8px 10px;
border-radius: 20px;
gap: 8px;
}
.dsmm-mobile-nav .dsmm-item{
padding: 9px 6px;
border-radius: 16px;
}
} .dsmm-empty,
.dsmm-note{
background: #f7f8fa;
border: 1px solid rgba(0,0,0,.08);
border-radius: 16px;
padding: 14px 14px;
}
.dsmm-empty{
text-align: center;
}
.dsmm-empty-title,
.dsmm-note-title{
font-size: 16px;
font-weight: 900;
margin: 0 0 10px;
}
.dsmm-empty p,
.dsmm-note p{
margin: 0 0 10px;
opacity: .85;
}
.dsmm-empty .dsmm-btn,
.dsmm-note .dsmm-btn{
width: 100%;
} .dsmm-cart-body .woocommerce-mini-cart__empty-message{
background: #f7f8fa;
border: 1px solid rgba(0,0,0,.08);
border-radius: 16px;
padding: 14px;
text-align: center;
font-weight: 800;
margin: 0;
} .dsmm-menu > li,
.dsmm-catalog-tree .dsmm-node{
position: relative;
}
.dsmm-menu > li.dsmm-has-submenu{
padding-left: 14px;
}
.dsmm-menu > li.dsmm-has-submenu:before{
content: '';
position: absolute;
left: 0;
top: 14px;
bottom: 14px;
width: 3px;
border-radius: 3px;
background: color-mix(in srgb, var(--dsmm-accent, #2c7be5) 55%, transparent);
} .dsmm-submenu{
margin-left: 8px;
padding-left: 14px;
border-left: 2px dashed rgba(0,0,0,.10);
}
.dsmm-submenu .dsmm-menu-link{
font-weight: 700;
font-size: 15px;
opacity: .92;
} .dsmm-catalog-tree .dsmm-node.has-children{
padding-left: 14px;
}
.dsmm-catalog-tree .dsmm-node.has-children:before{
content: '';
position: absolute;
left: 0;
top: 14px;
bottom: 14px;
width: 3px;
border-radius: 3px;
background: color-mix(in srgb, var(--dsmm-accent, #2c7be5) 55%, transparent);
} .dsmm-catalog-tree .dsmm-node .dsmm-tree{
border-left: 2px dashed rgba(0,0,0,.10);
margin-left: 8px;
padding-left: 14px;
}
.dsmm-catalog-tree .dsmm-node .dsmm-tree-link{
font-weight: 700;
font-size: 15px;
}
.dsmm-catalog-tree .dsmm-node .dsmm-node .dsmm-tree-link{
font-weight: 650;
font-size: 14px;
opacity: .92;
} @supports not (background: color-mix(in srgb, #000 50%, transparent)){
.dsmm-menu > li.dsmm-has-submenu:before,
.dsmm-catalog-tree .dsmm-node.has-children:before{
background: rgba(44,123,229,.35);
}
}