link,
button.link {
  color: $link_color;
  text-decoration: underline;
  font-weight: inherit;

  &:visited {
    color: $link_visited_color;
  }

  &:hover {
    color: HSL(from $link_color h calc(s * 1.1) calc(l * 1.1));
  }

  &:active {
    color: $link_color;
  }

  &:disabled { color: color-mix(in srgb, currentColor var(--disabled-opacity), transparent); }

  .osd & {
    color: $osd_link_color;

    &:visited {
      color: $osd_link_visited_color;
    }

    &:active {
      color: $osd_link_color;
    }
  }
}

link {
  @include focus-ring();
}

button.link {
  &,
  &:hover,
  &:active,
  &:checked {
    background-color: transparent;
  }

  > label {
    text-decoration: underline;
  }
}

