/*------------------------------------------------------------
BUTTONS
====================================*/

.btn {
  text-transform: uppercase;
  text-decoration: none;
  font-weight: $btn-font-weight;
  letter-spacing: 0.042rem;
  &:after {
    content: '›';
    margin-left: 1rem;
  }
  &:not(:disabled):not(.disabled):hover {
    box-shadow: $btn-hover-box-shadow;
  }
}
.btn-primary {
  &:hover {
    background: $primary-hover;
    border-color: $primary-hover;
  }
  &.disabled,
  &:disabled {
    &:hover {
      background: $primary;
      border-color: $primary;
    }
  }
}
.btn-secondary {
  &:hover {
    background: $secondary-hover;
    border-color: $secondary-hover;
  }
  &.disabled,
  &:disabled {
    &:hover {
      background: $secondary;
      border-color: $secondary;
    }
  }
}

.btn-reverse {
  &:before {
    content: '‹';
    margin-right: 1rem;
  }
  &:after {
    display: none;
  }
}

.btn-light {
  color: $secondary;
  background: $white;
  border-color: $white;
  &.disabled, &:disabled {
    color: $secondary;
    background: $white;
  }
  &:hover {
    color: $secondary;
    background: $white;
    border-color: $light;
  }
}
.btn-outline-light {
  color: $secondary;
  border-color: $white;
  &.disabled, &:disabled {
    color: $secondary;
    border-color: $white;
    &:hover {
      background: transparent;
      box-shadow: none;
    }
  }
  &:hover {
    color: $secondary;
    background: $white;
    border-color: $light;
  }
}

.btn-sm {
  letter-spacing: 0.036rem;
  &:before, &:after {
    display: none;
  }
}

.btn-lg {
  letter-spacing: 0.048rem;
}
