/* Image Popup Pro: scoped frontend styles. */
.ipp-modal[hidden], .ipp-modal:not(.ipp-is-visible) { display: none !important; }
.ipp-modal {
    position: fixed; inset: 0; z-index: var(--ipp-layer, 999999);
    display: flex; justify-content: var(--ipp-justify, center); align-items: var(--ipp-align, center);
    padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
             max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
    box-sizing: border-box; overflow: auto; isolation: isolate;
    overscroll-behavior: contain;
}
.ipp-modal *, .ipp-modal *::before, .ipp-modal *::after { box-sizing: border-box; }
.ipp-backdrop { position: fixed; inset: 0; background: var(--ipp-overlay, rgba(0,0,0,.75)); z-index: -1; }
.ipp-dialog {
    position: relative; flex-shrink: 0; width: var(--ipp-width, 680px);
    min-width: min(var(--ipp-min-width, 0px), calc(100vw - 24px));
    max-width: min(var(--ipp-max-width, 980px), calc(100vw - 24px));
    max-height: min(var(--ipp-max-height, 90dvh), calc(100dvh - 24px));
    overflow: visible; margin: 0;
    background: var(--ipp-bg, #fff); border: var(--ipp-border-width, 0px) solid var(--ipp-border-color, #fff);
    border-radius: var(--ipp-radius, 6px); box-shadow: var(--ipp-shadow, none);
    padding: var(--ipp-pad-t, 0px) var(--ipp-pad-r, 0px) var(--ipp-pad-b, 0px) var(--ipp-pad-l, 0px);
    outline: none;
}
.ipp-dialog::after { content: ""; display: table; clear: both; }
.ipp-image-row { display: flex; align-items: flex-start; justify-content: var(--ipp-image-align, center); max-height: inherit; overflow: auto; scrollbar-width: thin; }
.ipp-media { display: inline-block; position: relative; width: fit-content; max-width: 100%; min-width: 0; vertical-align: top; line-height: 0; }
.ipp-image-link { display: block; line-height: 0; text-decoration: none; }
.ipp-image {
    display: block; width: auto; height: auto; max-width: 100%;
    max-height: max(60px, calc(var(--ipp-max-height, 90dvh) - var(--ipp-pad-t, 0px) - var(--ipp-pad-b, 0px) - 24px));
    object-fit: contain; border-radius: 0; margin: 0; padding: 0; box-shadow: none;
}
.ipp-modal[data-ipp-image-fit="cover"] .ipp-media { width: 100%; }
.ipp-modal[data-ipp-image-fit="cover"] .ipp-image {
    width: 100%; height: min(62dvh, 700px); max-height: max(60px, calc(var(--ipp-max-height, 90dvh) - var(--ipp-pad-t, 0px) - var(--ipp-pad-b, 0px) - 24px)); object-fit: cover;
}
.ipp-modal[data-ipp-image-fit="original"] .ipp-image { object-fit: scale-down; }
.ipp-hotspot, .ipp-button { position: absolute; z-index: 3; }
.ipp-hotspot { transform: translate(-50%, -50%); display: block; background: transparent; border: none; }
.ipp-button {
    left: var(--ipp-button-x, 50%); top: var(--ipp-button-y, 85%); transform: translate(-50%, -50%);
    width: var(--ipp-button-width, auto); max-width: min(95%, 100%);
    min-height: 34px; padding: var(--ipp-button-pady, 12px) var(--ipp-button-padx, 22px);
    display: inline-block; text-align: var(--ipp-button-align, center);
    border: var(--ipp-button-border, 0px) solid var(--ipp-button-border-color, #016088);
    border-radius: var(--ipp-button-radius, 5px); background: var(--ipp-button-bg, #016088);
    color: var(--ipp-button-color, #fff) !important;
    font-family: inherit; font-size: var(--ipp-button-font, 16px); font-weight: var(--ipp-button-weight, 700);
    line-height: 1.3; text-decoration: none !important; box-shadow: var(--ipp-button-shadow, none);
    white-space: normal; overflow-wrap: anywhere; cursor: pointer;
    transition: filter .16s ease, box-shadow .16s ease;
}
.ipp-button:hover { color: var(--ipp-button-color, #fff) !important; filter: brightness(.88); }
.ipp-button:focus-visible, .ipp-hotspot:focus-visible, .ipp-image-link:focus-visible {
    outline: 3px solid #ffb900; outline-offset: 3px;
}
.ipp-close {
    position: absolute; z-index: 9; top: var(--ipp-close-top, 10px);
    left: var(--ipp-close-left, auto); right: var(--ipp-close-right, 10px);
    transform: var(--ipp-close-transform, none);
    display: inline-flex; align-items: center; justify-content: center;
    width: var(--ipp-close-size, 42px); height: var(--ipp-close-size, 42px); min-width: 24px;
    border: 0; border-radius: var(--ipp-close-radius, 50%);
    color: var(--ipp-close-color, #111) !important; background: var(--ipp-close-bg, #fff) !important;
    box-shadow: 0 2px 12px rgba(0,0,0,.16); font-family: Arial, sans-serif;
    cursor: pointer; padding: 0; line-height: 1; -webkit-appearance: none; appearance: none;
}
.ipp-close span { font-size: var(--ipp-close-icon, 24px); line-height: 1; pointer-events: none; }
.ipp-close:hover { filter: brightness(.93); }
.ipp-close:focus-visible { outline: 3px solid #ffb900; outline-offset: 3px; }
.ipp-close-sr:not(:focus-visible) { clip-path: inset(50%); clip: rect(0 0 0 0); overflow: hidden; width: 1px; height: 1px; padding: 0; white-space: nowrap; }
.ipp-close-sr:focus-visible { clip: auto; clip-path: none; width: var(--ipp-close-size, 42px); height: var(--ipp-close-size, 42px); }
.ipp-trigger-button {
    appearance: none; border: 1px solid currentColor; background: transparent; color: inherit;
    cursor: pointer; padding: .6em 1em; border-radius: 4px; font: inherit;
}
.ipp-trigger-button:focus-visible { outline: 3px solid #016088; outline-offset: 3px; }
.ipp-animation-fade.ipp-is-visible { animation: ipp-overlay-fade .18s both; }
.ipp-animation-zoom.ipp-is-visible .ipp-dialog { animation: ipp-zoom .23s both; }
@keyframes ipp-overlay-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes ipp-zoom { from { opacity: 0; transform: scale(.94); } to { opacity: 1; transform: scale(1); } }
@media (max-width: 767px) {
    .ipp-modal[data-ipp-device="desktop"], .ipp-modal[data-ipp-mobile-visible="0"] { display: none !important; }
    .ipp-modal[data-ipp-mobile-settings="1"] .ipp-dialog {
        width: var(--ipp-m-width, 94%);
        max-width: min(var(--ipp-m-max-width, 680px), calc(100vw - 24px));
        max-height: min(var(--ipp-m-max-height, 90dvh), calc(100dvh - 24px));
        padding: var(--ipp-m-pad-t, 0px) var(--ipp-m-pad-r, 0px) var(--ipp-m-pad-b, 0px) var(--ipp-m-pad-l, 0px);
        border-radius: var(--ipp-m-radius, 6px);
    }
    .ipp-modal[data-ipp-mobile-settings="1"] .ipp-image {
        max-height: max(60px, calc(var(--ipp-m-max-height, 90dvh) - var(--ipp-m-pad-t, 0px) - var(--ipp-m-pad-b, 0px) - 24px));
    }
    .ipp-modal[data-ipp-mobile-settings="1"][data-ipp-mobile-fit="cover"] .ipp-media { width: 100%; }
    .ipp-modal[data-ipp-mobile-settings="1"][data-ipp-mobile-fit="cover"] .ipp-image {
        width: 100%; height: min(62dvh, 570px); object-fit: cover;
    }
    .ipp-modal[data-ipp-mobile-settings="1"][data-ipp-mobile-fit="contain"] .ipp-image { width: auto; height: auto; object-fit: contain; }
    .ipp-modal[data-ipp-mobile-settings="1"][data-ipp-mobile-fit="original"] .ipp-image { width: auto; height: auto; object-fit: scale-down; }
    .ipp-modal .ipp-button {
        left: var(--ipp-m-button-x, 50%); top: var(--ipp-m-button-y, 85%);
        font-size: var(--ipp-m-button-font, 14px);
        padding: var(--ipp-m-button-pady, 10px) var(--ipp-m-button-padx, 16px);
        width: var(--ipp-m-button-width, auto);
        background: var(--ipp-m-button-bg, #016088);
        color: var(--ipp-m-button-color, #fff) !important;
        font-weight: var(--ipp-m-button-weight, 700);
        text-align: var(--ipp-m-button-align, center);
        border: var(--ipp-m-button-border, 0px) solid var(--ipp-m-button-border-color, #016088);
        border-radius: var(--ipp-m-button-radius, 5px);
        box-shadow: var(--ipp-m-button-shadow, none);
    }
    .ipp-modal .ipp-button:hover { color: var(--ipp-m-button-color, #fff) !important; }
    .ipp-modal[data-ipp-mobile-settings="1"] .ipp-close {
        top: var(--ipp-m-close-top, 8px); left: var(--ipp-m-close-left, auto);
        right: var(--ipp-m-close-right, 8px); transform: var(--ipp-m-close-transform, none);
        width: var(--ipp-m-close-size, 38px); height: var(--ipp-m-close-size, 38px);
    }
}
@media (min-width: 768px) { .ipp-modal[data-ipp-device="mobile"] { display: none !important; } }
@media (max-height: 520px) {
    .ipp-modal { align-items: flex-start; }
    .ipp-dialog { margin: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .ipp-modal, .ipp-dialog, .ipp-button { animation: none !important; transition: none !important; }
}