Transparent material disappears entirely when UI element overlaps it at all

I have a UI inventory where the item icons are quads (meshes) with a transparent material. The material has a normal map to allow the item icons to be affected by lighting.

I have been implementing a tooltip when hovering over items with the cursor, but when the tooltip overlaps with the material, the material disappears entirely.

Material in inventory normally: https://i.imgur.com/QfFrhcf.png

When tooltip overlaps: https://i.imgur.com/3iNoCla.png

This doesn’t occur when I set the material surface type to opaque: https://i.imgur.com/Pc9WhMp.png

This is what I would like to happen with the transparent material. How can I get the transparent material/texture to render under the transparent tooltip?

Or alternatively, how can I use 2D lighting in my 3D project so that I can use sprites paired with normal maps instead of quads with transparent materials?

 

Ok, I figured it out. Because the tooltip and the icon were on the same canvas, they had the same sorting order. I created another canvas with a higher sorting order and parented the tooltip to that. Now everything is working correctly.