/* LR SOOMI - Originale Elementor Site Settings > Custom CSS; mantenuto invariato. */
:root {
    --lr-soomi-widget-gap: 1.4vw;
    --radius-none: 0;
    --radius-s: 0.6vw;
    --radius-m: 1.2vw;
    --radius-l: 1.7vw;
    --radius-pill: 100vw;
    --lr-treatments-icon-size: 2vw;
    --lr-wa-icon-size: 2vw;
    --lr-wa-padding: 1vw;
    --lr-wa-aspect-ratio: 1/1;
    --lr-wa-radius: 100vw;
}
.elementor-icon-wrapper {
    display: flex;
}
video.elementor-background-video-hosted {
    width: 100% !important;
    height: 100% !important;
}
.elementor-widget-off-canvas .e-off-canvas[aria-label="Menu Laterale"] {
    height: 100dvh;
    left: -3vw;
    top: -2.5vw;
    width: calc(100% + 6vw);
}
a.dialog-close-button.dialog-lightbox-close-button,
a:focus-visible {
    box-shadow: none !important;
    outline: none !important;
    outline-offset: 0 !important;
}
@media (max-width: 1024px) {
    :root {
        --lr-soomi-widget-gap: 2.8vw;
        --radius-s: 1.2vw;
        --radius-m: 2.4vw;
        --radius-l: 3.4vw;
        --lr-treatments-icon-size: 4vw;
    }
    .elementor-widget-off-canvas .e-off-canvas[aria-label="Menu Laterale"] {
        height: 100dvh;
        left: -5vw;
        top: -5vw;
        width: calc(100% + 10vw);
    }
    #bso-header.lr-h-bg-active .lr-soomi-header-cta a {
        color: var(--e-global-color-cf1b55c);
        fill: var(--e-global-color-cf1b55c);
        border-color: var(--e-global-color-cf1b55c);
    }
}

@media (max-width: 767px) {
    :root {
        --lr-soomi-widget-gap: 5.6vw;
        --radius-s: 2.4vw;
        --radius-m: 4.8vw;
        --radius-l: 6.8vw;
        --lr-treatments-icon-size: 8vw;
    }
    .elementor-widget-off-canvas .e-off-canvas[aria-label="Menu Laterale"] {
        top: -10vw;
    }
}

/* ==========================================================
   LR SOOMI PRODUCTS SLIDER
   Responsive Navigation
   ========================================================== */


/* ----------------------------------------------------------
   DESKTOP + TABLET
   Pagination nascosta
   ---------------------------------------------------------- */

@media (min-width: 768px) {

    .lr-soomi-products-slider .swiper-pagination {
        display: none !important;
    }

}


/* ----------------------------------------------------------
   MOBILE
   Arrows nascoste
   ---------------------------------------------------------- */

@media (max-width: 767px) {

    .lr-soomi-products-slider .elementor-swiper-button {
        display: none !important;
    }

}


/* ==========================================================
   LR SOOMI TEMPLATE CUSTOM CSS
   Version: 1.1.0
   Namespace: lr-soomi- / lr-

   DESTINAZIONE
   Elementor > Site Settings > Custom CSS

   CONFINE DEL FILE
   Questo file contiene esclusivamente proprieta' che non
   possono essere governate in modo globale e riutilizzabile
   tramite Global Colors, Global Fonts, Theme Style, Layout
   Settings o controlli nativi dei componenti Elementor.

   NON DEFINISCE
   - font e tipografie;
   - colori standard e stati UI;
   - spacing di sezioni e componenti;
   - radius, border e padding standard;
   - layout ottenibili tramite Flexbox Container.
   ========================================================== */


/* ==========================================================
   01. TOKEN TECNICI CUSTOM
   ========================================================== */

