/**
 * GW Glass Effect v2.0.2 - CSS
 * Apenas para Containers do Elementor
 * SEM overflow:hidden - Container funciona normalmente
 * Efeito glass via pseudo-elemento ::before isolado
 * @author Gerencie Web
 */

/* ==========================================
   CSS CUSTOM PROPERTIES (defaults)
   ========================================== */
.gw-glass-yes {
    --gw-glass-blur: 12px;
    --gw-glass-saturate: 180%;
    --gw-glass-brightness: 100%;
    --gw-glass-contrast: 100%;
    --gw-glass-bg: rgba(255, 255, 255, 0.15);
    --gw-glass-border-width: 1px;
    --gw-glass-border-color: rgba(255, 255, 255, 0.25);
    --gw-glass-shadow-color: rgba(31, 38, 135, 0.2);
    --gw-glass-shadow-blur: 32px;
    --gw-glass-shadow-y: 8px;
    --gw-glass-inset-color: rgba(255, 255, 255, 0.3);
    --gw-glass-inset-blur: 20px;
    --gw-glass-grad-color1: rgba(255, 255, 255, 0.6);
    --gw-glass-grad-color2: rgba(255, 255, 255, 0.1);
    --gw-glass-grad-angle: 135deg;
    --gw-glass-glint-speed: 5s;
    --gw-glass-glint-color: rgba(255, 255, 255, 0.8);
    --gw-glass-shine-opacity: 0.5;
    --gw-glass-hover-blur: 20px;
    --gw-glass-hover-bg: rgba(255, 255, 255, 0.25);
    --gw-glass-hover-shadow-color: rgba(31, 38, 135, 0.35);
    --gw-glass-transition: 0.3s;
    --gw-glass-texture-opacity: 0.15;
    --gw-glass-texture-scale: 1;
    --gw-3d-shadow-color: rgba(31, 38, 135, 0.25);
    --gw-3d-intensity: 1;
}

/* ==========================================
   BASE GLASS EFFECT
   O container mantém overflow visível.
   O efeito glass fica no ::before (camada atrás do conteúdo).
   ========================================== */
.gw-glass-yes {
    position: relative;
    /* SEM overflow:hidden - elementos filhos podem sair do container */
    border: var(--gw-glass-border-width) solid var(--gw-glass-border-color) !important;
    box-shadow: 0 var(--gw-glass-shadow-y) var(--gw-glass-shadow-blur) var(--gw-glass-shadow-color);
    /* Fundo transparente no container - o fundo fica no ::before */
    background-color: transparent !important;
}

/* Camada de vidro (backdrop-filter + cor de fundo) */
.gw-glass-yes::before {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background-color: var(--gw-glass-bg);
    backdrop-filter: blur(var(--gw-glass-blur)) saturate(var(--gw-glass-saturate)) brightness(var(--gw-glass-brightness)) contrast(var(--gw-glass-contrast));
    -webkit-backdrop-filter: blur(var(--gw-glass-blur)) saturate(var(--gw-glass-saturate)) brightness(var(--gw-glass-brightness)) contrast(var(--gw-glass-contrast));
    pointer-events: none;
    z-index: 0;
}

/* Garante que o conteúdo do container fique acima do ::before */
.gw-glass-yes > * {
    position: relative;
    z-index: 1;
}

/* Elementos internos do GW Glass (overlays, SVGs) ficam em z-index baixo */
.gw-glass-yes > .gw-glass-texture-overlay,
.gw-glass-yes > .gw-glass-shine-layer,
.gw-glass-yes > .gw-glass-liquid-edge,
.gw-glass-yes > .gw-glass-svg-defs,
.gw-glass-yes > .gw-glass-glint-layer {
    z-index: 0;
}

/* ==========================================
   PRESETS - GLASSMORPHISM
   ========================================== */
.gw-glass-preset-frost-light {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 180%;
    --gw-glass-bg: rgba(255, 255, 255, 0.25);
    --gw-glass-border-color: rgba(255, 255, 255, 0.4);
    --gw-glass-shadow-color: rgba(31, 38, 135, 0.15);
}

