:root {
    --swv-bg: #020617;
    --swv-toolbar-bg: rgba(15, 23, 42, 0.82);
    --swv-button-bg: #0f172a;
    --swv-button-text: #ffffff;
    --swv-hover-bg: #0879ef;
    --swv-hover-text: #ffffff;
    --swv-border: #334155;
    --swv-focus: #38bdf8;
    --swv-button-size: 42px;
    --swv-icon-size: 22px;
    --swv-font-size: 13px;
    --swv-button-radius: 10px;
    --swv-toolbar-radius: 14px;
    --swv-border-width: 1px;
    --swv-gap: 7px;
    --swv-toolbar-padding: 6px;
    --swv-image-padding: 0px;
    --swv-font-family: Montserrat, Arial, sans-serif;
    --swv-shadow: 0 12px 30px rgba(0, 0, 0, 0.32);
}

body.swv-is-open {
    overflow: hidden !important;
}

.swv {
    position: fixed;
    inset: 0;
    z-index: 2147483000;
    display: none;
    width: 100vw;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
    background: var(--swv-bg);
    color: var(--swv-button-text);
    font-family: var(--swv-font-family);
    isolation: isolate;
}

.swv.swv--opening,
.swv.swv--open,
.swv.swv--closing {
    display: block;
}

.swv__backdrop,
.swv__dialog {
    position: absolute;
    inset: 0;
}

.swv__backdrop {
    background: var(--swv-bg);
}

.swv__dialog {
    opacity: 0;
    outline: 0;
    pointer-events: none;
    transform: scale(0.992);
    transform-origin: center center;
    transition: opacity 220ms ease, transform 220ms ease;
}

.swv.swv--open .swv__dialog {
    opacity: 1;
    pointer-events: auto;
    transform: scale(1);
}

.swv.swv--closing .swv__dialog {
    opacity: 0;
    pointer-events: none;
    transform: scale(0.992);
}

.swv__stage {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    padding: var(--swv-image-padding);
    overflow: hidden;
    touch-action: none;
    user-select: none;
    cursor: default;
}

.swv__stage.swv__stage--movable {
    cursor: grab;
}

.swv__stage.swv__stage--dragging {
    cursor: grabbing;
}

.swv__stage.swv__stage--pinching {
    cursor: zoom-in;
}

.swv__image {
    display: block;
    visibility: hidden;
    width: auto;
    height: auto;
    max-width: calc(100vw - (var(--swv-image-padding) * 2));
    max-height: calc(100vh - (var(--swv-image-padding) * 2));
    max-height: calc(100dvh - (var(--swv-image-padding) * 2));
    object-fit: contain;
    transform: translate3d(0, 0, 0) scale(1);
    transform-origin: center center;
    will-change: transform;
    backface-visibility: hidden;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
    opacity: 0;
    transition: opacity 180ms ease;
}

.swv__image.swv__image--ready {
    visibility: visible;
    display: block;
    opacity: 1;
}

.swv__toolbar {
    position: absolute;
    z-index: 4;
    display: flex;
    align-items: center;
    gap: var(--swv-gap);
    padding: var(--swv-toolbar-padding);
    border: var(--swv-border-width) solid var(--swv-border);
    border-radius: var(--swv-toolbar-radius);
    background: var(--swv-toolbar-bg);
    box-shadow: var(--swv-shadow);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
}

.swv--orientation-horizontal .swv__toolbar {
    flex-direction: row;
}

.swv--orientation-vertical .swv__toolbar {
    flex-direction: column;
}

.swv--position-top-right .swv__toolbar {
    top: max(12px, env(safe-area-inset-top));
    right: max(12px, env(safe-area-inset-right));
}

.swv--position-top-left .swv__toolbar {
    top: max(12px, env(safe-area-inset-top));
    left: max(12px, env(safe-area-inset-left));
}

.swv--position-bottom-right .swv__toolbar {
    right: max(12px, env(safe-area-inset-right));
    bottom: max(12px, env(safe-area-inset-bottom));
}

.swv--position-bottom-left .swv__toolbar {
    bottom: max(12px, env(safe-area-inset-bottom));
    left: max(12px, env(safe-area-inset-left));
}

.swv__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: var(--swv-button-size);
    height: var(--swv-button-size);
    min-width: var(--swv-button-size);
    min-height: var(--swv-button-size);
    padding: 0;
    border: 0;
    border-radius: var(--swv-button-radius);
    background: var(--swv-button-bg);
    color: var(--swv-button-text);
    font-family: var(--swv-font-family);
    font-size: calc(var(--swv-icon-size) + 3px);
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
    transition: background-color 160ms ease, color 160ms ease, transform 160ms ease;
    -webkit-appearance: none;
    appearance: none;
}

.swv__button:hover {
    background: var(--swv-hover-bg);
    color: var(--swv-hover-text);
}

.swv__button:active {
    transform: scale(0.94);
}

.swv__button:focus-visible {
    outline: 3px solid var(--swv-focus);
    outline-offset: 2px;
}

.swv__button svg {
    width: var(--swv-icon-size);
    height: var(--swv-icon-size);
    fill: currentColor;
}

.swv__button--reset {
    width: calc(var(--swv-button-size) * 1.48);
    min-width: calc(var(--swv-button-size) * 1.48);
    font-size: var(--swv-font-size);
}

.swv--orientation-vertical .swv__button--reset {
    width: var(--swv-button-size);
    min-width: var(--swv-button-size);
    font-size: min(var(--swv-font-size), 11px);
}

