:host,:root{--xzx-image-preview-index-text-color:var(--xzx-text-white-1);--xzx-image-preview-index-font-size:var(--xzx-text-sm);--xzx-image-preview-index-line-height:var(--xzx-text-lh-md);--xzx-image-preview-index-text-shadow:0 1px 1px var(--xzx-gray-8);--xzx-image-preview-overlay-background:rgba(0,0,0,0.9);--xzx-image-preview-close-icon-size:22px;--xzx-image-preview-close-icon-color:var(--xzx-gray-5);--xzx-image-preview-close-icon-margin:var(--xzx-padding-md);--xzx-image-preview-close-icon-z-index:1}.xzx-image-preview{background-color:transparent;height:100%;left:0;max-width:none;position:fixed;top:0;transform:none;width:100%}.xzx-image-preview__swipe{height:100%}.xzx-image-preview__swipe-item{align-items:center;display:flex;justify-content:center;overflow:hidden}.xzx-image-preview__cover{left:0;position:absolute;top:0}.xzx-image-preview__image,.xzx-image-preview__image-wrap{transition-property:transform;width:100%}.xzx-image-preview__image--vertical,.xzx-image-preview__image-wrap--vertical{height:100%;width:auto}.xzx-image-preview__image img,.xzx-image-preview__image video,.xzx-image-preview__image-wrap img,.xzx-image-preview__image-wrap video{-webkit-user-drag:none}.xzx-image-preview__image .xzx-image__error,.xzx-image-preview__image-wrap .xzx-image__error{height:40%;top:30%}.xzx-image-preview__image .xzx-image__error-icon,.xzx-image-preview__image-wrap .xzx-image__error-icon{font-size:36px}.xzx-image-preview__image .xzx-image__loading,.xzx-image-preview__image-wrap .xzx-image__loading{background-color:transparent}.xzx-image-preview__index{color:var(--xzx-image-preview-index-text-color);font-size:var(--xzx-image-preview-index-font-size);left:50%;line-height:var(--xzx-image-preview-index-line-height);position:absolute;text-shadow:var(--xzx-image-preview-index-text-shadow);top:var(--xzx-padding-md);transform:translate(-50%)}.xzx-image-preview__overlay{background:var(--xzx-image-preview-overlay-background)}.xzx-image-preview__close-icon{color:var(--xzx-image-preview-close-icon-color);font-size:var(--xzx-image-preview-close-icon-size);position:absolute;z-index:var(--xzx-image-preview-close-icon-z-index)}.xzx-image-preview__close-icon--top-left{left:var(--xzx-image-preview-close-icon-margin);top:var(--xzx-image-preview-close-icon-margin)}.xzx-image-preview__close-icon--top-right{right:var(--xzx-image-preview-close-icon-margin);top:var(--xzx-image-preview-close-icon-margin)}.xzx-image-preview__close-icon--bottom-left{bottom:var(--xzx-image-preview-close-icon-margin);left:var(--xzx-image-preview-close-icon-margin)}.xzx-image-preview__close-icon--bottom-right{bottom:var(--xzx-image-preview-close-icon-margin);right:var(--xzx-image-preview-close-icon-margin)}