@import "spectre/src/variables";

.form-select.input-inline {
  display: inline-block;
  vertical-align: middle;
  width: auto;
}

$error-color-faint: lighten($error-color, 50%) !default;
$error-color-dark: darken($error-color, 3%) !default;

.btn.btn-delete {
  color: $error-color;
  border-color: $error-color;

  &:focus,
  &:hover {
    background: $error-color-faint;
    border-color: $error-color-dark;
  }
  &:active,
  &.active {
    color: $light-color;
    background: $error-color;
    border-color: darken($error-color-dark, 5%);
  }
}

.btn .icon {
  margin-right: $unit-2;
}