/* ============================================
   ICB Navbar — Dark Modern Theme
   Background: #2d3748 (antracit)
   Accent: primary-500 (#667eea)
   Font: Inter
   ============================================ */

ul.us_menu {
  display: block;
  list-style: none;
  padding-left: 0;
  background: #2d3748;
  margin: 0;
  padding: 0;
  font-family: 'Inter', system-ui, sans-serif;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  position: relative;
  z-index: 50;
}

ul.us_menu::after {
  clear: both;
}

ul.us_menu .us_brand {
  padding-top: 0.3125rem;
  padding-bottom: 0.3125rem;
  margin-right: 1rem;
  font-size: 1.25rem;
  text-decoration: none;
  white-space: nowrap;
}

ul.us_menu .us_brand img {
  height: 32px;
  width: auto;
}

ul.us_menu li.dropdown .caret::after {
  font-size: inherit;
  color: inherit;
  display: inline-block;
  margin-left: 4px;
}

ul.us_menu li {
  display: block;
  white-space: nowrap;
}

ul.us_menu .dropdown-divider {
  height: 0;
  margin: 0.4rem 0.75rem;
  overflow: hidden;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  background-color: transparent;
}

ul.us_menu li > a {
  padding: 6px 14px;
  text-decoration: none;
  display: block;
  cursor: pointer;
  color: rgba(255, 255, 255, 0.85);
  font-size: 0.8125rem;
  font-weight: 500;
  border-radius: 6px;
  transition: all 200ms ease;
}

ul.us_menu li a i,
ul.us_menu li a span:first-child
{
  display: inline-block;
  margin-right: 8px;
  font-size: 0.75rem;
}

ul.us_menu li:hover {
  transition: all 200ms ease;
  background-color: transparent;
}

ul.us_menu li:hover > a {
  background-color: rgba(255, 255, 255, 0.1);
  color: #fff;
}

/* Submenu */
ul.us_sub-menu {
  padding: 6px;
  background: #1a202c;
  position: absolute;
  display: none;
  float: right;
  top: 0;
  left: 100%;
  z-index: 50;
  border: 1px solid rgba(255, 255, 255, 0.08);
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);
  min-width: 200px;
}

ul.us_sub-menu li > a {
  padding: 6px 12px;
  border-radius: 5px;
  font-size: 0.8125rem;
}

ul.us_sub-menu li:hover > a {
  background-color: rgba(255, 255, 255, 0.08);
}

.us_menu_backdrop {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.us_menu_mobile_wrapper {
  display: none;
  justify-content: space-between;
  align-items: center;
  padding: 8px 16px;
}

.us_brand.full_screen {
  padding: 5px 16px;
}

.us_menu_mobile_control i {
  font-size: 1.5rem;
  color: rgba(255, 255, 255, 0.9);
  transition: color 200ms ease;
}

.us_menu_mobile_control:hover i {
  color: #fff;
}

/* //////////////////// Horizontal //////////////////// */

ul.us_menu.horizontal {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: 6px 16px;
}

ul.us_menu.horizontal .us_sub-menu {
  left: 0;
  top: 100%;
  margin-top: 4px;
}

ul.us_menu.horizontal .us_sub-menu.us_deep-sub-menu {
  left: 100%;
  top: 0;
  margin-top: 0;
  margin-left: 4px;
}

ul.us_menu.horizontal .us_menu_mobile_wrapper {
  padding: 0px;
  flex-wrap: wrap;
}

/* /////////////// Accordion ///////////// */
ul.us_menu.accordion .us_sub-menu {
  position: relative;
  top: unset;
  left: unset;
  display: none;
  float: unset;
  padding-left: 16px;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: none;
  border: none;
  border-radius: 0;
  margin-top: 0;
}

ul.us_sub-menu.show, ul.us_menu.accordion .us_sub-menu.show {
  display: block;
}

/* /////////////// Dark Theme (overrides) /////////////// */
ul.us_menu.dark {
  background-color: #2d3748;
}

ul.us_menu.dark .us_sub-menu li,
ul.us_menu.dark li:hover {
  background-color: transparent;
}

ul.us_menu.dark ul.us_sub-menu {
  background-color: #1a202c;
}

ul.us_menu.dark a, ul.us_menu.dark .us_menu_mobile_control {
  color: rgba(255, 255, 255, 0.85);
  border-radius: 6px;
}

ul.us_menu.dark li:hover > a {
  color: #fff;
  background-color: rgba(255, 255, 255, 0.1);
}

ul.us_menu.dark li.active-style > a {
  color: #fff;
  background-color: #667eea;
}

ul.us_menu.dark .us_sub-menu,
ul.us_menu.accordion .us_sub-menu {
  border-color: rgba(255, 255, 255, 0.1);
}

ul.us_menu.dark .dropdown-divider {
  border-color: rgba(255, 255, 255, 0.15);
}

/* /////////////// Responsive — Mobile /////////////// */
@media screen and (max-width: 992px) {
  .us_menu_mobile_wrapper {
    display: flex;
  }
  ul.us_menu.horizontal {
    display: block;
  }
  ul.us_menu.horizontal > li {
    display: none;
  }

  ul.us_menu .us_brand.full_screen {
    display: none;
  }

  ul.us_menu.horizontal.expanded > li {
    display: block;
  }

  ul.us_menu.horizontal .us_sub-menu,
  ul.us_menu.horizontal .us_sub-menu.us_deep-sub-menu {
    width: 100%;
    left: 0;
    top: 100%;
    border: none;
    border-radius: 0;
    margin-top: 0;
    box-shadow: none;
    background: #1a202c;
  }

  ul.us_menu:not(.horizontal) {
    transition: all 750ms ease-in-out;
    overflow: hidden;
  }

  ul.us_menu:not(.horizontal):not(.expanded) .us_menu_mobile_wrapper {
    padding-left: 5px;
  }

  ul.us_menu:not(.horizontal):not(.expanded) .us_brand {
    display: none;
  }

  ul.us_menu:not(.horizontal):not(.expanded) .labelText {
    display: none;
  }

  ul.us_menu:not(.horizontal):not(.expanded) i {
    font-size: 1.25rem;
    padding-left: 2px;
  }

  ul.us_menu:not(.horizontal) .us_sub-menu,
  ul.us_menu:not(.horizontal) .us_deep-sub-menu
  {
    position: relative;
    border: none;
    left: unset;
    top: unset;
    float: unset;
    border-radius: 0;
    box-shadow: none;
  }

  ul.us_menu:not(.horizontal) > li a {
    transition: all 750ms ease-in-out;
  }

  ul.us_menu:not(.horizontal):not(.expanded) > li a {
    padding-left: 5px;
    font-size: 28px;
  }

  ul.us_menu.expanded:not(.horizontal) {
    width: 280px;
  }
}

.caret {
  margin-left: .25rem;
}

.additional-mobile-icons {
  position: absolute;
  right: 3.0rem;
}