:root {

    /* Minimi dimensionali non disponibili come stile globale
       unico nel pannello Theme Style Buttons. */

    --lr-soomi-button-min-height: 3.5vw;
    --lr-soomi-button-min-width: 12vw;


    /* ======================================================
       LR LIQUID GLASS SYSTEM V1

       GOLDEN VISUAL REFERENCE:
       SOOMI Coming Soon

       Questi valori costituiscono il materiale ottico
       canonico e non devono essere ridefiniti localmente.
       ====================================================== */


    /* ------------------------------------------------------
       GLASS SURFACE

       Identico alla Coming Soon.
       ------------------------------------------------------ */

    --lr-glass-background:
        rgba(254, 249, 245, 0.20);


    /* ------------------------------------------------------
       FALLBACK SURFACE

       La Coming Soon mantiene la stessa superficie anche
       quando backdrop-filter non è disponibile.

       Non viene quindi aumentata artificialmente l'opacità.
       ------------------------------------------------------ */

    --lr-glass-background-fallback:
        rgba(254, 249, 245, 0.20);


    /* ------------------------------------------------------
       REDUCED TRANSPARENCY

       Eccezione accessibilità. Non interviene nella normale
       resa grafica del materiale.
       ------------------------------------------------------ */

    --lr-glass-background-reduced:
        rgba(254, 249, 245, 0.88);


    /* ------------------------------------------------------
       INTERNAL LIGHT / EDGE HIGHLIGHT

       Identico alla Coming Soon.

       Non costituisce un border CSS:
       l'edge luminoso è generato esclusivamente tramite
       inset box-shadow.
       ------------------------------------------------------ */

    --lr-glass-shadow:
        0 0 12px 0 rgba(255, 255, 255, 0.25) inset,
        0 0 4px 0 rgba(255, 255, 255, 1) inset;


    /* ------------------------------------------------------
       SVG REFRACTION FILTER

       La definizione SVG con questo ID deve essere la stessa
       utilizzata nella Coming Soon.
       ------------------------------------------------------ */

    --lr-glass-filter:
        url("#lr-liquid-glass-filter-v1");


    /* ------------------------------------------------------
       OPTICAL PARAMETERS

       Identici alla Coming Soon.
       ------------------------------------------------------ */

    --lr-glass-blur:
        1px;

    --lr-glass-brightness:
        1.1;

    --lr-glass-contrast:
        1.1;


    /* ------------------------------------------------------
       WEBKIT / COMPATIBILITY PIPELINE

       Identica al fallback WebKit della Coming Soon.

       SVG url() escluso intenzionalmente.
       ------------------------------------------------------ */

    --lr-glass-backdrop-fallback:
        blur(var(--lr-glass-blur))
        brightness(var(--lr-glass-brightness))
        contrast(var(--lr-glass-contrast));


    /* ------------------------------------------------------
       STANDARD / ENHANCED PIPELINE

       Identica alla pipeline principale della Coming Soon:

       SVG refraction
       + micro blur
       + brightness
       + contrast
       ------------------------------------------------------ */

    --lr-glass-backdrop-enhanced:
        var(--lr-glass-filter)
        blur(var(--lr-glass-blur))
        brightness(var(--lr-glass-brightness))
        contrast(var(--lr-glass-contrast));
}


/* ==========================================================
   02. RESPONSIVE BUTTON MINIMUMS
   Breakpoint tecnici coerenti con Elementor.
   ========================================================== */

@media (max-width: 1024px) {
    :root {
        --lr-soomi-button-min-height: 7vw;
        --lr-soomi-button-min-width: 24vw;
    }
}

@media (max-width: 767px) {
    :root {
        --lr-soomi-button-min-height: 14vw;
        --lr-soomi-button-min-width: 48vw;
    }
}


/* ==========================================================
   03. BUTTON MINIMUM GEOMETRY

   Assegnare lr-btn al widget Button Elementor.
   Tipografia, colori, border, radius, padding e stati restano
   nel Theme Style o nel componente Elementor.
   ========================================================== */

.lr-btn.elementor-widget-button .elementor-button,
:is(a, button).lr-btn {
    min-height: var(--lr-soomi-button-min-height);
    min-width: var(--lr-soomi-button-min-width);

    display: inline-flex;
    flex-flow: row nowrap;
    align-items: center;
    justify-content: center;
}


/* ==========================================================
   04. FOCUS VISIBILE ACCESSIBILE

   Il colore usa lo slot Secondary del Global Kit Elementor.
   Gli spessori in px sono intenzionali e fisicamente stabili.
   ========================================================== */

:where(
    a,
    button,
    input,
    select,
    textarea,
    [tabindex]:not([tabindex="-1"])
):focus-visible {
    outline: 2px solid var(--e-global-color-secondary);
    outline-offset: 3px;
}


/* ==========================================================
   05. LR LIQUID GLASS SYSTEM V1

   PUBLIC API
   .lr-liquid-glass

   GOLDEN VISUAL REFERENCE
   SOOMI Coming Soon

   PRINCIPIO
   - un solo materiale glass;
   - resa ottica identica alla Coming Soon;
   - nessuna variante per tipo di componente;
   - Elementor viene gestito automaticamente dai selector;
   - dimensioni, padding, radius e layout restano nativi;
   - il materiale non utilizza un vero border CSS.
   ========================================================== */


/* ==========================================================
   05.1 CANONICAL MATERIAL TARGETING
   ========================================================== */

