:root {
  --default-link-color: var(--color-brand);
}

.no-decoration,
:local(.no-decoration) {
  text-decoration: none;
}

.link {
  cursor: pointer;
  text-decoration: none;
  color: var(--color-brand);
}

.link:hover {
  text-decoration: underline;
}

.link--nohover:hover {
  text-decoration: none;
}

.link:focus {
  outline: 2px solid var(--color-focus);
}

.link:focus:not(:focus-visible) {
  outline: none;
}

.link--wrappable {
  word-break: break-all;
}

.link--icon {
  line-height: initial;
}

.expand-clickable {
  display: inline-block;
  position: relative;
  z-index: 1;
  padding: 0.5em;
  margin: -0.5em;
}