/* =========================================================
   MOMO - CUSTOM HEADER
   BLOCKSY STICKY VISUALS COMPLET DEZACTIVATE
   ========================================================= */


/* ---------------------------------------------------------
   1. ASCUNDEM ORICE STARE STICKY CREATĂ DE BLOCKSY
   --------------------------------------------------------- */

[data-sticky="yes"],
[data-sticky="yes:shrink"],
[data-sticky="auto"],
[data-sticky="shrink"] {

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    border: 0 !important;
}


/* ---------------------------------------------------------
   2. ELIMINĂM BACKGROUNDURILE ROW-URILOR BLOCKSY
   --------------------------------------------------------- */

#header [data-row],
#header [data-row*="top"],
#header [data-row*="main"],
#header [data-row*="bottom"] {

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    border: 0 !important;
}


/* ---------------------------------------------------------
   3. NU LĂSĂM BLOCKSY SĂ CREEZE UN STRAT DEASUPRA
   --------------------------------------------------------- */

#header [data-row]::before,
#header [data-row]::after,
#header [data-sticky]::before,
#header [data-sticky]::after {

    display: none !important;

    content: none !important;

    background: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
}


/* ---------------------------------------------------------
   4. HEADERUL NOSTRU
   --------------------------------------------------------- */

#header {

    position: fixed !important;

    top: calc(
        var(--bb-wp-adminbar-height, 0px) + 14px
    ) !important;

    left: 16px !important;
    right: 16px !important;

    width: auto !important;

    margin: 0 !important;

    z-index: 99990 !important;

    background:
        linear-gradient(
            135deg,
            rgba(24, 43, 145, .96),
            rgba(52, 76, 190, .90),
            rgba(20, 37, 130, .96)
        ) !important;

    background-image:
        linear-gradient(
            135deg,
            rgba(24, 43, 145, .96),
            rgba(52, 76, 190, .90),
            rgba(20, 37, 130, .96)
        ) !important;

    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);

    border-radius: 999px !important;

    border: 1px solid rgba(
        255,
        255,
        255,
        .10
    ) !important;

    box-shadow:
        0 18px 45px rgba(5, 12, 70, .30),
        0 8px 20px rgba(5, 12, 70, .20),
        inset 0 1px 0 rgba(255,255,255,.12) !important;

    overflow: visible !important;

    transform: translate3d(0,0,0);

    transition:
        transform .28s ease,
        opacity .28s ease !important;
}


/* ---------------------------------------------------------
   5. HEADERUL NU MAI ARE PSEUDO-ELEMENTE
   --------------------------------------------------------- */

#header::before,
#header::after {

    display: none !important;

    content: none !important;

}


/* ---------------------------------------------------------
   6. CONȚINUTUL HEADERULUI
   --------------------------------------------------------- */

#header > *,
#header .ct-container,
#header .ct-header-container,
#header .ct-header-content,
#header .ct-row-inner {

    background: transparent !important;

    background-color: transparent !important;

    background-image: none !important;

    box-shadow: none !important;

    border: 0 !important;

}


/* ---------------------------------------------------------
   7. PĂSTRĂM CONȚINUTUL DEASUPRA
   --------------------------------------------------------- */

#header > *,
#header .ct-container,
#header .ct-header-container,
#header .ct-row-inner {

    position: relative !important;

    z-index: 2 !important;

}


/* ---------------------------------------------------------
   8. SPACER
   --------------------------------------------------------- */

#bb-header-spacer {

    display: block !important;

    height: var(
        --bb-header-space,
        110px
    ) !important;

    width: 100% !important;

    margin: 0 !important;
    padding: 0 !important;

    background: transparent !important;

}


/* ---------------------------------------------------------
   9. HEADER HIDDEN LA SCROLL DOWN
   --------------------------------------------------------- */

body.bb-header-hide #header {

    transform:
        translate3d(
            0,
            calc(-100% - 30px),
            0
        ) !important;

}


/* ---------------------------------------------------------
   10. DESKTOP
   --------------------------------------------------------- */

@media (min-width: 769px) {

    #header {

        left: 16px !important;
        right: 16px !important;

        top: calc(
            var(--bb-wp-adminbar-height, 0px) + 14px
        ) !important;

        border-radius:
            0 0 34px 34px !important;

    }

}


/* ---------------------------------------------------------
   11. MOBILE
   --------------------------------------------------------- */

@media (max-width: 768px) {

    #header {

        left: 14px !important;
        right: 14px !important;

        top: calc(
            var(--bb-wp-adminbar-height, 0px) + 12px
        ) !important;

        border-radius: 999px !important;

    }

}


/* ---------------------------------------------------------
   12. ADMIN BAR
   --------------------------------------------------------- */

#wpadminbar {

    z-index: 999999 !important;

}
/* =========================================================
   STRATUL BLOCKSY DIN SPATE = COMPLET TRANSPARENT
   Păstrăm doar forma rotunjită
   ========================================================= */

#header [data-row],
#header [data-row] > *,
#header .ct-header,
#header .ct-header-container,
#header .ct-header-content,
#header .ct-container,
#header .ct-row,
#header .ct-row-inner {

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    border-color: transparent !important;

    border-radius: 999px !important;
}


/* pseudo-elementele care pot desena fundalul */

#header [data-row]::before,
#header [data-row]::after,
#header .ct-row::before,
#header .ct-row::after,
#header .ct-row-inner::before,
#header .ct-row-inner::after {

    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;

    box-shadow: none !important;
    border: 0 !important;

}


/* Headerul nostru rămâne albastru */