:is(

    /* HTML diretto / Elementor Container */

    .lr-liquid-glass:not(.elementor-widget),


    /* Elementor Button */

    .lr-liquid-glass.elementor-widget-button
        .elementor-button,


    /* Elementor Nav Menu */

    .lr-liquid-glass.elementor-widget-nav-menu,


    /* Elementor Nav Menu Submenu */

    .lr-liquid-glass.elementor-widget-nav-menu
        .sub-menu,


    /* Generic Elementor Widget */

    .lr-liquid-glass.elementor-widget:not(
        .elementor-widget-button
    ):not(
        .elementor-widget-nav-menu
    ) > .elementor-widget-container

) {

    /* ------------------------------------------------------
       GLASS SURFACE
       Coming Soon reference.
       ------------------------------------------------------ */

    background:
        var(--lr-glass-background) !important;


    /* ------------------------------------------------------
       INTERNAL LIGHT / EDGE HIGHLIGHT
       Coming Soon reference.
       ------------------------------------------------------ */

    box-shadow:
        var(--lr-glass-shadow) !important;


    /* ------------------------------------------------------
       BORDER PROTECTION

       Il materiale originale non utilizza un vero bordo.
       Questo evita che Elementor o il tema possano
       reintrodurlo accidentalmente.

       border-radius rimane completamente indipendente.
       ------------------------------------------------------ */

    /*border:
        none !important;*/


    /* ------------------------------------------------------
       WEBKIT PIPELINE

       Identica concettualmente alla Coming Soon:
       nessuna rifrazione SVG nella proprietà prefissata.
       ------------------------------------------------------ */

    -webkit-backdrop-filter:
        var(--lr-glass-backdrop-fallback) !important;


    /* ------------------------------------------------------
       STANDARD PIPELINE

       Questa è la pipeline principale della Coming Soon:
       SVG refraction + blur + brightness + contrast.

       Non viene anteposta una seconda dichiarazione standard
       fallback: in questo modo la cascade corrisponde alla
       struttura originale della Coming Soon.
       ------------------------------------------------------ */

    backdrop-filter:
        var(--lr-glass-backdrop-enhanced) !important;
}


/* ==========================================================
   05.2 ELEMENTOR BUTTON STATE PROTECTION

   Elementor può definire background, border e shadow
   differenti negli stati interattivi.

   Il materiale LR deve invece rimanere invariato.

   Colore testo, typography e altre proprietà UI restano
   gestite normalmente tramite Elementor.
   ========================================================== */

.lr-liquid-glass.elementor-widget-button
.elementor-button:is(
    :hover,
    :focus,
    :focus-visible,
    :active
) {

    background:
        var(--lr-glass-background) !important;

    box-shadow:
        var(--lr-glass-shadow) !important;

    /*border:
        none !important;*/

    -webkit-backdrop-filter:
        var(--lr-glass-backdrop-fallback) !important;

    backdrop-filter:
        var(--lr-glass-backdrop-enhanced) !important;
}


/* ==========================================================
   05.3 FALLBACK — NO BACKDROP FILTER

   Se backdrop-filter non è supportato viene mantenuta la
   stessa superficie traslucida della Coming Soon.

   Non viene aumentata l'opacità, in modo da non introdurre
   un materiale visivamente differente.
   ========================================================== */

@supports not (
    (backdrop-filter: blur(1px)) or
    (-webkit-backdrop-filter: blur(1px))
) {

    :is(

        .lr-liquid-glass:not(.elementor-widget),

        .lr-liquid-glass.elementor-widget-button
            .elementor-button,

        .lr-liquid-glass.elementor-widget-nav-menu,

        .lr-liquid-glass.elementor-widget-nav-menu
            .sub-menu,

        .lr-liquid-glass.elementor-widget:not(
            .elementor-widget-button
        ):not(
            .elementor-widget-nav-menu
        ) > .elementor-widget-container

    ) {

        background:
            var(--lr-glass-background-fallback) !important;
    }
}


/* ==========================================================
   05.4 REDUCED TRANSPARENCY

   Eccezione di accessibilità.

   Non modifica la resa standard del materiale.
   ========================================================== */

@media (prefers-reduced-transparency: reduce) {

    :is(

        .lr-liquid-glass:not(.elementor-widget),

        .lr-liquid-glass.elementor-widget-button
            .elementor-button,

        .lr-liquid-glass.elementor-widget-nav-menu,

        .lr-liquid-glass.elementor-widget-nav-menu
            .sub-menu,

        .lr-liquid-glass.elementor-widget:not(
            .elementor-widget-button
        ):not(
            .elementor-widget-nav-menu
        ) > .elementor-widget-container

    ) {

        background:
            var(--lr-glass-background-reduced) !important;

        -webkit-backdrop-filter:
            none !important;

        backdrop-filter:
            none !important;
    }
}


/* ==========================================================
   05.5 FORCED COLORS

   In forced-colors l'accessibilità prevale intenzionalmente
   sulla resa del materiale.

   Il border viene reintrodotto esclusivamente in questa
   modalità perché necessario alla separazione dei controlli.
   ========================================================== */

@media (forced-colors: active) {

    :is(

        .lr-liquid-glass:not(.elementor-widget),

        .lr-liquid-glass.elementor-widget-button
            .elementor-button,

        .lr-liquid-glass.elementor-widget-nav-menu,

        .lr-liquid-glass.elementor-widget-nav-menu
            .sub-menu,

        .lr-liquid-glass.elementor-widget:not(
            .elementor-widget-button
        ):not(
            .elementor-widget-nav-menu
        ) > .elementor-widget-container

    ) {

        background:
            Canvas !important;

        color:
            CanvasText !important;

        /*border:
            1px solid ButtonText !important;*/

        box-shadow:
            none !important;

        -webkit-backdrop-filter:
            none !important;

        backdrop-filter:
            none !important;
    }
}
