.spin-box {
  .control-input {
    position: relative;
  }
}
.spinedit {
  display: inline-block;
  div& {
    height: 26px;
    width: 36px;
    vertical-align: top;
    position: absolute;
    .form-search &, .form-horizontal &, .form-inline & {
      top: 0;
      right: 0;
    }
    .icon-chevron-up, .icon-chevron-down, .glyphicon-minus, .glyphicon-plus {
      top: 0;
      left: 0;
      width: 36px;
      height: 11px;
      display: block;
      text-align: center;
      color: @black070;
      cursor: pointer;
      background-color: @enterprise-blue;
      .font-size(8);
      font-style: normal;
      font-weight: normal;
      line-height: 11px;
      font-family: 'FontAwesome';
      &:after {
        display: block;
        content: "\f077";
      }
      &:hover, &:focus {
        color: @white;
      }
      &:active {
        background-color: @blue;
      }
      .disabled & {
        background-color: @cool-grey;
        cursor: not-allowed;
        color: @black030;
        top: 1px !important;
        height: 10px;
        line-height: 10px;
        @media @desktop {
          top: 1px !important;
          height: 15px;
          line-height: 16px;
        }
        .noselect;
        &:hover, &:focus, &:active {
          color: @black030;
          background-color: @cool-grey;
          .box-shadow(none);
        }
      }
      @media @desktop {
        height: 15px;
        line-height: 14px;
        top: 1px !important;
      }
    }
    .glyphicon {
      &.glyphicon-minus,
      &.glyphicon-plus {
        top: 0;
        left: 0;
        width: 100%;
        &:before {
          content: '';
          display: none;
        }
      }
    }

    .icon-chevron-down, .glyphicon-minus {
      &:after {
        content: "\f078";
      }
    }

  }
  input[type="text"]& {
    width: 100%;
    padding-right: 40px;
    text-align: right;
    .invalid & {
      padding-right: 62px;
      background-position: right 36px top 1px;
    }
  }
}
.invalid{
  .spinedit{
    div& {
      .icon-chevron-up, .icon-chevron-down, .glyphicon-minus, .glyphicon-plus {
        @media @desktop {
          height: 12px;
          line-height: 12px;
        }
      }
    }
  }
}