$pseudos: "&:hover", "&:focus", "&:active", "&.active";

.primary {
  background-color: $color-primary;
  color-border: darken($color-primary, 5);

  &,
  #{$pseudos} { color: $color-text-strong-invert; }

  #{$pseudos} { background-color: darken($color-primary, 8%); }
}

%clear-button {
  @include box-shadow(none);
  border-color: transparent;
  background: none;
  color: inherit;
}