It sounds like you want the active navigation item to have a custom background color, while keeping the text and icon readable. The problem is caused by the opacity property in you bg-active class.

The property reduces the entire elements opacity, including all its children. Try setting the opacity to 1 or removing it completely.