:root{
  --jb-sn-black:var(--black-color,#3A3A3A);
  --jb-sn-white:var(--white-color,#FFF9EC);
  --jb-sn-collapsed:54px;
  --jb-sn-open:320px;
  --jb-sn-mobile-top:70px;
}

/* MioWeb builder renders the page inside an iframe while also rendering the outer editor page. */
body.mw_builder_body.jb-section-nav-enabled,
body.mw_builder_body.jb-section-nav-enabled.jb-section-nav-collapsed,
body.mw_builder_body.jb-section-nav-enabled.jb-section-nav-expanded{
  padding-left:0!important;
}
body.mw_builder_body #jb-section-navigation{display:none!important}

#jb-section-navigation,
#jb-section-navigation *,
#jb-section-navigation *::before,
#jb-section-navigation *::after{
  box-sizing:border-box;
}

#jb-section-navigation{
  position:fixed!important;
  inset:0 auto 0 0!important;
  z-index:99990!important;
  width:var(--jb-sn-collapsed)!important;
  height:100dvh!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:var(--jb-sn-black)!important;
  color:var(--jb-sn-white)!important;
  font-family:inherit!important;
  font-size:16px!important;
  font-style:normal!important;
  line-height:1.35!important;
  text-align:left!important;
  text-transform:none!important;
  letter-spacing:normal!important;
  box-shadow:2px 0 14px rgba(0,0,0,.18)!important;
  transition:width .22s ease!important;
}
#jb-section-navigation.is-open{width:var(--jb-sn-open)!important}
#jb-section-navigation.is-open .jb-sn-toggle{display:none!important}

#jb-section-navigation button,
#jb-section-navigation a,
#jb-section-navigation strong,
#jb-section-navigation span,
#jb-section-navigation div,
#jb-section-navigation nav{
  font-family:inherit!important;
  text-transform:none!important;
  letter-spacing:normal!important;
}

#jb-section-navigation .jb-sn-toggle{
  position:absolute!important;
  inset:0 auto auto 0!important;
  width:var(--jb-sn-collapsed)!important;
  height:58px!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  outline:0;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  font-size:24px!important;
  font-weight:400!important;
  line-height:1!important;
  cursor:pointer!important;
  display:grid!important;
  place-items:center!important;
  box-shadow:none!important;
  appearance:none!important;
  z-index:2!important;
}
#jb-section-navigation .jb-sn-toggle-icon{color:var(--jb-sn-white)!important;line-height:1!important}

#jb-section-navigation .jb-sn-panel{
  position:absolute!important;
  inset:0!important;
  margin:0!important;
  padding:0!important;
  display:flex!important;
  flex-direction:column!important;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .15s ease!important;
}
#jb-section-navigation.is-open .jb-sn-panel{opacity:1;visibility:visible;pointer-events:auto}

#jb-section-navigation .jb-sn-panel-head{
  height:58px!important;
  min-height:58px!important;
  display:flex!important;
  align-items:center!important;
  gap:12px!important;
  margin:0!important;
  padding:0 16px 0 18px!important;
  border:0!important;
  border-bottom:1px solid rgba(255,249,236,.14)!important;
  background:transparent!important;
  flex:0 0 auto!important;
}
#jb-section-navigation .jb-sn-panel-head strong{
  display:block!important;
  flex:1!important;
  margin:0!important;
  padding:0!important;
  color:var(--jb-sn-white)!important;
  background:transparent!important;
  font-size:16px!important;
  font-weight:700!important;
  line-height:1.2!important;
  text-decoration:none!important;
  text-shadow:none!important;
}
#jb-section-navigation .jb-sn-close{
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:4px!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  font-size:28px!important;
  font-weight:400!important;
  line-height:1!important;
  cursor:pointer!important;
  box-shadow:none!important;
  appearance:none!important;
}

#jb-section-navigation .jb-sn-nav{
  display:block!important;
  flex:1!important;
  min-height:0!important;
  margin:0!important;
  padding:12px 10px 24px!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  overscroll-behavior:contain!important;
  scrollbar-width:thin;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
}

