.link {
    @apply underline;
    text-decoration-color: var(--gray-400);
}

.link-hover {
    @apply text-purple-500;
    text-decoration-color: var(--purple-300);
}

.link:hover {
    @apply link-hover;
}

.links a {
    @apply link;
}

.links a:hover {
    @apply link-hover;
}

.link-dimmed {
    @apply font-normal;
    @apply underline;
    @apply text-tint-600;
    text-decoration-color: var(--tint-400);
}

.link-dimmed-hover {
    @apply text-tint-700;
    text-decoration-color: var(--tint-500);
}

.link-dimmed:hover {
    @apply link-dimmed-hover;
}

.links-dimmed a {
    @apply link-dimmed;
}

.links-dimmed a:hover {
    @apply link-dimmed-hover;
}

.link-dimmed-invers {
    @apply font-normal;
    @apply underline;
    @apply text-gray-500;
    text-decoration-color: var(--gray-600);
}

.link-dimmed-invers-hover {
    @apply text-gray-400;
    text-decoration-color: var(--gray-500);
}

.link-dimmed-invers:hover {
    @apply link-dimmed-invers-hover;
}

.links-dimmed-invers a {
    @apply link-dimmed-invers;
}

.links-dimmed-invers a:hover {
    @apply link-dimmed-invers-hover;
}

.link-solution {
    @apply underline;
    @apply text-gray-700;
    text-decoration-color: var(--tint-400);
}

.link-solution-hover {
    @apply text-gray-800;
    text-decoration-color: var(--tint-500);
}

.link-solution:hover {
    @apply link-solution-hover;
}

.links-solution a {
    @apply link-solution;
}

.links-solution a:hover {
    @apply link-solution-hover;
}