:root {
  --image-preview-swipe-indicators-text-color: #ddd;
  --image-preview-swipe-indicators-padding: 16px 0;
  --image-preview-zoom-container-background: rgba(0, 0, 0, 0.9);
  --image-preview-close-icon-top: 13px;
  --image-preview-close-icon-right: 14px;
  --image-preview-close-icon-size: 20px;
  --image-preview-close-icon-color: #c8c9cc;
}
.ppsv-image-preview {
  transform: none;
}
.ppsv-image-preview__popup[ppsv-image-preview-cover] {
  background: transparent;
}
.ppsv-image-preview__swipe[ppsv-image-preview-cover] {
  width: 100vw;
  height: 100vh;
}
.ppsv-image-preview__swipe-item[ppsv-image-preview-cover] {
  overflow: hidden;
}
.ppsv-image-preview__close-icon[ppsv-image-preview-cover] {
  position: absolute;
  top: var(--image-preview-close-icon-top);
  right: var(--image-preview-close-icon-right);
  color: var(--image-preview-close-icon-color);
  font-size: var(--image-preview-close-icon-size);
  cursor: pointer;
}
.ppsv-image-preview__indicators {
  position: absolute;
  top: 0;
  width: 100%;
  padding: var(--image-preview-swipe-indicators-padding);
  color: var(--image-preview-swipe-indicators-text-color);
  text-align: center;
}
.ppsv-image-preview__image {
  width: 100%;
  height: 100%;
  object-fit: contain;
  -webkit-user-drag: none;
  transition-property: transform;
}
.ppsv-image-preview__zoom-container {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  transition: transform 0.2s;
  background: var(--image-preview-zoom-container-background);
}
.ppsv-image-preview__error,
.ppsv-image-preview__loading {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: var(--font-size-md);
  background: var(--image-preview-zoom-container-background);
  color: var(--color-desc);
  vertical-align: middle;
  flex-direction: column;
  height: 100%;
  width: 100%;
  position: absolute;
  z-index: -1;
}
