// В этом файле должны быть стили для БЭМ-блока btn, его элементов,
// модификаторов, псевдоселекторов, псевдоэлементов, @media-условий...
// Очередность: http://nicothin.github.io/idiomatic-pre-CSS/#priority

.btn {
  box-sizing: border-box;
  display: inline-block;
  max-width: 100%;
  margin: 0;
  border-radius: $border-radius;
  // border: 1px solid $gray-lighter;
  border: 0;
  padding: $field-padding-vertical  $field-padding-horizontal;
  vertical-align: middle;
  white-space: nowrap;
  text-overflow: ellipsis;
  user-select: none;
  text-align: center;
  font-size: 1em;
  font-family: inherit;
  line-height: $line-height;
  text-decoration: none;
  text-transform: none;
  color: $text-color;
  background-color: $gray-lightest;
  background-image: none;
  cursor: pointer;
  overflow: hidden;

  &:hover,
  &:focus {
    text-decoration: none;
    color: $text-color;
    background-color: darken($gray-lightest, 10%);
    // border-color: darken($gray-lighter, 12%);
  }

  // &:visited {
  //   color: $text-color;
  // }

  &:active,
  &:focus {
    @include field-focus;
  }

  &--disabled,
  &:disabled {
    opacity: $opacity;
    cursor: not-allowed;
    color: $text-color;
    background-color: $gray-lightest;
    // border-color: $gray-lighter;

    @at-root a.btn--disabled {
      pointer-events: none;
    }
  }

  // &__icon {
  //   display: inline-block;
  //   vertical-align: middle;
  // }



  // &--main {
  //   color: #fff;
  //   background-color: $color-main;
  //   // border: 1px solid $color-main;

  //   &:hover,
  //   &:focus {
  //     color: #fff;
  //     background-color: darken($color-main, 10%);
  //     // border-color: darken($color-main, 12%);
  //   }

  //   &--disabled,
  //   &:disabled {
  //     color: #fff;
  //     background-color: $color-main;
  //     // border-color: $color-main;
  //   }
  // }
}
