/*********
 * Links *
 *********/
*:link {
  color: $link_color;

  &:visited {
    color: $link_visited_color;

    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 60%); }
  }

  &:hover {
    color: lighten($link_color,10%);

    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 90%); }
  }

  &:active {
    color: $link_color;

    *:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
  }

  &:backdrop { &:backdrop:hover, &:backdrop:hover:selected, & { color: $selected_bg_color; }}

  @at-root %link_selected,
  &:selected,
  *:selected & { color: mix($selected_fg_color, $selected_bg_color, 80%); }
}

button:link,
button:visited {
  @extend %undecorated_button;

  @extend *:link;

  text-shadow: none;

  &:hover,
  &:active,
  &:checked {
    @extend %undecorated_button;

    text-shadow: none;
  }

  > label { text-decoration-line: underline; }
}