@mixin visually-hidden() {
	// Hide only visually, but have it available for screen readers
	border: 0;
	clip: rect(0 0 0 0);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;

	/* stylelint-disable plugin/stylelint-bem-namics */
	&.focusable:active,
	&.focusable:focus {
		// allows focusable elements to be still focusable
		// when navigated to via the keyboard
		clip: auto;
		height: auto;
		margin: 0;
		overflow: visible;
		position: static;
		width: auto;
	}
	/* stylelint-enable plugin/stylelint-bem-namics */
}
