/**
 * PhotoSwipe: the UI layer sits above the image (z-index 1550, height 100%).
 * Without pointer-events: none, a click on the picture hits .pswp__ui and
 * closes the lightbox instead of zooming.
 */
.pswp__ui {
  pointer-events: none;
}

.pswp__top-bar,
.pswp__caption,
.pswp__button,
.pswp__share-modal {
  pointer-events: auto;
}

/* Always offer zoom — gallery originals are often smaller than the viewport,
   so PhotoSwipe would hide the button and treat a click as "close". */
.pswp--open .pswp__button--zoom {
  display: block;
  position: absolute;
  top: 0;
  right: 60px;
  background-color: #333;
  background-image: url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9IiNmZmYiIHN0cm9rZS13aWR0aD0iMiI+PGNpcmNsZSBjeD0iMTEiIGN5PSIxMSIgcj0iNyIvPjxwYXRoIGQ9Im0yMSAyMS00LTQiLz48cGF0aCBkPSJNMTEgOXY0bTItMmgtNCIvPjwvc3ZnPg==");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 28px;
  height: 60px;
  width: 60px;
}

@media (max-width: 767px) {
  .pswp--open .pswp__button--zoom {
    right: 40px;
    background-size: 20px;
    height: 40px;
    width: 40px;
  }
}