.demo-input {
  .#{$namespace}-select .#{$namespace}-input {
    width: 130px;
  }
  .#{$namespace}-input {
    width: 180px;
  }
  .#{$namespace}-textarea {
    width: 414px;
  }
  .#{$namespace}-input-group {
    width: 100%;
  }
  .demo-input-size {
    .#{$namespace}-input {
      vertical-align: top;
      margin: 0 10px 10px 0;
    }
  }
  .input-with-select .#{$namespace}-input-group__prepend {
    background-color: #fff;
  }
  .demo-autocomplete {
    text-align: center;

    .sub-title {
      margin-bottom: 10px;
      font-size: 14px;
      color: #8492a6;
    }

    .#{$namespace}-col:not(:last-child) {
      border-right: 1px solid rgba(224, 230, 237, 0.5);
    }

    .#{$namespace}-autocomplete {
      text-align: left;
    }
  }
}
.#{$namespace}-autocomplete-suggestion.my-autocomplete {
  li {
    line-height: normal;
    padding-top: 7px;
    padding-bottom: 7px;

    .name {
      text-overflow: ellipsis;
      overflow: hidden;
    }
    .addr {
      font-size: 12px;
      color: #b4b4b4;
    }
    .highlighted .addr {
      color: #ddd;
    }
  }
}
.demo-input-suffix {
  margin-bottom: 15px;
  .#{$namespace}-input {
    margin-right: 15px;
  }
}