@use "../colors/colors.scss";

@mixin d2l-link() {
	&,
	&:visited,
	&:link,
	&:active {
		color: colors.$d2l-color-celestine;
		cursor: pointer;
		text-decoration: none;
	}
	&:hover {
		color: colors.$d2l-color-celestine-minus-1;
		text-decoration: underline;
	}
	&:focus-visible {
		border-radius: 2px;
		outline: 2px solid colors.$d2l-color-celestine;
		outline-offset: 1px;
		text-decoration: underline;
	}
	.d2l-focus-visible-not-supported &:focus {
		border-radius: 2px;
		outline: 2px solid colors.$d2l-color-celestine;
		outline-offset: 1px;
		text-decoration: underline;
	}

	&[main] {
		font-weight: 700;
	}
	&[small] {
		font-size: 0.7rem;
		letter-spacing: 0.01rem;
		line-height: 1.05rem;
	}
	@media print {
		&, &:visited, &:link, &:active {
			color: colors.$d2l-color-ferrite;
		}
	}
}