nav.fxh-nav{ position: relative; }
nav.fxh-nav .fxh-dmc-panel{ position: absolute;
top: 0;
left: 0;
right: 0;
background: #fff;
border-radius: 18px;
overflow: hidden;
z-index: 9999;
opacity: 0;
transform: translateX(8px);
pointer-events: none;
transition: opacity .18s ease, transform .18s ease;
}
nav.fxh-nav .fxh-dmc-panel.is-open{
opacity: 1;
transform: translateX(0);
pointer-events: auto;
}
nav.fxh-nav .fxh-dmc-head{
display:flex;
align-items:center;
gap: 10px;
padding: 12px 14px;
border-bottom: 1px solid rgba(0,0,0,.06);
}
nav.fxh-nav .fxh-dmc-back{
width: 28px;
height: 28px;
border: 0;
background: transparent;
cursor: pointer;
position: relative;
}
nav.fxh-nav .fxh-dmc-back:before{
content:"";
position:absolute;
inset:0;
margin:auto;
width: 9px;
height: 9px;
border-left: 1.8px solid currentColor;
border-bottom: 1.8px solid currentColor;
transform: rotate(45deg);
}
nav.fxh-nav .fxh-dmc-title{
font-size: 11px;
letter-spacing: .08em;
text-transform: uppercase;
opacity: .75;
}
nav.fxh-nav .fxh-dmc-body{ max-height: none;
overflow: auto;
-webkit-overflow-scrolling: touch;
}
nav.fxh-nav .fxh-dmc-list{
list-style:none;
margin: 0;
padding: 6px 0 10px;
}
nav.fxh-nav .fxh-dmc-item{
display:flex;
align-items:center;
justify-content: space-between;
gap: 10px;
padding: 0;
margin: 0;
}
nav.fxh-nav .fxh-dmc-link{
flex: 1;
display:flex;
align-items:center;
padding: 12px 14px;
text-decoration:none;
font-size: 12px;
letter-spacing: .06em;
text-transform: uppercase;
} nav.fxh-nav .fxh-dmc-item + .fxh-dmc-item{
border-top: 1px solid rgba(0,0,0,.06);
}
nav.fxh-nav .fxh-dmc-next{
width: 40px;
height: 40px;
border: 0;
background: transparent;
cursor: pointer;
display:flex;
align-items:center;
justify-content:center;
padding: 0;
}
nav.fxh-nav .fxh-dmc-next svg{
width: 18px;
height: 18px;
}