Transparent material disappears entirely when UI element overlaps it at all

Unity Engine
,
1

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: Imgur: The magic of the Internet

When tooltip overlaps: Imgur: The magic of the Internet

This doesn’t occur when I set the material surface type to opaque: Imgur: The magic of the Internet

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?

2

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.