
/* Make lightbox share look IDENTICAL to product inline share */
.pswp .wwv-pswp-share{
  position:absolute;
  top:10px; right:12px;
  z-index:10000;
  width:40px; height:40px;
  border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center;
  border:0; cursor:pointer;
  /* mimic inline share */
  background: rgba(0,0,0,.28);
  backdrop-filter: blur(2px);
  box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.pswp .wwv-pswp-share svg{ width:22px; height:22px; color:#fff; fill:currentColor; }
.pswp .pswp__button--share{ display:none !important; } /* hide default */

@media (max-width:480px){
  .pswp .wwv-pswp-share{ width:36px; height:36px; top:8px; right:8px; }
  .pswp .wwv-pswp-share svg{ width:20px; height:20px; }
}


/* --- Auto-contrast for icon on top of any image --- */
.pswp .wwv-pswp-share.auto-contrast{ background: transparent; box-shadow:none }
.pswp .wwv-pswp-share.auto-contrast svg{
  color:#fff; fill:currentColor;
  mix-blend-mode:difference; /* inverts vs background under it */
  filter: drop-shadow(0 1px 1px rgba(0,0,0,.35)) drop-shadow(0 2px 6px rgba(0,0,0,.25));
}
/* If browser doesn't support mix-blend-mode, keep fallback background */
@supports not (mix-blend-mode: difference){
  .pswp .wwv-pswp-share.auto-contrast{ background: rgba(0,0,0,.28) }
}
