/*******************************
        User Overrides
*******************************/

.ui.selection.dropdown {
  min-width: 10em;
  min-height: 35px!important;

  .dropdown.icon {
    color: #B8BCD9;
  }

  .menu {

    &>.item {
      border-top: none;

      &:hover {
        background-color: #E5F5FE;
        color: #20A8FE;
      }
    }

    &::-webkit-scrollbar {
      width: 14px;
    }

    &::-webkit-scrollbar-track {
      border: 1px solid #E8E8E8!important;
      background-clip: padding-box;
      background-color: #FAFAFA;
    }

    &::-webkit-scrollbar-thumb {
      background-clip: padding-box;
      border: 3px solid rgba(0, 0, 0, 0);
      border-radius: 9999px;
      background-color: #AAAAAA;
    }

  }

  &.upward>.menu {
    bottom: 115%;
  }

  &.visible {
    border-radius: 20px!important;
    box-shadow: none;

    &:hover {
      box-shadow: none;
    }
  }

  &.active {
    border-radius: 20px!important;
    box-shadow: none;

    &:hover {
      box-shadow: none;
    }
  }

  &.multiple {
    padding-top: 4px;
    padding-left: 17px;
    padding-right: 17px;

    .ui.label {
      background-color: #4D5280;
      color: @white;
      font-size: 12px;
      font-weight: 600;

      &>.close.icon, &>.delete.icon {
        opacity: unset;

        &:hover {
          opacity: 0.5;
        }
      }
    }

    .item {
      display: flex;
      align-items: center;

      &:before {
        content: url('/static/img/icons/unchecked.svg');
        margin-right: 10px;
      }

      &.active.filtered {
        display: flex !important;

        &:before {
          content: url('/static/img/icons/checked.svg');
        }
      }
    }
  }
}

.ui.upward.active.selection.dropdown .menu, .ui.upward.active.selection.dropdown:hover .menu {
    -webkit-box-shadow: @UpwardMenuBoxShadow;
    box-shadow: @UpwardMenuBoxShadow;
}

.ui.selection.active.dropdown .menu, .ui.selection.active.dropdown:hover .menu {
  -webkit-box-shadow: @menuBoxShadow;
  box-shadow: @menuBoxShadow;
}

.ui.active.search.dropdown input.search:focus+.text {
    color: @black!important;
}

.ui.dropdown.versions-menu-dropdown {
  .menu {

    &>.item {
      border-top: none;

      &:hover {
        background-color: #E5F5FE;
        color: #20A8FE;

        &:first-child {
          border-top-left-radius: 17.5px!important;
          border-top-right-radius: 17.5px!important;
        }

        &:last-child {
          border-bottom-left-radius: 17.5px!important;
          border-bottom-right-radius: 17.5px!important;
        }

      }

    }

  }

  &.visible {
    border-radius: 20px!important;
    box-shadow: none;

    &:hover {
      box-shadow: none;
      border-radius: 17.5px!important;
    }
  }

  &.active {
    border-radius: 20px!important;
    box-shadow: none;

    &:hover {
      box-shadow: none;
      border-radius: 17.5px!important;
    }
  }
}