#header {

    background:
        linear-gradient(
            135deg,
            rgba(24, 43, 145, .96),
            rgba(52, 76, 190, .90),
            rgba(20, 37, 130, .96)
        ) !important;

    border-radius: 999px !important;

}
/* =========================================================
   MOMO HEADER — CONTENT SAFE AREA
   NU MODIFICĂ FUNDALUL HEADERULUI
   DOAR MUTĂ CONȚINUTUL SPRE INTERIOR
   ========================================================= */


/* ---------------------------------------------------------
   DESKTOP
   --------------------------------------------------------- */

@media (min-width: 769px) {

    /*
     * Containerul rămâne transparent.
     * Îl facem puțin mai îngust decât headerul.
     */

    #header [data-row] .ct-row-inner {

        width: calc(100% - 70px) !important;

        max-width: none !important;

        margin-left: auto !important;
        margin-right: auto !important;

        padding-left: 0 !important;
        padding-right: 0 !important;

        box-sizing: border-box !important;

    }


    /*
     * Coloana din stânga
     */

    #header [data-row] [data-column="start"] {

        padding-left: 0 !important;
        margin-left: 0 !important;

    }


    /*
     * Coloana din dreapta
     */

    #header [data-row] [data-column="end"] {

        padding-right: 0 !important;
        margin-right: 0 !important;

    }

}


/* =========================================================
   MOMO HEADER — MOBILE
   FINAL POSITIONING
   ========================================================= */

@media (max-width: 768px) {

    /* =========================================
       HEADER / PILL
       ========================================= */

    #header {
        left: 14px !important;
        right: 14px !important;

        width: auto !important;
        max-width: none !important;

        padding: 0 !important;
        margin: 0 !important;

        box-sizing: border-box !important;


    }


    /* =========================================
       CONTAINER
       ========================================= */

    #header .ct-container,
    #header .ct-header-container,
    #header .ct-header-content,
    #header .ct-row-inner {

        width: 100% !important;
        max-width: none !important;

        padding-left: 16px !important;
        padding-right: 16px !important;

        margin: 0 !important;

        box-sizing: border-box !important;
    }


    /* =========================================
       ROW
       ========================================= */

    #header .ct-row-inner {

        display: flex !important;

        align-items: center !important;

        justify-content: space-between !important;

        width: 100% !important;

        min-width: 0 !important;

        gap: 0 !important;
    }


/* =========================================
   LOGO
   ========================================= */

#header [data-column="start"] {

    flex: 0 1 auto !important;

    width: auto !important;

    min-width: 0 !important;

    display: flex !important;

    align-items: center !important;

    justify-content: flex-start !important;
}


#header [data-column="start"] img,
#header [data-column="start"] .custom-logo,
#header [data-column="start"] .site-logo img {

    width: 210px !important;

    max-width: 210px !important;

    height: auto !important;

    transform: none !important;

    margin-left: 14px !important;

    margin-right: 0 !important;

    margin-bottom: 0 !important;

    position: relative !important;

    top: -10px !important;
}

    /* =========================================
       ZONA DIN DREAPTA
       IMPORTANT:
       O MUTĂM EXPLICIT SPRE STÂNGA
       ========================================= */

    #header [data-column="end"] {

        flex: 0 0 auto !important;

        width: auto !important;

        min-width: 0 !important;

        margin-left: 10px !important;

        margin-right: 10px !important;

        padding: 10 !important;

        display: flex !important;

        align-items: center !important;

        justify-content: flex-start !important;

        transform: translateX(-6px) !important;
    }


    /* =========================================
       ICON GROUP
       ========================================= */

    #header .ct-header-actions {

        display: flex !important;

        align-items: center !important;

        justify-content: flex-start !important;

        flex-wrap: nowrap !important;

        width: auto !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;

        gap: 16px !important;

        column-gap: 16px !important;
    }


    /* =========================================
       INDIVIDUAL ACTIONS
       ========================================= */

    #header .ct-header-actions > * {

        flex: 0 0 auto !important;

        width: auto !important;

        min-width: 0 !important;

        margin: 0 !important;
        padding: 0 !important;
    }


    /* =========================================
       ICON SIZE
       ========================================= */

    #header .ct-header-actions svg {

        width: 25px !important;
        height: 25px !important;

        max-width: 25px !important;
        max-height: 25px !important;
    }


    /* =========================================
       HAMBURGER
       ========================================= */

    #header .ct-header-trigger {

        width: 27px !important;
        min-width: 27px !important;
        max-width: 27px !important;

        height: 27px !important;

        flex: 0 0 27px !important;

        margin: 10 !important;
        padding: 0 !important;

        display: flex !important;

        align-items: center !important;
        justify-content: center !important;
    }


    #header .ct-header-trigger svg {

        width: 25px !important;
        height: 25px !important;

        max-width: 25px !important;
        max-height: 25px !important;
    }


    /* =========================================
       390px+
       ========================================= */

    @media (min-width: 390px) {

        #header [data-column="end"] {

            transform: translateX(-28px) !important;

            margin-right: 28px !important;
        }

        #header .ct-header-actions {

            gap: 17px !important;
            column-gap: 17px !important;
        }
    }


    /* =========================================
       TELEFOANE MICI
       ========================================= */

    @media (max-width: 389px) {

        #header {

            left: 12px !important;
            right: 12px !important;
        }


        #header .ct-container,
        #header .ct-header-container,
        #header .ct-header-content,
        #header .ct-row-inner {

            padding-left: 13px !important;
            padding-right: 13px !important;
        }


        #header [data-column="start"] img,
        #header [data-column="start"] .custom-logo,
        #header [data-column="start"] .site-logo img {

            width: 165px !important;
            max-width: 165px !important;
        }


        #header [data-column="end"] {

            transform: translateX(-18px) !important;

            margin-right: 18px !important;
        }


        #header .ct-header-actions {

            gap: 13px !important;
            column-gap: 13px !important;
        }
    }
}