/* Darkshop Smart Nav — Mobile Menu v4.0.3 */
/* 1:1 kopie van sidebar stijlen */

.dsm,.dsm-overlay,.dsm-panel{display:none}

@media(max-width:768px){

#group-icon-header{display:none!important;visibility:hidden!important}
body.menu-mobile-active{overflow:auto!important}
body.menu-mobile-active::before,body.menu-mobile-active::after{display:none!important}

.dsm{display:block;position:fixed;inset:0;z-index:99999;pointer-events:none}
.dsm.dsm-open{pointer-events:auto}
.dsm-overlay{display:block;position:absolute;inset:0;background:rgba(0,0,0,.4);opacity:0;transition:opacity .25s;pointer-events:none}
.dsm.dsm-open .dsm-overlay{opacity:1;pointer-events:auto}

/* Panel — exact sidebar container */
.dsm-panel{
    display:flex;flex-direction:column;
    position:absolute;top:0;bottom:0;left:0;
    width:85%;max-width:340px;
    background:#fafafa;
    font-family:'Outfit',system-ui,sans-serif;
    font-size:14px;color:#3a2035;
    transform:translateX(-100%);
    transition:transform .3s cubic-bezier(.4,0,.2,1);
    overflow:hidden;
    border-right:1px solid #e0e0e0;
}
.dsm-panel *{box-sizing:border-box;margin:0;padding:0}
.dsm.dsm-open .dsm-panel{transform:translateX(0)}

/* Header — exact .dcs-sidebar__header */
.dsm-header{
    display:flex;align-items:center;gap:10px;
    padding:env(safe-area-inset-top,20px) 18px 14px;background:#1a1a1a;flex-shrink:0;
}
.dsm-header__title{flex:1;font-size:14px;font-weight:700;color:#fff;text-transform:uppercase;letter-spacing:.8px}
.dsm-close{display:flex;background:none;border:none;color:rgba(255,255,255,.5);cursor:pointer;padding:4px;-webkit-tap-highlight-color:transparent}

/* Main panel */
.dsm-main{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;transition:transform .25s,opacity .2s}
.dsm-main.dsm-hidden{transform:translateX(-30%);opacity:0;pointer-events:none;position:absolute;top:52px;left:0;right:0;bottom:0}

/* Cat rij — exact .dcs-group--link a */
.dsm-cat{
    display:flex!important;align-items:center;width:100%;
    padding:12px 18px;gap:6px;
    background:transparent;border:none;border-bottom:1px solid #e0e0e0;
    cursor:pointer;text-decoration:none!important;text-align:left;
    font-family:'Outfit',system-ui,sans-serif!important;
    font-size:13px!important;font-weight:700!important;color:#3a2035!important;
    text-transform:uppercase;letter-spacing:.3px;
    -webkit-tap-highlight-color:transparent;
    transition:background 120ms;
    list-style:none!important;
    border-radius:0!important;
}
.dsm-cat:last-child{border-bottom:none}
.dsm-cat:hover,.dsm-cat:active{background:#efefef!important;color:#e8772e!important}
.dsm-cat:hover .dsm-chevron,.dsm-cat:active .dsm-chevron{transform:translateX(3px);color:#e8772e}
.dsm-cat span{flex:1}
.dsm-chevron{color:#aaa;flex-shrink:0;transition:transform 120ms,color 120ms}

/* Actieve cat — left border, geen rounded pill */
.dsm-cat--active{border-left:3px solid #e8772e!important;background:rgba(232,119,46,.05)!important;color:#e8772e!important;border-radius:0!important}
.dsm-cat--niche{border-left:3px solid #e8772e!important;background:rgba(232,119,46,.05)!important;border-radius:0!important}
.dsm-cat--niche span{color:#e8772e!important}

/* USPs — exact .dcs-usps */
.dsm-usps{display:flex;flex-direction:column;gap:5px;padding:12px 18px;border-top:1px solid #e0e0e0;background:#f8f8f8;margin-top:auto}
.dsm-usp{display:flex;align-items:center;gap:8px;font-size:12px;color:#363636}

/* Voice search knop in header */
.dsm-voice{
    display:none;align-items:center;justify-content:center;
    background:none;border:none;color:rgba(255,255,255,.5);
    cursor:pointer;padding:4px;margin-left:auto;
    -webkit-tap-highlight-color:transparent;
    transition:color 120ms;
}
.dsm-voice:hover,.dsm-voice:active{color:#e8772e}

/* Voice feedback bar */
.dsm-voice-bar{
    display:none;align-items:center;gap:10px;
    padding:10px 18px;background:#e8772e;
    font-family:'Outfit',system-ui,sans-serif;
}
.dsm-voice-bar--active{display:flex!important}
.dsm-voice-bar__dot{
    width:10px;height:10px;border-radius:50%;background:#fff;
    animation:dsm-pulse 1s ease-in-out infinite;flex-shrink:0;
}
@keyframes dsm-pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.7)}}
.dsm-voice-bar__text{flex:1;font-size:13px;color:#fff;font-weight:500}
.dsm-voice-bar__stop{
    background:rgba(255,255,255,.2);border:none;border-radius:6px;
    padding:4px 12px;font-size:12px;color:#fff;font-weight:600;
    cursor:pointer;font-family:'Outfit',system-ui,sans-serif;
}

/* Recent bekeken — exact .dcs-recent */
.dsm-recent{padding:14px 18px;border-bottom:1px solid #e0e0e0;background:#fff}
.dsm-recent__title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#888;margin-bottom:10px;font-family:'Outfit',system-ui,sans-serif}
.dsm-recent__grid{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;padding-bottom:4px}
.dsm-recent__grid::-webkit-scrollbar{display:none}
.dsm-recent__item{flex-shrink:0;width:62px;text-align:center;text-decoration:none!important;color:#3a2035}
.dsm-recent__img{width:56px;height:56px;border-radius:8px;object-fit:cover;background:#f2f2f2;border:1px solid #e0e0e0;margin:0 auto 4px;display:block}
.dsm-recent__price{font-size:11px;font-weight:700;color:#e8772e;display:block;font-family:'Outfit',system-ui,sans-serif}
.dsm-recent__name{font-size:10px;color:#666;line-height:1.2;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;font-family:'Outfit',system-ui,sans-serif}

/* Sub panel */
.dsm-sub{
    position:absolute;top:52px;left:0;right:0;bottom:0;
    overflow-y:auto;-webkit-overflow-scrolling:touch;
    background:#fafafa;
    transform:translateX(100%);opacity:0;
    transition:transform .25s,opacity .2s;
    pointer-events:none;
}
.dsm-sub.dsm-visible{transform:translateX(0);opacity:1;pointer-events:auto}

/* Terug knop — platte balk, geen pill */
.dsm-back{
    display:flex;align-items:center;gap:8px;width:100%;
    padding:12px 18px;margin:0;
    background:#1a1a1a;border:none;border-radius:0!important;cursor:pointer;
    font-family:'Outfit',system-ui,sans-serif;
    -webkit-tap-highlight-color:transparent;
}
.dsm-back svg{color:#e8772e;flex-shrink:0}
.dsm-back__nav{font-size:13px;font-weight:500;color:rgba(255,255,255,.7);letter-spacing:.3px}

/* Categorie titel — apart blok onder de terug knop */
.dsm-sub__title{
    padding:16px 18px 12px;
    font-family:'Outfit',system-ui,sans-serif;
    font-size:14px;font-weight:700;color:#3a2035;
    text-transform:uppercase;letter-spacing:.8px;
    border-bottom:1px solid #e0e0e0;
}

/* Bekijk alle */
.dsm-viewall{
    display:block;padding:12px 18px;border-bottom:1px solid #e0e0e0;
    font-family:'Outfit',system-ui,sans-serif;
    font-size:13px;color:#e8772e!important;font-weight:600;text-decoration:none!important;
    transition:background 120ms;
}
.dsm-viewall:hover,.dsm-viewall:active{background:#efefef}

/* Groepen — meer ruimte */
.dsm-group{border-bottom:1px solid #e0e0e0}
.dsm-group:last-child{border-bottom:none}
.dsm-group__head{
    display:flex;align-items:center;width:100%;
    padding:14px 18px;gap:6px;
    background:transparent;border:none;cursor:pointer;
    font-family:'Outfit',system-ui,sans-serif;
    font-size:13px;font-weight:700;color:#3a2035;
    text-transform:uppercase;letter-spacing:.3px;
    -webkit-tap-highlight-color:transparent;
    transition:background 120ms;
}
.dsm-group__head:hover,.dsm-group__head:active{background:#efefef}
.dsm-group__head span{flex:1;text-align:left}
.dsm-group__arrow{color:#aaa;transition:transform 200ms;flex-shrink:0}
.dsm-group--open .dsm-group__arrow{transform:rotate(180deg)}
.dsm-group--open .dsm-group__head{color:#e8772e}
.dsm-group--active>.dsm-group__head{border-left:3px solid #e8772e;background:rgba(232,119,46,.05);color:#e8772e}

/* Items — exact .dcs-item a — GEEN bullets */
.dsm-group__list{list-style:none!important;margin:0!important;padding:0 0 4px!important;background:#fafafa;overflow:hidden;max-height:0;transition:max-height .25s ease}
.dsm-group--open .dsm-group__list{max-height:800px}
.dsm-group__list li{list-style:none!important;margin:0!important;padding:0!important}
.dsm-group__list li::before,.dsm-group__list li::marker{display:none!important;content:none!important}
.dsm-group__list li a{
    display:flex!important;align-items:center;gap:6px;
    padding:10px 18px 10px 30px!important;
    color:#363636!important;text-decoration:none!important;
    font-family:'Outfit',system-ui,sans-serif!important;
    font-size:14px!important;font-weight:400!important;
    border-left:3px solid transparent;
    transition:background 120ms;
    text-transform:none!important;letter-spacing:0!important;
}
.dsm-group__list li a:hover,.dsm-group__list li a:active{background:#efefef!important}
.dsm-group__list li.dsm-item--active a{color:#e8772e!important;font-weight:700!important;background:rgba(232,119,46,.05)!important;border-left-color:#e8772e!important}

/* Niche items — zelfde als cat links */
.dsm-sub .dsm-cat{text-transform:none!important;font-weight:500!important;font-size:14px!important}

}