v1.0.16 — image fits viewport without clipping
Fix: the bottom of tall images no longer gets clipped by the popup container.
What was broken
After v1.0.15's overlay-padding ship, container's `max-height: 100%` fell back to the natural image height (CSS rule: percentage heights need a definite parent height). The container could grow taller than the overlay's content area, and `overflow: hidden` then clipped the bottom of the image.
How v1.0.16 fixes it
The display class now sets two CSS custom properties on the overlay's inline style:
```css
--aqm-popup-max-h: calc(100vh - 2 × verticalPadding);
--aqm-popup-max-w: calc(100vw - 2 × horizontalPadding);
```
These are viewport-relative values that don't depend on any parent having an explicit height. The container and the image both consume them:
```css
.aqm-popup-container {
max-width: var(--aqm-popup-max-w, 100vw);
max-height: var(--aqm-popup-max-h, 100vh);
}
#aqm-popup-content img,
#aqm-popup-content video {
max-width: 100%;
max-height: var(--aqm-popup-max-h, 100vh);
width: auto;
height: auto;
}
```
The image's `width: auto + height: auto` overrides Divi's `width: 100%` on Fullwidth Image modules, so the browser preserves the intrinsic aspect ratio when constraints apply. The image scales down to fit instead of stretching or clipping.
Trade-off (re-acknowledged from v1.0.11)
On viewports much wider than the image's natural size, the image now renders at its natural intrinsic size rather than stretching to fill the container width. This is the cost of aspect-preservation — the alternative is bottom-clipping when the image is tall.
If you'd rather stretch-fill (and accept clipping on small viewports), override in Divi → Custom CSS:
```css
#aqm-popup-content img { width: 100% !important; height: auto !important; }
```