.swv__button--close {
    font-size: calc(var(--swv-icon-size) + 10px);
    font-weight: 400;
}

.swv__loader,
.swv__error {
    position: absolute;
    z-index: 2;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 17px;
    border: var(--swv-border-width) solid var(--swv-border);
    border-radius: var(--swv-button-radius);
    background: var(--swv-toolbar-bg);
    color: var(--swv-button-text);
    font-size: 14px;
}

.swv__loader[hidden],
.swv__error[hidden] {
    display: none;
}

.swv__spinner {
    width: 20px;
    height: 20px;
    border: 3px solid rgba(255, 255, 255, 0.28);
    border: 3px solid color-mix(in srgb, var(--swv-button-text) 28%, transparent);
    border-top-color: var(--swv-focus);
    border-radius: 50%;
    animation: swv-spin 750ms linear infinite;
}

.swv__hint {
    position: absolute;
    z-index: 3;
    bottom: max(13px, env(safe-area-inset-bottom));
    left: 50%;
    transform: translateX(-50%);
    max-width: calc(100vw - 28px);
    padding: 8px 12px;
    border-radius: 999px;
    background: var(--swv-toolbar-bg);
    color: var(--swv-button-text);
    font-size: 12px;
    line-height: 1.3;
    text-align: center;
    white-space: nowrap;
    pointer-events: none;
    opacity: 1;
    transition: opacity 300ms ease;
}

.swv__hint.swv__hint--hidden {
    opacity: 0;
}

.swv__status {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

/*
 * Proteção contra os estilos globais de botões do Elementor e do tema.
 * O ID limita estas regras ao visualizador e o !important impede que as
 * cores globais do site substituam a personalização salva no plugin.
 */
#softwork-screen-viewer .swv__toolbar {
    gap: var(--swv-gap) !important;
    padding: var(--swv-toolbar-padding) !important;
    border-color: var(--swv-border) !important;
    border-style: solid !important;
    border-width: var(--swv-border-width) !important;
    border-radius: var(--swv-toolbar-radius) !important;
    background: var(--swv-toolbar-bg) !important;
    box-shadow: var(--swv-shadow) !important;
}

#softwork-screen-viewer .swv__button,
#softwork-screen-viewer .swv__button:hover,
#softwork-screen-viewer .swv__button:focus,
#softwork-screen-viewer .swv__button:active {
    box-sizing: border-box !important;
    width: var(--swv-button-size) !important;
    height: var(--swv-button-size) !important;
    min-width: var(--swv-button-size) !important;
    min-height: var(--swv-button-size) !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: var(--swv-button-radius) !important;
    background-color: var(--swv-button-bg) !important;
    background-image: none !important;
    color: var(--swv-button-text) !important;
    box-shadow: none !important;
    font-family: var(--swv-font-family) !important;
    font-size: calc(var(--swv-icon-size) + 3px) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
    text-shadow: none !important;
}

#softwork-screen-viewer .swv__button:hover {
    background-color: var(--swv-hover-bg) !important;
    color: var(--swv-hover-text) !important;
}

#softwork-screen-viewer .swv__button:focus-visible {
    outline: 3px solid var(--swv-focus) !important;
    outline-offset: 2px !important;
}

#softwork-screen-viewer .swv__button svg {
    width: var(--swv-icon-size) !important;
    height: var(--swv-icon-size) !important;
    fill: currentColor !important;
    color: inherit !important;
}

#softwork-screen-viewer .swv__button span {
    color: inherit !important;
}

#softwork-screen-viewer .swv__button--reset,
#softwork-screen-viewer .swv__button--reset:hover,
#softwork-screen-viewer .swv__button--reset:focus,
#softwork-screen-viewer .swv__button--reset:active {
    width: calc(var(--swv-button-size) * 1.48) !important;
    min-width: calc(var(--swv-button-size) * 1.48) !important;
    font-size: var(--swv-font-size) !important;
}

#softwork-screen-viewer .swv__button--close,
#softwork-screen-viewer .swv__button--close:hover,
#softwork-screen-viewer .swv__button--close:focus,
#softwork-screen-viewer .swv__button--close:active {
    font-size: calc(var(--swv-icon-size) + 10px) !important;
    font-weight: 400 !important;
}

#softwork-screen-viewer.swv--orientation-vertical .swv__button--reset {
    width: var(--swv-button-size) !important;
    min-width: var(--swv-button-size) !important;
    font-size: 11px !important;
}

@keyframes swv-spin {
    to {
        transform: rotate(360deg);
    }
}

@media (max-width: 767px) {
    .swv--position-top-right .swv__toolbar {
        top: max(8px, env(safe-area-inset-top));
        right: max(8px, env(safe-area-inset-right));
    }

    .swv--position-top-left .swv__toolbar {
        top: max(8px, env(safe-area-inset-top));
        left: max(8px, env(safe-area-inset-left));
    }

    .swv--position-bottom-right .swv__toolbar {
        right: max(8px, env(safe-area-inset-right));
        bottom: max(8px, env(safe-area-inset-bottom));
    }

    .swv--position-bottom-left .swv__toolbar {
        bottom: max(8px, env(safe-area-inset-bottom));
        left: max(8px, env(safe-area-inset-left));
    }

    .swv__hint {
        white-space: normal;
    }
}

@media (prefers-reduced-motion: reduce) {
    .swv__dialog,
    .swv__image,
    .swv__button,
    .swv__hint {
        transition: none;
    }
}