.entity-attribute-select
  //+flex(flex-start, center)

  .select-wrapper
    width: calc(100% - 225px)
    max-width: 500px
    margin-left: 45px

    .select-menu
      display: none

    .ui-selectmenu-button
      position: relative
      display: block
      font-size: 0.75rem
      line-height: 1.6
      padding: 8px
      border: 1px solid $lighter-gray
      border-radius: 3px
      color: $dark-gray
      background: white

      &:focus
        outline: none
        border-color: rgba($brand-primary, 0.75)

      &:after
        content: ''
        position: absolute
        right: 12px
        top: 17px
        width: 0
        height: 0
        border-style: solid
        border-width: 4px 5px 0 5px
        border-color: $darkBlue transparent transparent transparent
        opacity: 0.5

      &.dropdown-open
        &:after
          transform: rotate(180deg)

      .ui-icon
        display: none


.ui-selectmenu-menu
  display: none
  margin: 0

  &.ui-selectmenu-open
    display: block

  ul
    padding: 0
    margin: 0
    list-style: none
    border: 1px solid $lighter-gray
    background-color: white
    max-height: 500px
    overflow: hidden
    overflow-y: scroll

    &.ui-widget.ui-widget-content
      border-top: none

    li
      font-size: 0.7rem
      line-height: 1.6
      color: $dark-gray

      //Uncomment if selectmenu renders without div
      //border: none !important
      //padding: 4px 8px

      &.ui-state-focus
        background-color: $dark-white

      //Comment if selectmenu renders without div
      div
        padding: 4px 8px

        &.ui-state-active
          border: 1px solid transparent !important
          background-color: $dark-white
          color: $dark-gray

.c-simple-select
  position: relative
  appearance: none
  display: block
  width: 100%
  font-size: 0.75rem
  line-height: 1.6
  padding: 8px 16px
  min-height: 40px
  border: 1px solid transparent
  border-radius: 3px
  color: #32343a
  background: white

.c-simple-select__wrapper
  position: relative

  &:after
    content: ''
    position: absolute
    top: calc(50% - 2px)
    right: 8px
    display: block
    width: 0
    height: 0
    border-style: solid
    border-width: 4px 4px 0 4px
    border-color: $medium-gray transparent transparent transparent


.export-select
  min-height: 0
  text-align: left
  padding: 23px 25px
  border: 1px solid #d8dae2
  border-radius: 4px
  cursor: pointer
  width: 250px