Как решить проблему с оверлеем над ссылкой?

Question

[Dymok]

Пытаюсь сделать карточки с изображением и текстом, хочу чтобы при ховере на изображение появлялся оверлей с иконкой зума, а при нажатии открывалась галерея lightbox. На данный момент сделал так: codepen. Но проблема в том, что если есть оверлей, то он перекрывает ссылку и нажатие по ней не работает. Без оверлея всё в порядке. Можно ли это исправить без JS? Заранее спасибо.

Comments

[Максим Тимофеев]

z-index?

[Dymok]

Максим Тимофеев, так нужно, чтобы оверлей был виден

[Максим Тимофеев]

Dymok, а почему он станет не виден? У ссылки есть фон?

[Dymok]

Максим Тимофеев, неа. Пытаюсь так сделать, но тогда не работает ховер на оверлее https://codepen.io/UnluckySerivelha/pen/VdZXey

[Максим Тимофеев]

Dymok, делайте ховер на ссылку, а меняйте оверлей, вложите оверлей в ссылку. Или вообще сделайте его через псевдоэлемент типа ::after

[Dymok]

Максим Тимофеев, cделал с помощью,
a:hover ~ .item-zoom-overlay {
opacity: 1;
}
спасибо. Напишите ответ, отмечу решением