.gw-glass-preset-frost-dark {
    --gw-glass-blur: 18px;
    --gw-glass-saturate: 160%;
    --gw-glass-bg: rgba(0, 0, 0, 0.35);
    --gw-glass-border-color: rgba(255, 255, 255, 0.12);
    --gw-glass-shadow-color: rgba(0, 0, 0, 0.4);
}

.gw-glass-preset-crystal-clear {
    --gw-glass-blur: 8px;
    --gw-glass-saturate: 200%;
    --gw-glass-brightness: 110%;
    --gw-glass-bg: rgba(255, 255, 255, 0.08);
    --gw-glass-border-color: rgba(255, 255, 255, 0.5);
    --gw-glass-shadow-color: rgba(31, 38, 135, 0.1);
}

.gw-glass-preset-smoky {
    --gw-glass-blur: 30px;
    --gw-glass-saturate: 120%;
    --gw-glass-brightness: 90%;
    --gw-glass-bg: rgba(50, 50, 50, 0.3);
    --gw-glass-border-color: rgba(255, 255, 255, 0.08);
    --gw-glass-shadow-color: rgba(0, 0, 0, 0.35);
}

.gw-glass-preset-aurora {
    --gw-glass-blur: 20px;
    --gw-glass-saturate: 250%;
    --gw-glass-brightness: 105%;
    --gw-glass-border-color: rgba(180, 130, 255, 0.3);
    --gw-glass-shadow-color: rgba(120, 0, 255, 0.2);
}
.gw-glass-preset-aurora::before {
    background: linear-gradient(135deg, rgba(120, 0, 255, 0.12), rgba(0, 200, 200, 0.12)) !important;
}

.gw-glass-preset-neon-glow {
    --gw-glass-blur: 14px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(10, 10, 30, 0.5);
    --gw-glass-border-color: rgba(0, 200, 255, 0.4);
    --gw-glass-shadow-color: rgba(0, 200, 255, 0.25);
    box-shadow: 0 var(--gw-glass-shadow-y) var(--gw-glass-shadow-blur) var(--gw-glass-shadow-color),
                inset 0 0 30px rgba(0, 200, 255, 0.05) !important;
}

.gw-glass-preset-morphic-dark {
    --gw-glass-blur: 22px;
    --gw-glass-saturate: 150%;
    --gw-glass-brightness: 85%;
    --gw-glass-bg: rgba(15, 15, 25, 0.55);
    --gw-glass-border-color: rgba(255, 255, 255, 0.06);
    --gw-glass-shadow-color: rgba(0, 0, 0, 0.5);
}

.gw-glass-preset-ice {
    --gw-glass-blur: 20px;
    --gw-glass-saturate: 160%;
    --gw-glass-brightness: 115%;
    --gw-glass-bg: rgba(200, 230, 255, 0.15);
    --gw-glass-border-color: rgba(200, 230, 255, 0.35);
    --gw-glass-shadow-color: rgba(100, 150, 200, 0.2);
}

.gw-glass-preset-warm-glass {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 190%;
    --gw-glass-brightness: 105%;
    --gw-glass-bg: rgba(255, 200, 150, 0.12);
    --gw-glass-border-color: rgba(255, 200, 150, 0.3);
    --gw-glass-shadow-color: rgba(200, 100, 50, 0.2);
}

/* ==========================================
   PRESETS - FROSTED
   ========================================== */
.gw-glass-preset-frosted-light {
    --gw-glass-blur: 30px;
    --gw-glass-saturate: 150%;
    --gw-glass-bg: rgba(255, 255, 255, 0.35);
    --gw-glass-border-color: rgba(255, 255, 255, 0.5);
}

.gw-glass-preset-frosted-heavy {
    --gw-glass-blur: 50px;
    --gw-glass-saturate: 120%;
    --gw-glass-bg: rgba(255, 255, 255, 0.5);
    --gw-glass-border-color: rgba(255, 255, 255, 0.6);
}

