.Search
  font-size 14px
  cursor text
  min-width 330px
  width 100%
  box-sizing border-box
  &:before
    icon()
    color inherit
    display inline-block
    font-size 1.5em
    content '\e837'
    vertical-align middle
    padding-left 10px
    height 29px
    // line-height 38px
  &-container
    border 1px solid $bz-grey--dark
    position relative
  &-multi
    line-height 30px
    padding 5px 10px
    &:before
      padding-right 10px
      padding-left 0
    .Search-input
      padding 0
      vertical-align top
  &-input
    border 0
    outline 0
    height 30px
    padding 0 10px
    width 100%
    box-sizing border-box
    font-size 1em
    background rgba(0, 0, 0, 0)
    color inherit
    placeholderColor(inherit)
  &-tag
    display inline-block
    color $bz-white
    padding 3px 0 3px 6px
    box-sizing border-box
    height 24px
    line-height 17px
    margin-bottom 7px
    background $bz-orange
    &:after
      content ''
      display inline-block
      font-size 0
      height 24px
      position relative
      vertical-align top
      width 6px
      border-left 7px solid $bz-orange
      top -3px
    &--symbol
      background $bz-blue
      &:after
        border-left 7px solid $bz-blue
    &--keyword
      background $bz-blue
      &:after
        border-left 7px solid $bz-blue
  &-dropdown
    position absolute
    top calc(100% + 1px)
    left -1px
    right -1px
    list-style-type none
    z-index 2
    background $bz-grey--darker
  &--hasresults
    padding-bottom 0

.SearchResult
  padding .5em
  border-width 0 1px 1px 1px
  line-height 1em
  border-style solid
  border-color $bz-grey--dark
  &.is-selected
    background $bz-blue
    color $bz-white
    cursor pointer
    .SearchResult-head
      color inherit
  &-head
    margin-bottom .25em
    font-size .9em
    color $bz-grey
  &-desc
    text-overflow ellipsis
    white-space nowrap
    overflow hidden
    color inherit
