.mmui-dropdown a {
  color: black;
}

// The dropdown menu
.mmui-dropdown-menu {
  background-clip: padding-box;
  box-shadow: $mm-boxshadow;
  border: none;
  border-radius: 0px;
  font-size: 16px;
  margin: 10px 0 0; // override default ul

  & a:hover {
    color: white;
  }
}

// Links, buttons, and more within the dropdown menu
//
// `<button>`-specific styles are denoted with `// For <button>s`
.mmui-dropdown-item {
  padding: 8px 54px 8px 24px;
  font-weight: $font-weight-normal;
  color: $mm-neutral-black;

  @include hover-focus {
    color: white;
    background-color: $mm-core-digital-blue-70;
  }

  &.visited,
  &:visited {
    color: $mm-neutral-black;
  }

  &.active,
  &:active {
    color: white;
    background-color: $mm-core-digital-blue-70;
  }

  &.disabled,
  &:disabled {
    color: $dropdown-link-disabled-color;
    background-color: transparent;
    // Remove CSS gradients if they're enabled
    @if $enable-gradients {
      background-image: none;
    }
  }

  &.hover,
  &:hover {
    color: $mm-neutral-white;
  }
}

// Dropdown section headers
.mmui-dropdown-header {
  display: block;
  margin-bottom: 0; // for use with heading elements
  color: $dropdown-header-color;
  white-space: nowrap; // as with > li > a
  padding: 8px 32px 8px 20px;
  font-family: BrandonText, sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 1.4px;
  text-transform: uppercase;
}

.mmui-btn-dropdown {
  padding: 8px 15px 8px 20px;
  font-size: 16px;
  color: $mm-neutral-gray-80;
  font-weight: 500;
  background-color: $mm-neutral-white;
  border: 0.1rem solid;
  border-color: $mm-neutral-gray-80;
  text-align: left;

  &:hover {
    background-color: $mm-neutral-gray-30;
  }

  /*&:focus, 
    &.focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }*/

  &.disabled,
  &:disabled {
    background-color: $mm-neutral-gray-30;
  }

  &:not(:disabled):not(.disabled):active,
  &:not(:disabled):not(.disabled).active {
    background-color: $mm-neutral-gray-10;
  }

  /*&:not(:disabled):not(.disabled):active:focus, 
    &:not(:disabled):not(.disabled).active:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }*/
}

.show {
  & > .mmui-btn-dropdown.dropdown-toggle {
    background-color: $mm-neutral-gray-10;
  }

  /*& > .mmui-btn-dropdown.dropdown-toggle:focus {
        box-shadow: 0 0 0 0.2rem rgba(0, 123, 255, 0.5);
    }*/
}

.mmui-dropdown-toggle::after,
.dropup .mmui-dropdown-toggle::after,
.dropup .mmui-dropdown-toggle-split::after,
.dropleft .mmui-dropdown-toggle::before,
.dropleft .mmui-dropdown-toggle-split::before,
.dropright .mmui-dropdown-toggle::after,
.dropright .mmui-dropdown-toggle-split::after {
  display: inline-block;
  font-weight: normal;
  font-variant: normal;
  font-style: normal;
  font-family: FontAwesome, sans-serif;
  font-size: 1.6em;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  border: 0px solid;
  color: $mm-core-digital-blue-70;
  vertical-align: 0px;
  width: auto;
}

.mmui-dropdown-toggle::after,
.mmui-dropdown-toggle-split::after {
  content: '\f107';
}
.mmui-dropdown-toggle::after {
  float: right;
}

.mmui-dropdown-toggle.disabled {
  opacity: $mm-opacity-02;
}

.dropup {
  .mmui-dropdown-toggle::after,
  .mmui-dropdown-toggle-split::after {
    content: '';
  }
  .mmui-dropdown-toggle::after {
    margin-left: 15px;
  }
  .mmui-dropdown-toggle-split::after {
    margin-left: 0px;
  }
}

.dropleft {
  .mmui-dropdown-toggle::before,
  .mmui-dropdown-toggle-split::before {
    content: '';
  }
  .mmui-dropdown-toggle::before {
    margin-right: 15px;
  }
  .mmui-dropdown-toggle-split::before {
    margin-right: 0px;
  }
}

.dropright {
  .mmui-dropdown-toggle::after,
  .mmui-dropdown-toggle-split::after {
    content: '';
  }
  .mmui-dropdown-toggle::after {
    margin-left: 15px;
  }
  .mmui-dropdown-toggle-split::after {
    margin-left: 0px;
  }
}

.mmui-drop-choice-expanded .mmui-dropdown-toggle::after {
  font-family: FontAwesome, sans-serif;
  content: '\f106';
}
