/* Version 63 navigation, adapted to the native Shoptet search and basket.
   Enable only after the enhancement has moved every required node successfully.
   This stylesheet alone cannot replace or hide the existing working menu. */
html.vd-native-preview { --vd-v63-css:ready; }
html.vd-native-preview.vd-v63-ready { --vd-v63-admin-offset:0px; --vd-v63-header-height:82px; }
html.vd-native-preview.vd-v63-ready:has(body.admin-logged) { --vd-v63-admin-offset:25px; }
html.vd-native-preview.vd-v63-ready #header { position:sticky!important; top:var(--vd-v63-admin-offset)!important; z-index:100; width:100%; height:var(--vd-v63-header-height)!important; min-height:0!important; margin:0!important; padding:0!important; background:rgba(23,33,28,.975); color:#fff; box-shadow:none; }
html.vd-native-preview.vd-v63-ready #header .navigation-wrapper { position:relative; display:grid!important; grid-template-columns:190px minmax(0,1fr) auto; align-items:center; gap:0; width:100%!important; max-width:none!important; height:var(--vd-v63-header-height)!important; min-height:0!important; margin:0!important; padding:0 max(22px,4vw)!important; border:0; border-bottom:1px solid rgba(255,255,255,.13); background:transparent; box-sizing:border-box; }
html.vd-native-preview.vd-v63-ready #header .navigation-wrapper::before,
html.vd-native-preview.vd-v63-ready #header .navigation-wrapper::after { content:none; }
html.vd-native-preview.vd-v63-ready #navigation,
html.vd-native-preview.vd-v63-ready #header .menu-helper { display:none!important; }
html.vd-native-preview.vd-v63-ready #header .site-name { float:none; width:auto; min-width:0; height:auto; margin:0!important; padding:0!important; }
html.vd-native-preview.vd-v63-ready #header .site-name>a { display:flex!important; align-items:center; gap:13px; width:max-content; max-width:100%; height:auto; margin:0; padding:0; border:0; background:transparent; color:#fff; text-decoration:none; box-shadow:none; }
html.vd-native-preview.vd-v63-ready #header .site-name>a::after { content:none!important; }
html.vd-native-preview.vd-v63-ready #header .site-name img { display:block; width:37px!important; height:37px!important; max-width:37px!important; max-height:37px!important; margin:0; padding:0; border:0; background:transparent; object-fit:contain; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-name { display:block; color:#fff; font:500 16px/1.15 Manrope,Arial,sans-serif; letter-spacing:.18em; white-space:nowrap; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-name small { display:block; margin:5px 0 0; color:var(--vd-sage,#b9c9b2); font-size:8px; font-weight:600; letter-spacing:.13em; }

html.vd-native-preview.vd-v63-ready #header .vd-v63-nav { display:flex; align-self:stretch; align-items:stretch; justify-content:center; gap:clamp(14px,2vw,34px); min-width:0; margin:0; padding:0; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-nav>a,
html.vd-native-preview.vd-v63-ready #header .vd-v63-item>a { position:relative; display:flex; align-items:center; height:100%; margin:0; padding:0; border:0; color:#fff; font:500 11px/1.3 Manrope,Arial,sans-serif; letter-spacing:.06em; text-decoration:none; white-space:nowrap; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-nav>a::after,
html.vd-native-preview.vd-v63-ready #header .vd-v63-item>a::after { position:absolute; right:0; bottom:21px; left:0; height:1px; background:var(--vd-sage,#b9c9b2); content:""; transform:scaleX(0); transition:transform .25s; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-nav>a:hover::after,
html.vd-native-preview.vd-v63-ready #header .vd-v63-item:is(:hover,:focus-within)>a::after { transform:scaleX(1); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-item { position:relative; display:flex; align-items:center; min-width:0; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel { position:absolute; top:calc(100% - 1px); left:50%; z-index:110; box-sizing:border-box; width:290px; padding:11px; border:1px solid var(--vd-line,#d9ded9); background:#fff; color:var(--vd-ink,#17211c); box-shadow:0 22px 48px rgba(12,22,16,.16); visibility:hidden; opacity:0; pointer-events:none; transform:translate(-50%,-7px); transition:opacity .18s,transform .18s,visibility .18s; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-item:is(:hover,:focus-within)>.vd-v63-panel { visibility:visible; opacity:1; pointer-events:auto; transform:translate(-50%,0); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-item:last-child>.vd-v63-panel { right:0; left:auto; transform:translateY(-7px); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-item:last-child:is(:hover,:focus-within)>.vd-v63-panel { transform:translateY(0); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel a { display:block; height:auto; padding:12px 13px; border:0; border-bottom:1px solid #e7eae7; color:var(--vd-ink,#17211c); text-decoration:none; white-space:normal; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel a:last-child { border-bottom:0; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel a:is(:hover,:focus-visible) { background:var(--vd-sage-light,#edf3ea); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel strong { display:block; font:600 11px/1.45 Manrope,Arial,sans-serif; letter-spacing:.025em; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-panel small { display:block; margin-top:4px; color:var(--vd-muted,#5e675f); font:400 9px/1.45 Manrope,Arial,sans-serif; letter-spacing:normal; }