.gw-glass-preset-frosted-warm {
    --gw-glass-blur: 35px;
    --gw-glass-saturate: 170%;
    --gw-glass-bg: rgba(255, 220, 180, 0.25);
    --gw-glass-border-color: rgba(255, 200, 150, 0.35);
}

.gw-glass-preset-frosted-cool {
    --gw-glass-blur: 35px;
    --gw-glass-saturate: 170%;
    --gw-glass-bg: rgba(180, 210, 255, 0.25);
    --gw-glass-border-color: rgba(150, 190, 255, 0.35);
}

.gw-glass-preset-frosted-dark {
    --gw-glass-blur: 40px;
    --gw-glass-saturate: 130%;
    --gw-glass-brightness: 80%;
    --gw-glass-bg: rgba(0, 0, 0, 0.4);
    --gw-glass-border-color: rgba(255, 255, 255, 0.08);
}

/* ==========================================
   PRESETS - LIQUID
   ========================================== */
.gw-glass-preset-liquid-subtle {
    --gw-glass-blur: 10px;
    --gw-glass-saturate: 180%;
    --gw-glass-bg: rgba(255, 255, 255, 0.08);
    --gw-glass-border-color: rgba(255, 255, 255, 0.2);
}

.gw-glass-preset-liquid-bold {
    --gw-glass-blur: 18px;
    --gw-glass-saturate: 220%;
    --gw-glass-bg: rgba(255, 255, 255, 0.15);
    --gw-glass-border-color: rgba(255, 255, 255, 0.35);
}

.gw-glass-preset-liquid-rainbow {
    --gw-glass-blur: 14px;
    --gw-glass-saturate: 280%;
    --gw-glass-brightness: 110%;
    --gw-glass-bg: rgba(255, 255, 255, 0.1);
    --gw-glass-border-color: rgba(255, 255, 255, 0.25);
}

/* ==========================================
   PRESETS - TINTED
   ========================================== */
.gw-glass-preset-tinted-rose {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(255, 100, 130, 0.15);
    --gw-glass-border-color: rgba(255, 150, 170, 0.3);
    --gw-glass-shadow-color: rgba(255, 50, 80, 0.15);
}

.gw-glass-preset-tinted-ocean {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(0, 120, 200, 0.15);
    --gw-glass-border-color: rgba(80, 170, 255, 0.3);
    --gw-glass-shadow-color: rgba(0, 80, 180, 0.15);
}

.gw-glass-preset-tinted-mint {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(0, 200, 150, 0.12);
    --gw-glass-border-color: rgba(80, 230, 180, 0.3);
    --gw-glass-shadow-color: rgba(0, 150, 100, 0.15);
}

.gw-glass-preset-tinted-amber {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(255, 180, 50, 0.15);
    --gw-glass-border-color: rgba(255, 200, 100, 0.3);
    --gw-glass-shadow-color: rgba(200, 130, 0, 0.15);
}

.gw-glass-preset-tinted-violet {
    --gw-glass-blur: 16px;
    --gw-glass-saturate: 200%;
    --gw-glass-bg: rgba(140, 50, 255, 0.15);
    --gw-glass-border-color: rgba(170, 100, 255, 0.3);
    --gw-glass-shadow-color: rgba(100, 0, 200, 0.15);
}

/* ==========================================
   TIPO: FROSTED GLASS (blur forte)
   ========================================== */
.gw-glass-type-frosted.gw-glass-yes {
    --gw-glass-blur: 30px;
}

/* ==========================================
   TIPO: TEXTURED (base)
   ========================================== */
.gw-glass-type-textured.gw-glass-yes {
    --gw-glass-blur: 10px;
}

/* ==========================================
   TIPO: WET & DISTORTED (SVG filter override)
   Desativa backdrop-filter no ::before
   ========================================== */
.gw-glass-type-wet.gw-glass-yes::before,
.gw-glass-type-distorted.gw-glass-yes::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* ==========================================
   INSET SHADOW
   ========================================== */
