
.searchBox {
  position: relative;
  line-height: $lineHeight;
}

$searchBoxHeight: 23px;

.searchBox__input {
  width: 140px;
  height: $searchBoxHeight;
  margin: 0;
  padding: 5px 27px 5px 11px;
  border: 1px solid shade($componentStrokeColor, 5%);
  border-radius: 20px;
  background: white;
  font-size: 11px;
  color: shade($componentTextColor, 80%);
}

.searchBox__input--fullWidth {
  width: 100%;
}

/**
 * 1. Position icon inside of the searchBox, on the right side, vertically
 *    centered. Dynamically based on the height of the searchBox.
 */
.searchBox__icon {
  $searchBoxIconSize: 11px;
  $searchBoxIconOffset: ($searchBoxHeight - $searchBoxIconSize) / 2;
  position: absolute; /* 1 */
  top: $searchBoxIconOffset; /* 1 */
  right: $searchBoxIconOffset; /* 1 */
  width: $searchBoxIconSize;
  height: $searchBoxIconSize;
  opacity: 0.16;
}


/**
 * 1. Ensure we don't inherit anything from containing elements.
 */
.searchBox {
  position: relative;
  line-height: $lineHeight; /* 1 */
  font-size: 16px; /* 1 */
}

$searchBoxHeight: 23px;

.searchBox__input {
  width: 140px;
  height: $searchBoxHeight;
  margin: 0;
  padding: 5px 27px 5px 11px;
  border: 1px solid shade($componentStrokeColor, 5%);
  border-radius: 20px;
  background: white;
  font-size: 11px;
  color: shade($componentTextColor, 80%);
}

.searchBox__input--fullWidth {
  width: 100%;
}

/**
 * 1. Position icon inside of the searchBox, on the right side, vertically
 *    centered. Dynamically based on the height of the searchBox.
 */
.searchBox__icon {
  $searchBoxIconSize: 11px;
  $searchBoxIconOffset: ($searchBoxHeight - $searchBoxIconSize) / 2;
  position: absolute; /* 1 */
  top: $searchBoxIconOffset; /* 1 */
  right: $searchBoxIconOffset; /* 1 */
  width: $searchBoxIconSize;
  height: $searchBoxIconSize;
  opacity: 0.16;
}

Fix bug with positioning of magnifying glass in OrganizationSwitcher's SearchBox.
[BT-524]: Fix bug with positioning of magnifying glass in OrganizationSwitcher's SearchBox.
