/*
 * F-03 Link — app/components/ui/link_component.rb
 *
 * --color-accent-pressed, weight 500, bare at rest, underlined on
 * hover/focus. inline: true (prose links) stays underlined at rest too.
 * Focus-visible border-radius is --radius-xs per spec §4.1, so the
 * global :focus-visible { border-radius: inherit; } rule in base.css
 * resolves to the right value.
 *
 * Forced-state class (.is-hover) shares its declaration with the real
 * :hover rule via a compound selector.
 */

.ui-link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  color: var(--color-accent-pressed);
  font-weight: 500;
  text-decoration: none;
  border-radius: var(--radius-xs);
  transition: color var(--duration-fast) var(--ease-out);
}

.ui-link:hover,
.ui-link:focus-visible,
.ui-link.is-hover {
  text-decoration: underline;
}

.ui-link--inline {
  text-decoration: underline;
}

.ui-link__icon svg {
  display: block;
}