// Button Styling Overrides
.btn {
  font-weight: 900;
  padding: 12px 18px;
  letter-spacing: 1px;
  text-transform: uppercase;
  border-radius: 0;
}

.btn-primary {
  border: 1px solid white;
  background-color: transparent;
  &:focus,
  &:hover {
    color: $themePrimary;
    border-color: white;
    background-color: white;
  }
  &:focus {
    box-shadow: 0 0 0 3px fade-out($themePrimary, 0.5);
  }
}

.btn-secondary {
  border: 1px solid $themeDark;
  background-color: transparent;
  color: $themeDark;
  &:focus,
  &:hover {
    color: white;
    border-color: $themePrimary;
    background-color: $themePrimary;
  }
  &:focus {
    box-shadow: 0 0 0 3px fade-out($themePrimary, 0.5);
  }
}

button {
  &:hover {
    cursor: pointer;
  }
}

// Full Width Button
.btn-full-width {
  font-size: 26px;
  font-weight: 200;
  padding: 50px 0;
  letter-spacing: normal;
  text-transform: none;
  color: white;
  border: 0;
  border-radius: 0;
  background-color: $themeDark;
  &:hover {
    color: white;
    background-color: $themePrimary;
  }
  &:focus {
    color: white;
  }
}

// Color Utility Overrides
.text-primary {
  color: $themePrimary !important;
}

a.text-primary {
  color: $themePrimary !important;
  &:focus,
  &:hover {
    color: darken($themePrimary, 15%) !important;
  }
}

.bg-inverse {
  background-color: $themeDark !important;
}