.tui-link {
	display: inline-flex;
	align-items: center;
	gap: 0.25rem;
}

:global(.link-icon) {
	color: var(--link-color);
	opacity: 0.8;
}

.link-text {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	font-family: inherit;
	font-size: inherit;
	color: var(--link-color);
	text-decoration: underline;
	text-decoration-style: dotted;
	text-underline-offset: 2px;
	cursor: pointer;
	transition: all 0.15s ease;
}

.link-text:hover {
	text-decoration-style: solid;
	filter: brightness(1.2);
}

:global(.link-external) {
	color: var(--link-color);
	opacity: 0.5;
}

.tui-link:hover :global(.link-external) {
	opacity: 0.8;
}

:global(.inline-icon) {
	display: inline-block;
	vertical-align: middle;
	margin: 0 0.15em;
}