#jb-section-navigation .jb-sn-link,
#jb-section-navigation .jb-sn-post-link{
  display:block!important;
  width:auto!important;
  margin:0!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  font-style:normal!important;
  line-height:1.35!important;
  text-align:left!important;
  text-decoration:none!important;
  text-shadow:none!important;
  box-shadow:none!important;
}
#jb-section-navigation .jb-sn-link{padding:10px 12px!important;font-size:16px!important;font-weight:600!important;margin:2px 0!important}
#jb-section-navigation .jb-sn-post-link{padding:7px 10px 7px 12px!important;font-size:15px!important;font-weight:400!important;margin:1px 0!important}
#jb-section-navigation .jb-sn-link:hover,
#jb-section-navigation .jb-sn-post-link:hover,
#jb-section-navigation .jb-sn-category-toggle:hover{background:rgba(255,249,236,.10)!important;color:var(--jb-sn-white)!important}
#jb-section-navigation .jb-sn-link.is-active,
#jb-section-navigation .jb-sn-post-link.is-active{background:var(--jb-sn-white)!important;color:var(--jb-sn-black)!important}

#jb-section-navigation .jb-sn-group-title{
  display:block!important;
  margin:0!important;
  padding:15px 12px 6px!important;
  border:0!important;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  font-size:12px!important;
  font-weight:700!important;
  line-height:1.3!important;
  letter-spacing:.08em!important;
  text-transform:uppercase!important;
  opacity:.7!important;
}
#jb-section-navigation .jb-sn-category{display:block!important;margin:2px 0!important;padding:0!important;border:0!important;background:transparent!important}
#jb-section-navigation .jb-sn-category-toggle{
  width:100%!important;
  min-width:0!important;
  min-height:0!important;
  margin:0!important;
  padding:9px 10px 9px 12px!important;
  border:0!important;
  border-radius:5px!important;
  background:transparent!important;
  color:var(--jb-sn-white)!important;
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
  text-align:left!important;
  font-size:16px!important;
  font-weight:600!important;
  line-height:1.35!important;
  cursor:pointer!important;
  box-shadow:none!important;
  appearance:none!important;
}
#jb-section-navigation .jb-sn-category-toggle>span:first-child{flex:1!important;color:var(--jb-sn-white)!important}
#jb-section-navigation .jb-sn-chevron{display:inline-block!important;color:var(--jb-sn-white)!important;transition:transform .18s ease!important;font-size:20px!important;line-height:1!important}
#jb-section-navigation .jb-sn-category.is-open>.jb-sn-category-toggle .jb-sn-chevron{transform:rotate(90deg)!important}
#jb-section-navigation .jb-sn-category-children{display:none!important;margin:0!important;padding:0 0 0 10px!important;border:0!important;background:transparent!important}
#jb-section-navigation .jb-sn-category.is-open>.jb-sn-category-children{display:block!important}
#jb-section-navigation .jb-sn-category-children>.jb-sn-category>.jb-sn-category-toggle{font-size:15px!important;font-weight:500!important}

body.jb-section-nav-enabled{transition:padding-left .22s ease}
body.jb-section-nav-enabled.jb-section-nav-collapsed{padding-left:var(--jb-sn-collapsed)!important}
body.jb-section-nav-enabled.jb-section-nav-expanded{padding-left:var(--jb-sn-open)!important}

@media(max-width:782px){
  body.jb-section-nav-enabled,
  body.jb-section-nav-enabled.jb-section-nav-collapsed,
  body.jb-section-nav-enabled.jb-section-nav-expanded{padding-left:0!important}

  /* Mobile: keep the collapsed section-navigation handle below the site header.
     Override --jb-sn-mobile-top in site CSS if a specific layout needs another offset. */
  #jb-section-navigation{
    top:var(--jb-sn-mobile-top)!important;
    width:var(--jb-sn-collapsed)!important;
    height:58px!important;
    bottom:auto!important;
  }
  #jb-section-navigation.is-open{
    top:0!important;
    width:min(88vw,340px)!important;
    height:100dvh!important;
  }
}