/**
 * Modulo: Liquid Glass Effect (Saglix)
 * Path: assets/css/liquid-glass.css
 */

/* ==========================================================================
   ?? IMPOSTAZIONI DEL VETRO E DELLA LUCE (Modifica questi valori)
   ========================================================================== */
:root {
    /* Core Liquid Glass - dimensioni fluide via clamp() */
    --glass-blur: clamp(3px, 0.5vw, 5px); /* Sfocatura: 3px su mobile → 5px su desktop */
    --glass-shadow: 0 clamp(15px, 3vw, 30px) clamp(15px, 3vw, 30px) rgba(0,0,0,0.1),
                    inset 0 0 20px rgba(0,0,0,0.1),
                    inset 3px 3px 2px -2px rgba(255,255,255,0.8),
                    inset -3px -3px 2px -2px rgba(255,255,255,0.8);

    /* Light Mouse - già scalano via vw, restano invariati */
    --glass-mouse-size: 20vw;
    --glass-mouse-bg: rgba(255, 255, 255, 0.5);
    --glass-mouse-blur: 5vw;
    --glass-mouse-transition: opacity 0.3s ease, top 0.05s ease, left 0.05s ease;
}

/* ==========================================================================
   ?? CORE LOGIC (Fedele al codice originale fornito)
   ========================================================================== */

/* Core Liquid Glass */
/* NOTA: manteniamo url(#liquidGlass) come fallback futuro. Oggi i browser stabili
   lo ignorano e applicano solo blur(); quando il supporto al chaining SVG-filter
   dentro backdrop-filter arriverà, l'effetto turbulence si attiverà automaticamente
   senza ulteriori modifiche al CSS. Il filtro SVG è iniettato dal footer
   (templates/liquid-glass-svg.php tramite hub_child_inject_svg_filter). */
.liquid-glass {
    backdrop-filter: url(#liquidGlass) blur(var(--glass-blur));
    -webkit-backdrop-filter: url(#liquidGlass) blur(var(--glass-blur));
    box-shadow: var(--glass-shadow) !important;
    overflow: hidden;
    position: relative; /* Richiesto per confinare la luce ::before all'interno del contenitore */
}

/* Light Mouse */
.liquid-glass::before {
    content: '';
    position: absolute;
    width: var(--glass-mouse-size);
    height: var(--glass-mouse-size);
    border-radius: 50%;
    background: var(--glass-mouse-bg);
    filter: blur(var(--glass-mouse-blur));
    pointer-events: none;
    transform: translate(-50%, -50%);
    top: var(--mouse-y, 50%);
    left: var(--mouse-x, 50%);
    opacity: 0;
    transition: var(--glass-mouse-transition);
    z-index: 0;
}

.liquid-glass:hover::before {
    opacity: 1;
}

/* Fix Elementor: Assicura che i contenuti testuali/link siano sopra l'effetto vetro/luce */
.liquid-glass > .elementor-container {
    position: relative;
    z-index: 1;
}

/* Su dispositivi touch primari (smartphone/tablet) non c'è cursore:
   nascondiamo la sfera di luce. Il blur del vetro resta visibile. */
@media (pointer: coarse) {
    .liquid-glass::before {
        display: none;
    }
}