I had a similar need - show an outline on focus (when tabbed into the button or link) but show no outline during a mouse click. I initially used :focus and :active. That worked for a regular button but it did not work for submit button or links. So I had to use :focus-visible instead of :focus. This got rid of the outline during mouse click but retained outline for tab focus.

&:focus-visible {
      box-shadow: 0 0 0 1.5px $brand-blue-60, #fff;
      outline: 1.5px solid $brand-blue-60; // Set the outline color
      outline-offset: 2.5px;
    }
    &:active {
      box-shadow: none;
      outline: none; // Set the border color
      outline-offset: 0;
    }