/* @group @variables - link */

:root {
--link-background-color: transparent;
--link-action-background-color: transparent;
--link-active-background-color: transparent;
--link-color: inherit;
--link-action-color: inherit;
--link-active-color: inherit;
--link-disabled-color: inherit;
--link-border-color: transparent;
--link-border-action-color: transparent;
--link-border-active-color: htransparent;
--link-border-disabled-color: transparent;
--link-text-decoration: none;
--link-action-text-decoration: none;
--link-active-text-decoration: none;
}

/* @end @variables - link */

/* @group @variables */

a,
a:hover,
a:focus,
a:active,
button,
button:hover,
button:focus,
button:active {
font-weight: var(--link-font-weight);
font-variation-settings: var(--link-font-variation-settings);
}

a,
button {
color: var(--link-color);
font-size: var(--link-font-size);
line-height: var(--link-line-height);
text-decoration: var(--link-text-decoration);
text-decoration-skip-ink: auto;
text-underline-position: under;
transition: var(--transition);
}

a:hover,
a:focus,
button:hover,
button:focus {
color: var(--link-action-color);
text-decoration: var(--link-action-text-decoration);
}

a:active,
button:active {
color: var(--link-active-color);
text-decoration: var(--link-active-text-decoration);
}

/* @end @variables */