/* Dropdown Menu */

$border-width: $vs-border-width;
$border-style: solid;
$border-color: $vs-border-color;
$border-radius: $vs-border-radius;
$box-shadow: $vs-dropdown-box-shadow;

$bg-color: $vs-dropdown-bg;
$z-index: $vs-dropdown-z-index;
$min-width: $vs-dropdown-min-width;
$max-height: $vs-dropdown-max-height;

.vs__dropdown-menu.dropdown-menu {
  overflow-x: hidden;
  overflow-y: auto;
  display: block;
  box-sizing: border-box;
  position: absolute;
  top: calc(100% + #{$border-width * 2}); // -{#$border-width} here ensures the left and right borders of the dropdown appear flush with the toggle.
  left: 0;
  z-index: $z-index;
  width: 100%;
  max-height: $max-height;
  min-width: $min-width;
  text-align: left;
  list-style: none;
  background-color: $bg-color;
}

.vs__no-options {
  padding-left: .75rem;
}
