/* Wider sub-menu and improved positioning */
.main-menu > ul > li.menu-item-has-children > ul.sub-menu {
  min-width: 250px; /* Increased from 200px */
  top: 95%; /* Adjusted from 110% to position higher */
  z-index: 1000; /* Ensure it appears on top */
}

/* Ensure sub-menu appears on top of parent menu item on hover */
.main-menu > ul > li.menu-item-has-children:hover > ul.sub-menu {
  top: 90%; /* Adjusted from 100% to position higher */
}

/* Ensure nested sub-menus are also wider */
.main-menu > ul ul {
  min-width: 250px; /* Increased from 200px */
}

/* Improve positioning of nested sub-menus */
.main-menu > ul > li.menu-item-has-children > ul.sub-menu > li.menu-item-has-children > ul.sub-menu {
  left: 250px; /* Adjusted from 208px to match the new width */
}

/* Fix for sub-menu visibility */
@media (min-width: 1024px) {
  /* Ensure sub-menus are properly displayed on hover */
  .main-menu > ul > li.menu-item-has-children:hover > ul.sub-menu,
  .main-menu > ul > li.menu-item-has-children > ul.sub-menu > li.menu-item-has-children:hover > ul.sub-menu {
    visibility: visible;
    opacity: 1;
    z-index: 1000; /* Ensure it appears on top */
  }

  /* Ensure the parent menu item is positioned relatively */
  .main-menu > ul > li.menu-item-has-children {
    position: relative;
  }
}