.select-wrapper {
  &__select {
    position: relative;

    &:after {
      content: '';
      position: absolute;
      width: 8px;
      height: 8px;
      right: 15px;
      top: 13px;
      display: inline-flex;
      border-left: 2px solid var(--tide-booking-room-options-dropdown-select-icon-color);
      border-bottom: 2px solid var(--tide-booking-room-options-dropdown-select-icon-color);
      transform: rotate(-45deg);
    }
  }

  select {
    width: 100%;
    height: 40px;
    padding: 0 40px 0 10px;
    border-radius: var(--tide-booking-room-options-dropdown-select-border-radius);
    border: var(--tide-booking-room-options-dropdown-select-border);
    font-family: var(--tide-booking-room-options-dropdown-select-font-family);
    appearance: none;

    &:focus {
      outline: none;
      border: --tide-booking-room-options-dropdown-select-border-focus;
    }

    option {
      appearance: none;
      display: flex;
      justify-content: space-between;
      gap: 20px;

      font-family: var(--tide-booking-room-options-dropdown-select-font-family);
      font-size: 16px;
      color: var(--tide-booking-room-options-dropdown-select-option-color);
    }
  }

  ::picker(select) {
    top: calc(anchor(bottom) + 1px);
    left: anchor(10%);
  }
}

.productcard--accommodation .select-wrapper {
  select {
    font-size: 14.5px;

    @include media-xs {
      font-size: 15.5px;
    }
  }
}

.tree .select-wrapper {
  width: 100%;

  // @include media-lg {
  //   transform: translateY(-5px);
  // }

  // @include media-xl {
  //   transform: translateY(-7px);
  // }
}

select {
  font-family: --tide-booking-font-body;
  font-size: 16px;
}