.gw-glass-yes[data-gw-glass-inset="yes"] {
    box-shadow: 0 var(--gw-glass-shadow-y) var(--gw-glass-shadow-blur) var(--gw-glass-shadow-color),
                inset 0 0 var(--gw-glass-inset-blur) var(--gw-glass-inset-color);
}

/* ==========================================
   BORDER GRADIENT
   Usa um elemento separado injetado via JS
   (::before já está ocupado pelo glass layer)
   ========================================== */
.gw-glass-yes[data-gw-glass-gradient="yes"] {
    border: none !important;
}

.gw-glass-yes[data-gw-glass-gradient="yes"] > .gw-glass-border-gradient {
    content: '';
    position: absolute;
    inset: 0;
    border-radius: inherit;
    padding: var(--gw-glass-border-width);
    background: linear-gradient(var(--gw-glass-grad-angle), var(--gw-glass-grad-color1), var(--gw-glass-grad-color2));
    -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    -webkit-mask-composite: xor;
    mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
    mask-composite: exclude;
    pointer-events: none;
    z-index: 0;
}

/* ==========================================
   TEXTURE OVERLAY
   ========================================== */
.gw-glass-yes > .gw-glass-texture-overlay {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    opacity: var(--gw-glass-texture-opacity);
    mix-blend-mode: overlay;
    overflow: hidden;
}

/* ==========================================
   GLINT ANIMATION
   Usa elemento injetado via JS em vez de ::after
   (para não conflitar e manter overflow livre)
   ========================================== */
.gw-glass-glint-yes.gw-glass-yes > .gw-glass-glint-layer {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    overflow: hidden;
    pointer-events: none;
    z-index: 0;
}

.gw-glass-glint-yes.gw-glass-yes > .gw-glass-glint-layer > .gw-glass-glint-beam {
    position: absolute;
    top: 0;
    left: -100%;
    width: 60%;
    height: 100%;
    background: linear-gradient(
        90deg,
        transparent,
        var(--gw-glass-glint-color),
        transparent
    );
    opacity: 0.3;
    transform: skewX(-20deg);
    animation: gw-glass-glint var(--gw-glass-glint-speed) ease-in-out infinite;
}

@keyframes gw-glass-glint {
    0%, 100% {
        left: -100%;
        opacity: 0;
    }
    50% {
        left: 120%;
        opacity: 0.3;
    }
}

/* ==========================================
   LIQUID SHINE (reflexo interno)
   ========================================== */
.gw-glass-shine-yes.gw-glass-yes > .gw-glass-shine-layer {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
    background: linear-gradient(
        160deg,
        rgba(255, 255, 255, var(--gw-glass-shine-opacity)) 0%,
        rgba(255, 255, 255, 0.05) 30%,
        transparent 60%
    );
}

/* ==========================================
   SOMBRA 3D - ESTILOS
   ========================================== */

