.handout-li-links {
	color: var(--grey);
}

.handout-li-links a {
	@extend a;
	text-decoration: underline;
	text-underline-offset: 1.5pt;
	padding-left: 1ex;
	padding-right: 1ex;
}

// Only do hover magic on mouse devices
@media(hover: hover) and (pointer: fine) {
	.handout-ul li:hover {
		margin-left: 1ex;
		transition: 50ms;
	}

	.handout-ul li {
		transition: 50ms;
		transition-delay: 50ms;
	}

	.handout-ul li:hover .handout-li-links {
		display: inline-block;
		opacity: 1;
		transition: 100ms;
	}

	.handout-ul li .handout-li-links {
		transition-delay: 50ms;
		transition: 100ms;
		opacity: 0;
		display: none;
	}
}



// Email obfuscation
// Works with "{{ email_*() }}" shortcodes.
.eobf {
	@extend a;
}

.eobf:hover {
	@extend a, :hover;
}

// Change icon on hover
.eobf #eobf-kb,
.eobf:hover #eobf-en {
	display: none;
}

.eobf #eobf-en,
.eobf:hover #eobf-kb {
	display: inline;
}

// Hover text
.eobf:hover span:before {
	unicode-bidi: bidi-override;
	direction: ltr;
	content: attr(data-h);
}



// Text for email_beta
.eobf-beta span:before {
	content: "mo" attr(data-a) "teb" "\0040" attr(data-b) "m";
	unicode-bidi: bidi-override;
	direction: rtl;
}

// Text for email_goog
.eobf-goog span:before {
	content: "mo" attr(data-a) "mg" "\0040" attr(data-b) "p." attr(data-c) "m";
	unicode-bidi: bidi-override;
	direction: rtl;
}

// Text for email_this
.eobf-this span:before {
	content: attr(data-a);
}