.menuLink {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--Space-x1);
  gap: var(--Space-x15);
  border-radius: var(--Corner-Radius-md);
  color: var(--Text-Interactive-Default);

  &:hover {
    background-color: var(--Surface-Primary-Hover);
  }

  &:focus-visible {
    outline: 2px auto var(--Border-Interactive-Focus);
    outline-offset: 1px;
  }

  &:not(:hover) .arrowIcon {
    opacity: 0;
  }
}

.arrowIcon {
  flex-shrink: 0;
}