/**
* `border` is used instead of `outline` intentionally - as `outline` can't handle `border-radius`
* (rounded elements will still have square outline)
*/
@mixin focus() {
  border-style: $button-base-border-style;
  border-width: $button-base-border-width;
  border-color: $button-focus-border-color;
  box-shadow: $button-focus-box-shadow;
  outline: none;
}

@mixin disabled() {
  cursor: default;
  pointer-events: none;
}

@mixin placeholder($color) {
  &::placeholder {
    color: $color;
  }
  &::-webkit-input-placeholder {
    color: $color; /* Chrome/Opera/Safari */
  }
  &::-moz-placeholder {
    color: $color; /* Firefox 19+ */
    opacity: 1;
  }
  &:-ms-input-placeholder {
    color: $color; /* IE 10+ */
  }
  &:-moz-placeholder {
    color: $color; /* Firefox 18- */
  }
}