/*
 * GANTSEV PROJECT ZOOM V151
 *
 * Старый .gallery-tile__zoom полностью скрывается.
 * Новая лупа использует независимый класс .gantsev-zoom-v151,
 * поэтому старые hover-стили больше не могут вернуть серый фон.
 */

/* Старый элемент скрыт ещё до выполнения JavaScript — без мигания фона. */
.project-page .gallery-tile__zoom {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Карточка остаётся точкой позиционирования. */
.project-page .gallery-tile,
.project-page .project-page__cover.gallery-tile {
  position: relative !important;
  cursor: pointer !important;
}

/* Новый независимый элемент. */
.project-page .gantsev-zoom-v151 {
  all: unset !important;

  position: absolute !important;
  z-index: 15 !important;
  top: 18px !important;
  right: 18px !important;

  display: block !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;

  box-sizing: border-box !important;
  pointer-events: none !important;
  overflow: visible !important;

  background: none !important;
  background-color: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;

  opacity: 0 !important;
  visibility: hidden !important;
  transform: translateY(4px) scale(.94) !important;
  transform-origin: center !important;

  transition:
    opacity .2s ease,
    visibility .2s ease,
    transform .2s ease !important;
}

/* Только новая SVG-лупа, без кнопки и круглой подложки. */
.project-page .gantsev-zoom-v151::before {
  all: unset !important;
  content: "" !important;

  display: block !important;
  width: 36px !important;
  height: 36px !important;

  background-color: transparent !important;
  background-image: url("/assets/icons/gallery-zoom-v151.svg") !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;

  filter:
    drop-shadow(0 1px 1px rgba(18, 11, 5, .25))
    drop-shadow(0 2px 4px rgba(18, 11, 5, .15)) !important;
}

/* Появляется только при наведении мыши. */
@media (hover: hover) and (pointer: fine) {
  .project-page .gallery-tile:hover > .gantsev-zoom-v151,
  .project-page .gallery-tile:focus-visible > .gantsev-zoom-v151 {
    opacity: 1 !important;
    visibility: visible !important;
    transform: translateY(0) scale(1) !important;

    background: none !important;
    background-color: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
  }
}

/* На сенсорных устройствах декоративную лупу не показываем. */
@media (hover: none), (pointer: coarse) {
  .project-page .gantsev-zoom-v151 {
    display: none !important;
  }
}

.project-page .project-page__cover .gantsev-zoom-v151 {
  top: 20px !important;
  right: 20px !important;
}

@media (max-width: 680px) {
  .project-page .gantsev-zoom-v151 {
    display: none !important;
  }
}
