// Sub menus
// ---------------------------
.dropdown-submenu {
  position: relative;
}
// Default dropdowns
.dropdown-submenu > .dropdown-menu {
  top: 0;
  left: 100%;
  margin-top: -6px;
  margin-left: -1px;
}
.dropdown-submenu:hover > .dropdown-menu {
  display: block;
}

// Caret to indicate there is a submenu
.dropdown-submenu > a:after {
  display: block;
  content: " ";
  float: right;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
  border-width: 5px 0 5px 5px;
  border-left-color: darken($body-bg, 20%);
  margin-right: -5px;
  margin-top: 3.3px;
  color: $dropdown-link-color;
  line-height: $line-height-base;
}
.dropdown-submenu:hover > a:after {
  color: $dropdown-link-active-color !important;
}

.dropdown-submenu:hover > a {
  text-decoration: none;
  color: $dropdown-link-hover-color;
  background-color: $dropdown-link-hover-bg;
}

// Additional dropdown features

.navbar-hq-main-menu {
  .dropdown-menu {
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
  }

  .dropdown-menu > li > a:hover,
  .dropdown-menu > li > a:focus,
  .dropdown-menu > li button:hover,
  .dropdown-menu > li button:focus {
    background-color: $brand-primary;
    color: #ffffff;
  }

  .dropdown-menu .login-container {
    padding: 2px 20px 5px;
  }

  .dropdown-menu .dropdown-icon {
    margin-right: 4px;
  }

  .dropdown-menu[data-bs-popper].dropdown-menu-right {
    left: auto;
    right: 0;
  }

  .dropdown-header {
    text-transform: uppercase;
    font-weight: bold;
    margin-top: 5px;
  }

  .navbar-nav > li > a.dropdown-toggle-with-icon {
    padding-top: 22px !important;
    padding-bottom: 17px !important;
  }

  .nav-settings-bar .dropdown-toggle-with-icon.nav-link::after {
    display: none;
  }

  .dropdown-toggle::after {
    vertical-align: 2.48px;
    margin-left: 2px;
  }
}

@media (max-width: map-get($grid-breakpoints, "lg")) {
  .navbar-hq-main-menu {

    .dropdown-menu {
      box-shadow: none;
    }
  }
}
