/* Theme values are inherited or measured from the rendered Page identity. */
.lpl-pres-viewer {
    --pswp-bg: var(--lpl-viewer-background, Canvas);
    --pswp-placeholder-bg: var(--pswp-bg);
    --pswp-icon-color: var(--lpl-viewer-color, currentColor);
    --pswp-icon-color-secondary: var(--pswp-bg);
    --pswp-icon-stroke-width: 0;
    color: var(--lpl-viewer-color, inherit);
    background: var(--pswp-bg);
}
.lpl-pres-viewer .pswp__top-bar {
    display: block;
    height: var(--lpl-viewer-header-end, 3rem);
}
.lpl-pres-viewer .pswp__site-title {
    position: absolute;
    top: var(--lpl-viewer-title-top, 1rem);
    margin: 0;
    padding: 0;
    overflow-wrap: anywhere;
}
.lpl-pres-viewer .pswp__button:not(:disabled) { opacity: 1; }
.lpl-pres-viewer .pswp__button--zoom { display: none; }
.lpl-pres-viewer .pswp__button--close {
    position: absolute;
    top: max(0px, calc(var(--lpl-viewer-title-top, 1rem) - 12px));
    right: max(8px, env(safe-area-inset-right, 0px));
    width: 44px;
    height: 44px;
}
.lpl-pres-viewer .pswp__button--close .pswp__icn {
    width: var(--lpl-viewer-title-size, 1rem);
    height: var(--lpl-viewer-title-size, 1rem);
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}
.lpl-pres-viewer .pswp__button--arrow {
    top: calc((100% + var(--lpl-viewer-header-end, 3rem)) / 2);
}
.lpl-pres-viewer .pswp__button:focus-visible {
    outline: 2px solid var(--lpl-viewer-color, currentColor);
    outline-offset: -4px;
}
.lpl-pres-viewer .pswp__img { max-width: none; object-fit: contain; }
.lpl-pres-viewer-status {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
}
.lpl-pres-photograph-fallback img {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 85vh;
    object-fit: contain;
    margin-inline: auto;
}
.lpl-pres-photograph-fallback[hidden] { display: none; }

/* PhotoSwipe's base image cursor is zoom-out, even for nonzoomable content. */
.lpl-pres-viewer.lpl-pres-viewer--zoom-disabled .pswp__img,
.lpl-pres-viewer.lpl-pres-viewer--zoom-disabled .pswp__img:active {
    cursor: default;
}

.lpl-pres-viewer-boundary {
    display: grid;
    place-content: center;
    justify-items: center;
    gap: 1rem;
    height: 100%;
    color: var(--lpl-viewer-color, currentColor);
}
.lpl-pres-viewer-retry { font: inherit; padding: .5em 1em; }
