/*
 * Fortuna UI — links. Eén regel voor alle links: dezelfde kleur, dunne lijn en beweging als de titels op de voorpagina
 * (de onderstreping schuift van links naar rechts in bij hover of focus).
 *   Tekstlinks (lopende tekst, uitleg in het woordenboek, tabellen): lijn staat altijd, zacht; bij hover schuift de volle lijn erover.
 *   Lijstlinks (voet, uitklapmenu, telefoonmenu): geen lijn in rust; bij hover schuift de lijn in.
 * Gewicht halfvet (600, besluit Patrick 08-10); een term uit de woordenlijst heeft daarnaast een gestippelde lijn (type.css). Kleur: --fu-c-link, 5,5:1 op wit (WCAG AA).
 */
:where(.fu-prose a, .ownlinks, .fu-link, .fu-datatable td a):not(.fu-btn, .fu-card__link, .fu-chip, .fu-more),
.fw-dialog.fu-dialog .fw-lemma a {
	color: var(--fu-c-link);
	font-weight: 600;
	text-decoration-line: underline;
	text-decoration-thickness: var(--fu-lijn);
	text-decoration-color: color-mix(in srgb, currentColor 40%, transparent);
	text-underline-offset: var(--fu-onderstreep-afstand);
	background: linear-gradient(currentColor, currentColor) 0 100% / 0% var(--fu-onderstreep) no-repeat;
	-webkit-box-decoration-break: clone;
	box-decoration-break: clone;
	transition: background-size var(--fu-beweging-paneel), color var(--fu-beweging-hover);
}

:where(.fu-prose a, .ownlinks, .fu-link, .fu-datatable td a):not(.fu-btn, .fu-card__link, .fu-chip, .fu-more):is(:hover, :focus-visible),
.fw-dialog.fu-dialog .fw-lemma a:is(:hover, :focus-visible) {
	background-size: 100% var(--fu-onderstreep);
}

/* Lijstlinks: de lijn komt pas bij hover. Het vak is soms hoger dan de tekst (tikdoel), dus de lijn staat onder het midden. */
.fu-footer li a,
.fu-footer__legal button,
.fu-flyout__links a,
.fu-acc__paneel li a {
	width: fit-content;
	text-decoration: none;
	background: linear-gradient(currentColor, currentColor) 0 calc(50% + 0.7em) / 0% var(--fu-onderstreep) no-repeat;
	transition: background-size var(--fu-beweging-paneel), color var(--fu-beweging-hover);
}

.fu-footer li a:is(:hover, :focus-visible),
.fu-footer__legal button:is(:hover, :focus-visible),
.fu-flyout__links a:is(:hover, :focus-visible),
.fu-acc__paneel li a:is(:hover, :focus-visible) {
	text-decoration: none;
	background-size: 100% var(--fu-onderstreep);
}

@media (prefers-reduced-motion: reduce) {
	:where(.fu-prose a, .ownlinks, .fu-link, .fu-datatable td a, .fu-footer li a, .fu-flyout__links a, .fu-acc__paneel li a),
	.fw-dialog.fu-dialog .fw-lemma a { transition: none; }
}