@import '../helpers/index';

.input-placeholder{
  font-size:16px;
  color: $gray-lighter;
  font-weight:100;
}

// == 输入框
.input-inner {
  color: $dark;
  font-size:16px;
  -webkit-appearance: none;
  background-color: $white;
  background-image: none;
  border-radius: $border-radius-base;
  border: 1px solid $border-color;
  box-sizing: border-box;
  display: inline-block;
  height: 48px;
  line-height: 48px;
  outline: none;
  padding: 0 15px;
  transition: border-color .2s cubic-bezier(.645,.045,.355,1);
  width: 100%;
}

// == 输入组，一般用于标签和按钮
.input-group {
  font-size: 16px;
  width: 100%;
  line-height: normal;
  display: inline-table;
  border-collapse: separate;

  &.input-group-start .input-inner{
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }

  &.input-group-end .input-inner{
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .input-inner {
    vertical-align: middle;
    display: table-cell;
  }

  .input-start, .input-end, .button {
    border-radius: $border-radius-base;
    vertical-align: middle;
    display: table-cell;
    position: relative;
    padding: 0 15px;
    white-space: nowrap;
  }

  .input-start, .input-end{
    // border: 1px solid $border-color;
    // background-color: $white;
    // color: $dark;
  }

  .input-start {
    border-right: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .input-end {
    border-left:0;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
  }
}