/* Off-canvas shell */
.sbh-overlay{position:fixed;inset:0;background:rgba(0,0,0,.4);opacity:0;pointer-events:none;transition:opacity .2s;z-index:9998}
.sbh-drawer{position:fixed;top:0;left:0;height:100%;width:min(90vw,320px);background:#fff;box-shadow:2px 0 16px rgba(0,0,0,.15);transform:translateX(-100%);transition:transform .25s;z-index:9999;display:flex;flex-direction:column;padding:16px;gap:12px}
.sbh-drawer .sbh-close{align-self:flex-end;font-size:28px;background:0;border:0;line-height:1;cursor:pointer}
.sbh-nav .sbh-menu{list-style:none;margin:0;padding:0}
.sbh-nav .sbh-menu li{border-bottom:1px solid rgba(0,0,0,.06)}
.sbh-nav .sbh-menu a{display:block;padding:12px 8px;text-decoration:none}

/* Open state */
.sbh-open .sbh-drawer{transform:translateX(0)}
.sbh-open .sbh-overlay{opacity:1;pointer-events:auto}

/* Collapse logic */
.hide-smart-hamburger .smart-hamburger{display:none!important;}
.smart-collapsed .smart-hamburger{display:inline-flex!important;align-items:center;gap:8px;cursor:pointer}
.smart-collapsed .smart-menu{visibility:hidden!important;opacity:0;height:0;overflow:hidden}


/* Allow the left drawer to scroll internally */
.sbh-drawer{
  position:fixed;
  top:0; left:0;
  height:100%;
  width:min(90vw,320px);
  background:#fff;
  box-shadow:2px 0 16px rgba(0,0,0,.15);
  transform:translateX(-100%);
  transition:transform .25s;
  z-index:99999;
  display:flex;
  flex-direction:column;
  padding:16px;
  gap:12px;

  /* NEW ↓ */
  overflow-y:auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.sbh-nav{
  /* NEW: let the menu area grow & scroll */
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
}

/* Overlay stays above the page but below drawer */
.sbh-overlay{ z-index:99998; }



/* Baseline: never show custom toggle unless JS says so */
.smart-hamburger{ display:none !important; }

/* When we detect wrap on wide screens, we show it */
.smart-collapsed .smart-hamburger{
  display:inline-flex !important;
  align-items:center;
  gap:8px;
  cursor:pointer;
}

/* Guard: on small screens, always hide our custom hamburger.
   Brizy's native mobile toggle should handle those. */
@media (max-width: 991px){
  .smart-hamburger{ display:none !important; }
}

/* Our hamburger hidden at 1024px and below */
@media (max-width: 1024px){
  .smart-hamburger{ display:none !important; }
}



/* Accordion basics */
.sbh-nav .sbh-menu,
.sbh-nav .sbh-menu .sub-menu{ list-style:none; margin:0; padding:0; }

.sbh-nav .menu-item-has-children{ position:relative; }
.sbh-nav .menu-item-has-children > a{
  display:block; padding-right:36px; /* room for toggle */
}

/* Toggle button (inserts after the link) */
.sbh-toggle{
  position:absolute; right:8px; top:50%; transform:translateY(-50%);
  width:28px; height:28px; border:0; background:transparent; cursor:pointer;
  line-height:1; font-size:18px;
}
.sbh-toggle:before{ content:"▸"; }
.sbh-nav li.is-open > .sbh-toggle:before{ content:"▾"; }

/* Submenu animation */
.sbh-nav .sub-menu{
  margin-left:10px; border-left:1px solid rgba(0,0,0,.06);
  overflow:hidden; max-height:0; transition:max-height .25s ease;
}
.sbh-nav li.is-open > .sub-menu{ /* JS also sets exact height for smoother anim */
  max-height:1000px;
}

/* Keep drawer scrollable (from earlier fix) */
.sbh-drawer{ overflow-y:auto; -webkit-overflow-scrolling:touch; }
.sbh-nav{ flex:1 1 auto; min-height:0; overflow-y:auto; }


/* Parent row = link + arrow, Submenu = next row */
.sbh-nav .menu-item-has-children{
  display:grid;
  grid-template-columns: 1fr 28px; /* text | arrow */
  grid-auto-rows:min-content;
  align-items:center;
}

/* Parent link sits in col 1 */
.sbh-nav .menu-item-has-children > a{
  grid-column:1;
  padding-right:0;              /* no need for extra padding now */
}

/* Arrow sits in col 2 (no absolute positioning) */
.sbh-toggle{
  grid-column:2;
  position:static;
  width:28px; height:28px;
  border:0; background:transparent;
  display:inline-flex; align-items:center; justify-content:center;
  cursor:pointer; line-height:1; font-size:18px;
}
.sbh-toggle:before{ content:"▸"; }
.sbh-nav li.is-open > .sbh-toggle:before{ content:"▾"; }

/* Submenu spans full width on its own row */
.sbh-nav .sub-menu{
  grid-column:1 / -1;
  margin-left:10px; border-left:1px solid rgba(0,0,0,.06);
  overflow:hidden; max-height:0; transition:max-height .25s ease;
}
.sbh-nav li.is-open > .sub-menu{ max-height:1000px; } /* JS sets exact height too */
