/* Mobile sidebar: Solutions uppercase + Products nested accordion */
/* Scope: #main-menu off-canvas only */

/* Solutions L2 titles: same style (Protein / Vaccine / CGT / Traditional) */
#main-menu .menu-item-1302 > .sub-menu > .menu-item > a {
  text-transform: uppercase !important;
  font-weight: 700 !important;
  font-size: 1em !important;
  letter-spacing: normal !important;
  line-height: 1.6 !important;
  color: #fff !important;
  opacity: 1 !important;
}

/* Products typography hierarchy on mobile */
/* L1 = Products top row (theme default ~16px) */

/* L2 list only when Products is open */
#main-menu .menu-item-4529:not(.active) > .sub-menu {
  display: none !important;
}

/* L2: Cell Culture / Single-Use / Filtration / Cleanroom — unified, smaller than L1 */
#main-menu .menu-item-4529 > .sub-menu > .menu-item > a {
  font-size: 14px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  line-height: 1.45 !important;
  color: #fff !important;
  opacity: 1 !important;
}

/* L3: under each L2 category — unified, clearly smaller than L2 */
#main-menu .menu-item-4529 > .sub-menu > .menu-item > .sub-menu > .menu-item > a {
  font-size: 12px !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.02em !important;
  line-height: 1.45 !important;
  color: rgba(255, 255, 255, 0.88) !important;
  opacity: 1 !important;
}

/* L4: product names — smaller, normal case */
#main-menu .menu-item-4529 > .sub-menu > .menu-item > .sub-menu > .menu-item > .sub-menu > .menu-item > a {
  font-size: 12px !important;
  font-weight: 400 !important;
  text-transform: none !important;
  letter-spacing: normal !important;
  line-height: 1.45 !important;
  color: rgba(255, 255, 255, 0.75) !important;
}


/* Hide nested L3/L4 until that row is active */
#main-menu .menu-item-4529 .sub-menu .sub-menu {
  display: none !important;
}

#main-menu .menu-item-4529 li.active > .sub-menu {
  display: block !important;
}

/* Nested rows under Products (not the Products top row itself) */
#main-menu .menu-item-4529 > .sub-menu li.has-child,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children {
  position: relative !important;
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  width: 100% !important;
}

#main-menu .menu-item-4529 > .sub-menu li.has-child > a,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children > a {
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding-right: 8px !important;
}

#main-menu .menu-item-4529 > .sub-menu li.has-child > .toggle,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children > .toggle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 48px !important;
  width: 48px !important;
  min-width: 48px !important;
  height: 44px !important;
  margin: 0 !important;
  padding: 0 !important;
  opacity: 1 !important;
  color: #fff !important;
  order: 2 !important;
  position: relative !important;
  z-index: 2 !important;
  /* Prevent Flatsome .active>.toggle{rotate(-180deg)} from cancelling icon flip */
  transform: none !important;
}

/* Clear icon-font glyph; draw a reliable chevron */
#main-menu .menu-item-4529 > .sub-menu li.has-child > .toggle i,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children > .toggle i {
  font-size: 0 !important;
  width: 10px !important;
  height: 10px !important;
  border-right: 2px solid #fff !important;
  border-bottom: 2px solid #fff !important;
  transform: rotate(45deg) translateY(-3px) !important; /* down */
  display: block !important;
  opacity: 1 !important;
  color: transparent !important;
  transition: transform 0.2s ease !important;
}

/* Expanded: point up */
#main-menu .menu-item-4529 > .sub-menu li.has-child.active > .toggle,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children.active > .toggle {
  transform: none !important;
}

#main-menu .menu-item-4529 > .sub-menu li.has-child.active > .toggle i,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children.active > .toggle i {
  transform: rotate(-135deg) translateY(-1px) !important; /* up */
}

#main-menu .menu-item-4529 > .sub-menu li.has-child > .sub-menu,
#main-menu .menu-item-4529 > .sub-menu li.menu-item-has-children > .sub-menu {
  flex: 0 0 100% !important;
  width: 100% !important;
  order: 3 !important;
}