html.vd-native-preview.vd-v63-ready #header .vd-v63-tools { display:flex; align-items:center; gap:7px; min-width:0; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-pro { display:block; margin-right:8px; padding:12px 15px; border:1px solid var(--vd-sage,#b9c9b2); color:var(--vd-sage,#b9c9b2); font:600 11px/1.3 Manrope,Arial,sans-serif; letter-spacing:.1em; white-space:nowrap; text-decoration:none; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search { display:flex; box-sizing:border-box; width:clamp(164px,13vw,210px); height:42px; margin:0; padding:0; border:1px solid rgba(255,255,255,.25); background:rgba(255,255,255,.035); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search:focus-within { border-color:var(--vd-sage,#b9c9b2); background:rgba(255,255,255,.07); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search input { display:block; min-width:0; width:auto; height:auto; flex:1; margin:0; padding:0 6px 0 14px; border:0; border-radius:0; background:transparent; color:#fff; font:500 11px/1 Manrope,Arial,sans-serif; letter-spacing:.02em; box-shadow:none; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search input::placeholder { color:rgba(255,255,255,.66); opacity:1; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search button { display:grid; width:40px; height:auto; flex:0 0 40px; place-items:center; margin:0; padding:0; border:0; border-radius:0; background:transparent; color:#fff; cursor:pointer; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-search svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-tools>.navigation-buttons { position:static!important; display:flex!important; align-items:center; gap:7px; float:none; width:auto!important; height:auto!important; margin:0!important; padding:0!important; background:transparent; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-tools .navigation-buttons>a { position:relative; display:grid!important; box-sizing:border-box; width:42px!important; height:42px!important; min-height:0; place-items:center; float:none; margin:0!important; padding:0!important; border:1px solid rgba(255,255,255,.17)!important; border-radius:0; background:transparent!important; color:#fff; box-shadow:none; text-decoration:none; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-tools .navigation-buttons a[data-target="navigation"],
html.vd-native-preview.vd-v63-ready #header .vd-v63-tools .navigation-buttons .top-nav-button-login,
html.vd-native-preview.vd-v63-ready #header .vd-v63-tools .navigation-buttons a[data-target="search"] { display:none!important; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile-search svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>a.vd-v63-mobile-pro { margin-top:10px; color:var(--vd-sage,#b9c9b2); }
html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure { display:none; }
html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile { display:none; }
html.vd-native-preview.vd-v63-ready #header :is(.vd-v63-nav,.vd-v63-tools) :is(a,summary,button,input):focus-visible { outline:2px solid var(--vd-sage,#b9c9b2); outline-offset:3px; }

