.btn-default {
  border-color: $deep-orange-100;
  color: $grey-800;
  &:hover, &:focus {
    border-color: $deep-orange-100;
    color: $grey-800;
  }
}

.btn-main {
  @include button-variant(#fff, $deep-orange-900, $deep-orange-900);
}

.btn-group > .btn.first {
  @include border-left-radius($border-radius !important);
}

.btn-group > .btn.last {
  @include border-right-radius($border-radius !important);
}

.toggle.btn {
  border-color: $grey-300;
  border-radius: $border-radius;
  &:hover, &:focus {
    border-color: $grey-300;
  }
}

.toggle-group {
  .toggle-handle {
    background: $grey-100;
    border-color: $grey-300;
    &:hover, &:focus {
      background: $grey-200;
      border-color: $grey-300;
    }
  }

  .toggle-off {
    background: #fff;
    color: $grey-500;
    border-color: #fff;
    &:hover, &:focus {
      background: $light-green-50;
      color: $grey-700;
      border-color: $light-green-50;
    }
  }

  .toggle-on {
    background: $brand-success;
    border-color: $brand-success;
    color: #fff;
    &:hover, &:focus {
      background: darken($brand-success, 12%);
      border-color: darken($brand-success, 12%);
      color: #fff;
    }
  }
}