@import '../../app.less';

.input {
  display: inline-block;
  vertical-align: middle;
  border-radius: 2px;

  input {
    width: 100%;
    border: solid 1px rgba(0, 0, 0, 0.1);
    background: @theme_bg_color;
  }

  input:hover {
    border-color: @theme_color;
  }

  input:focus {
    border-color: @theme_color;
    background: darken(@theme_bg_color, 2);
  }
}

.input.basic {

  input {
    padding: 4px 15px;
    line-height: 30px;
    font-size: 20px;
  }
}

.input.small {

  input {
    line-height: 18px;
    font-size: 12px;
    padding: 2px 8px;
  }
}

.input.lager {

  input {
    font-size: 18px;
    line-height: 28px;
    padding: 7px 20px;
  }
}

.input.disabled {
  cursor: no-drop;
}

.input.basic.radius {
  border-radius: 17px;
}

.input.small.radius {
  border-radius: 14px;
}

.input.lager.radius {
  border-radius: 36px;
}

.input.default {
  background: #fff;
  color: @holder_color;
  border: 1px solid @holder_color;
}

.button.default:hover {
  color: @theme_color;
  border-color: @theme_color;
}