/* Flutuação Suave */
.gw-glass-3d-yes.gw-glass-3d-style-soft-float {
    box-shadow:
        0 calc(2px * var(--gw-3d-intensity)) calc(4px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(4px * var(--gw-3d-intensity)) calc(8px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(8px * var(--gw-3d-intensity)) calc(16px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(16px * var(--gw-3d-intensity)) calc(32px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color) !important;
}

/* Elevação Forte */
.gw-glass-3d-yes.gw-glass-3d-style-hard-lift {
    box-shadow:
        0 calc(1px * var(--gw-3d-intensity)) calc(2px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(4px * var(--gw-3d-intensity)) calc(6px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(12px * var(--gw-3d-intensity)) calc(20px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(24px * var(--gw-3d-intensity)) calc(48px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color) !important;
}

/* Camadas Profundas */
.gw-glass-3d-yes.gw-glass-3d-style-deep-layer {
    box-shadow:
        0 calc(1px * var(--gw-3d-intensity)) calc(1px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(2px * var(--gw-3d-intensity)) calc(2px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(4px * var(--gw-3d-intensity)) calc(4px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(8px * var(--gw-3d-intensity)) calc(8px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(16px * var(--gw-3d-intensity)) calc(16px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(32px * var(--gw-3d-intensity)) calc(32px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color) !important;
}

/* Neon 3D */
.gw-glass-3d-yes.gw-glass-3d-style-neon-3d {
    box-shadow:
        0 0 calc(5px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 0 calc(15px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 0 calc(30px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 0 calc(60px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color) !important;
}

/* Prateleira de Vidro */
.gw-glass-3d-yes.gw-glass-3d-style-glass-shelf {
    box-shadow:
        0 calc(1px * var(--gw-3d-intensity)) calc(3px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        0 calc(6px * var(--gw-3d-intensity)) calc(12px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        inset 0 calc(-2px * var(--gw-3d-intensity)) calc(6px * var(--gw-3d-intensity)) rgba(255, 255, 255, 0.1),
        inset 0 calc(2px * var(--gw-3d-intensity)) calc(6px * var(--gw-3d-intensity)) rgba(255, 255, 255, 0.05) !important;
}

/* Relevo (Emboss) */
.gw-glass-3d-yes.gw-glass-3d-style-emboss {
    box-shadow:
        calc(-2px * var(--gw-3d-intensity)) calc(-2px * var(--gw-3d-intensity)) calc(6px * var(--gw-3d-intensity)) rgba(255, 255, 255, 0.15),
        calc(2px * var(--gw-3d-intensity)) calc(2px * var(--gw-3d-intensity)) calc(6px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color),
        inset calc(-1px * var(--gw-3d-intensity)) calc(-1px * var(--gw-3d-intensity)) calc(3px * var(--gw-3d-intensity)) rgba(255, 255, 255, 0.1),
        inset calc(1px * var(--gw-3d-intensity)) calc(1px * var(--gw-3d-intensity)) calc(3px * var(--gw-3d-intensity)) var(--gw-3d-shadow-color) !important;
}

/* ==========================================
   SVG FILTER CONTAINERS (distorted/wet)
   ========================================== */
.gw-glass-yes > .gw-glass-svg-defs {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    pointer-events: none;
}

/* ==========================================
   LIQUID GLASS EDGE EFFECT
   ========================================== */
.gw-glass-type-liquid.gw-glass-yes > .gw-glass-liquid-edge {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
}

/* ==========================================
   HOVER EFFECTS
   ========================================== */
.gw-glass-hover-yes.gw-glass-yes {
    transition: all var(--gw-glass-transition) cubic-bezier(0.4, 0, 0.2, 1);
}

.gw-glass-hover-yes.gw-glass-yes::before {
    transition: all var(--gw-glass-transition) cubic-bezier(0.4, 0, 0.2, 1);
}

.gw-glass-hover-yes.gw-glass-yes:hover::before {
    backdrop-filter: blur(var(--gw-glass-hover-blur)) saturate(var(--gw-glass-saturate)) brightness(var(--gw-glass-brightness)) contrast(var(--gw-glass-contrast));
    -webkit-backdrop-filter: blur(var(--gw-glass-hover-blur)) saturate(var(--gw-glass-saturate)) brightness(var(--gw-glass-brightness)) contrast(var(--gw-glass-contrast));
    background-color: var(--gw-glass-hover-bg);
}

.gw-glass-hover-yes.gw-glass-yes:hover {
    box-shadow: 0 calc(var(--gw-glass-shadow-y) * 1.5) calc(var(--gw-glass-shadow-blur) * 1.3) var(--gw-glass-hover-shadow-color);
}

/* Hover não afeta tipos SVG */
.gw-glass-hover-yes.gw-glass-type-wet.gw-glass-yes:hover::before,
.gw-glass-hover-yes.gw-glass-type-distorted.gw-glass-yes:hover::before {
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
}

/* ==========================================
   EDITOR STYLES
   ========================================== */
.elementor-editor-active .gw-glass-yes {
    min-height: 50px;
}
