/**
 * Loader datacenter — paridade com React/Uiverse (vajion_7943)
 * Wrapper: .womm-server-loader (equivalente ao StyledWrapper)
 */

.womm-server-loader {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 0;
}

/* Escala igual ao React: zoom 0.3 no SVG 477×578 (bounce definido abaixo no mesmo seletor) */

/* Firefox / browsers sem zoom: mesma escala via transform */
@supports not (zoom: 0.3) {
    .womm-server-loader #svg_svg {
        -webkit-transform: scale(0.3);
        transform: scale(0.3);
        -webkit-transform-origin: center center;
        transform-origin: center center;
    }
}

.womm-server-loader--lg #svg_svg {
    zoom: 0.4;
}

@supports not (zoom: 0.4) {
    .womm-server-loader--lg #svg_svg {
        -webkit-transform: scale(0.4);
        transform: scale(0.4);
    }
}

/* Overlay fullscreen — padrão v2 + datacenter (compatível window.loading) */
.loading-overlay,
.womm-server-loader-overlay,
.ga-loading-overlay.womm-server-loader-overlay,
#loading.loading-overlay,
#loading.womm-server-loader-overlay {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 10000;
    background-color: rgba(255, 255, 255, 0.92);
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 16px;
}

.womm-server-loader-overlay:not(.active):not(.is-active),
.loading-overlay:not(.active):not(.is-active),
#loading.loading-overlay:not(.active):not(.is-active),
#loading.womm-server-loader-overlay:not(.active):not(.is-active) {
    pointer-events: none;
}

.loading-overlay.active,
.loading-overlay.is-active,
.womm-server-loader-overlay.is-active,
.womm-server-loader-overlay.active,
.ga-loading-overlay.active,
#loading.loading-overlay.active,
#loading.womm-server-loader-overlay.active,
#loading.loading-overlay[style*="flex"],
#loading.womm-server-loader-overlay[style*="flex"] {
    display: flex;
}

/* jQuery .show() legado pode definir display:block — força flex para centralizar */
#loading.loading-overlay[style*="display: block"],
#loading.womm-server-loader-overlay[style*="display: block"],
#loading.loading-overlay[style*="display:block"],
#loading.womm-server-loader-overlay[style*="display:block"] {
    display: flex !important;
}

/* Atendimento: z-index acima do layout legado */
#loading.atend-global-loading,
.womm-server-loader-overlay.atend-global-loading {
    z-index: 1501;
}

/* Login/auth: z-index acima do modal de login (.womm-modal-ui = 10050) */
#loading.womm-auth-loading,
.womm-server-loader-overlay.womm-auth-loading {
    z-index: 10060;
}

.womm-server-loader-overlay__text,
.loading-overlay .womm-server-loader-overlay__text,
.ga-loading-overlay .ga-loading-text {
    margin: 0;
    font-family: Inter, "Segoe UI", sans-serif;
    font-size: 15px;
    font-weight: 500;
    color: #64748b;
}

.womm-server-loader .estrobo_animation {
    animation:
        floatAndBounce 4s infinite ease-in-out,
        strobe 0.8s infinite;
}

.womm-server-loader .estrobo_animationV2 {
    animation:
        floatAndBounce 4s infinite ease-in-out,
        strobev2 0.8s infinite;
}

/* Vários elementos com id="float_server" — seletor por atributo (não #id) */
.womm-server-loader [id="float_server"] {
    animation: floatAndBounce 4s infinite ease-in-out;
}

.womm-server-loader #svg_svg {
    zoom: 0.3;
}

@keyframes floatAndBounce {
    0%,
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    50% {
        -webkit-transform: translateY(-20px);
        transform: translateY(-20px);
    }
}

@keyframes strobe {
    0%,
    50%,
    100% {
        fill: #17e300;
    }

    25%,
    75% {
        fill: #17e300b4;
    }
}

@keyframes strobev2 {
    0%,
    50%,
    100% {
        fill: rgb(255, 95, 74);
    }

    25%,
    75% {
        fill: rgb(16, 53, 115);
    }
}

@keyframes animateGradient {
    0% {
        stop-color: #313f8773;
    }

    50% {
        stop-color: #040d3a;
    }

    100% {
        stop-color: #313f8773;
    }
}

.womm-server-loader #paint13_linear_163_1030 stop {
    animation: animateGradient 4s infinite alternate;
}

@media (prefers-reduced-motion: reduce) {
    .womm-server-loader .estrobo_animation,
    .womm-server-loader .estrobo_animationV2,
    .womm-server-loader [id="float_server"] {
        animation: none;
    }

    .womm-server-loader #paint13_linear_163_1030 stop {
        animation: none;
    }
}