.info-icon {
  display: inline-block;
  line-height: 0;
  color: var(--wds-color-text-primary, var(--wds-color-blue-100, var(--wsr-color-B10, #116dff)));

  &__trigger {
    border-radius: 50%;
    outline-style: none;
  }

  &__icon {
    vertical-align: middle;
    fill: var(--wds-info-icon-fill, var(--wds-color-text-primary, var(--wsr-color-B10, #116dff)));
  }

  @media (hover: hover) {
    &__icon:hover {
      fill: var(--wds-info-icon-fill-hover, var(--wds-color-text-primary, var(--wsr-color-B10, #116dff)));
    }
  }
}