/* Keep the desktop composition usable before the version 63 tablet breakpoint. */
@media (min-width:1081px) and (max-width:1280px) {
  html.vd-native-preview.vd-v63-ready #header .navigation-wrapper { grid-template-columns:160px minmax(0,1fr) auto; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-nav { gap:12px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-nav>a,
  html.vd-native-preview.vd-v63-ready #header .vd-v63-item>a { font-size:10px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-search { width:140px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-pro { margin-right:0; padding-inline:10px; font-size:10px; }
}
@media (max-width:1080px) {
  html.vd-native-preview.vd-v63-ready #header .navigation-wrapper { grid-template-columns:minmax(0,1fr) auto; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-nav,
  html.vd-native-preview.vd-v63-ready #header .vd-v63-tools>.vd-v63-search { display:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-tools .navigation-buttons a[data-target="search"] { display:grid!important; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure { display:block; margin:0; padding:0; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary { position:relative; display:grid; box-sizing:border-box; width:42px; height:42px; place-items:center; margin:0; padding:0; border:1px solid rgba(255,255,255,.17); background:transparent; color:#fff; list-style:none; cursor:pointer; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary::-webkit-details-marker { display:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary::before,
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary::after { content:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary>span { position:absolute; width:18px; height:1px; background:#fff; transition:transform .2s; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary>span:first-child { transform:translateY(-4px); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure>summary>span:last-child { transform:translateY(4px); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure[open]>summary>span:first-child { transform:rotate(45deg); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure[open]>summary>span:last-child { transform:rotate(-45deg); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-disclosure[open]>.vd-v63-mobile { position:fixed; top:calc(var(--vd-v63-admin-offset) + var(--vd-v63-header-height)); right:0; left:0; z-index:99; display:flex; box-sizing:border-box; max-height:calc(100vh - var(--vd-v63-admin-offset) - var(--vd-v63-header-height)); max-height:calc(100dvh - var(--vd-v63-admin-offset) - var(--vd-v63-header-height)); flex-direction:column; overflow-y:auto; overscroll-behavior:contain; padding:20px max(24px,4vw) 30px; border-bottom:1px solid rgba(255,255,255,.17); background:var(--vd-forest,#1b2a22); color:#fff; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>form { display:flex; width:100%; height:44px; margin:0 0 12px; padding:0; border:1px solid rgba(255,255,255,.28); background:transparent; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>form input { min-width:0; width:auto; height:auto; flex:1; margin:0; padding:13px 14px; border:0; border-radius:0; background:transparent; color:#fff; font:500 12px/1 Manrope,Arial,sans-serif; box-shadow:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>form input::placeholder { color:rgba(255,255,255,.65); opacity:1; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>form button { width:auto; height:auto; margin:0; padding:0 15px; border:0; border-left:1px solid rgba(255,255,255,.22); border-radius:0; background:transparent; color:var(--vd-sage,#b9c9b2); font:600 9px/1.3 Manrope,Arial,sans-serif; letter-spacing:.09em; text-transform:uppercase; cursor:pointer; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>a,
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details { display:block; margin:0; border-bottom:1px solid rgba(255,255,255,.16); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>a { padding:15px 0; color:#fff; font:400 14px/1.5 Manrope,Arial,sans-serif; text-decoration:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details>summary { position:relative; display:block; padding:15px 32px 15px 0; color:#fff; font:400 14px/1.5 Manrope,Arial,sans-serif; list-style:none; cursor:pointer; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details>summary::-webkit-details-marker { display:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details>summary::after { position:absolute; top:50%; right:5px; color:var(--vd-sage,#b9c9b2); content:"+"; font-size:18px; font-weight:300; transform:translateY(-50%); }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details[open]>summary::after { content:"−"; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details>div { padding:0 0 12px 14px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details a { display:block; padding:10px 0; border:0; color:rgba(255,255,255,.75); font:400 11px/1.5 Manrope,Arial,sans-serif; text-decoration:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-mobile>details a:first-child { color:var(--vd-sage,#b9c9b2); font-weight:600; }
}
@media (max-width:720px) {
  html.vd-native-preview.vd-v63-ready { --vd-v63-header-height:72px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-tools>.vd-v63-pro { display:none; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-name { font-size:13px; }
  html.vd-native-preview.vd-v63-ready #header .vd-v63-name small { margin-top:3px; }
}
@media (prefers-reduced-motion:reduce) {
  html.vd-native-preview.vd-v63-ready #header :is(.vd-v63-panel,.vd-v63-disclosure>summary>span,.vd-v63-nav>a::after,.vd-v63-item>a::after) { transition:none; }
}
