
/* jx-Easy Image Overlay */

.jx-imageoverlay-wrapper {
    display: inline-grid;
    grid-template-columns: minmax(0, max-content);
    grid-template-rows: auto;
    max-width: 100%;
    position: relative;
    /* Top-align when multiple overlays sit inline (baseline makes the short image sink) */
    vertical-align: top;
    overflow: hidden;
}

/* Linked: one grid item wraps image + overlay stacked in the same cell */
.jx-imageoverlay-link {
    display: grid;
    grid-template-columns: minmax(0, max-content);
    grid-template-rows: auto;
    grid-column: 1;
    grid-row: 1;
    position: relative;
    max-width: 100%;
    text-decoration: none;
    color: inherit;
}

.jx-imageoverlay-link > .jx-imageoverlay-img {
    grid-column: 1;
    grid-row: 1;
    display: block;
    max-width: 100%;
    height: auto;
}

.jx-imageoverlay-link > .jx-imageoverlay,
.jx-imageoverlay-link > .jx-imageoverlay-on {
    grid-column: 1;
    grid-row: 1;
}

/* No link: image and overlay share one cell; image sizes the grid */
.jx-imageoverlay-wrapper > .jx-imageoverlay-img {
    grid-column: 1;
    grid-row: 1;
    display: block;
    max-width: 100%;
    height: auto;
}

.jx-imageoverlay-wrapper > .jx-imageoverlay,
.jx-imageoverlay-wrapper > .jx-imageoverlay-on {
    grid-column: 1;
    grid-row: 1;
}

.jx-imageoverlay,
.jx-imageoverlay-on {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: 1;
    transition-property: opacity, transform;
    transition-duration: var(--jx-overlay-duration, 0.8s);
    transition-timing-function: ease;
}

.jx-effect-slide-up {
    transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

/* Always-visible overlay: opacity comes from shortcode (inline style), not forced to 1 */

.jx-imageoverlay-container {
    display: grid;
    place-items: center;
    width: 100%;
    height: 100%;
    text-align: center;
}

.jx-imageoverlay-content {
    padding: 5px 10px;
}

/* Alignment helpers for caption placement */
.jx-imageoverlay-container.jx-align-top {
    align-items: flex-start;
}

.jx-imageoverlay-container.jx-align-bottom {
    align-items: flex-end;
}

.jx-imageoverlay-container.jx-align-left {
    justify-items: flex-start;
}

.jx-imageoverlay-container.jx-align-right {
    justify-items: flex-end;
}

.jx-imageoverlay-clearfix {
    clear: both;
}

.jx-img-left { float: left; }
.jx-img-right { float: right; }
.jx-img-margin-5{margin:5px;}.jx-img-margin-10{margin:10px;}.jx-img-margin-15{margin:15px;}.jx-img-margin-20{margin:20px;}.jx-img-margin-25{margin:25px;}.jx-img-margin-30{margin:30px;}.jx-img-margin-35{margin:35px;}.jx-img-margin-40{margin:40px;}
.jx-img-padding-5{padding:5px;}.jx-img-padding-10{padding:10px;}.jx-img-padding-15{padding:15px;}.jx-img-padding-20{padding:20px;}.jx-img-padding-25{padding:25px;}.jx-img-padding-30{padding:30px;}.jx-img-padding-35{padding:35px;}.jx-img-padding-40{padding:40px;}