
/* =====================================================
   VEGA SMART STICKY HEADER
   ===================================================== */


/*
 * JS adds this class to the real Elementor
 * root containing Vega Header Pro.
 */
.vega-header-sticky-root{

    position:-webkit-sticky !important;
    position:sticky !important;

    top:0 !important;

    z-index:100100 !important;

    width:100% !important;

    overflow:visible !important;

    contain:none !important;

    isolation:isolate;
}


/*
 * Prevent Elementor wrappers from breaking sticky.
 */
.vega-header-sticky-root
.elementor-element,

.vega-header-sticky-root
.elementor-widget-container{

    overflow:visible !important;
}


/*
 * Outer wrapper owns sticky behavior.
 * Inner header must NOT be sticky again.
 */
.vega-header-sticky-root
.vega-el-header-pro.is-sticky,

.vega-header-sticky-root
.vega-el-header-pro[data-vega-sticky-header="1"]{

    position:relative !important;

    top:auto !important;

    z-index:auto !important;

    width:100% !important;
}


/*
 * Clean sticky surface.
 */
.vega-header-sticky-root
.vega-el-header-pro{

    background:
        var(
            --vega-el-header-bg,
            #fff
        );

    box-shadow:
        0 4px 18px
        rgba(22,30,18,.065);
}


/*
 * Search suggestions stay above content.
 */
.vega-header-sticky-root
.vega-el-header-pro__search,

.vega-header-sticky-root
.vega-live-search{

    position:relative;

    z-index:20;
}


.vega-header-sticky-root
.vega-live-search-results{

    z-index:100300 !important;
}


/* WordPress admin toolbar */

body.admin-bar
.vega-header-sticky-root{

    top:32px !important;
}


@media(max-width:782px){

    body.admin-bar
    .vega-header-sticky-root{

        top:46px !important;
    }
}



/* =====================================================
   MOBILE SMART HIDE / SHOW
   ===================================================== */

@media(max-width:767px){


    /*
     * HEADER TRANSITION
     */
    .vega-header-sticky-root{

        transition:
            transform
            .26s
            cubic-bezier(
                .4,
                0,
                .2,
                1
            );

        will-change:
            transform;

        transform:
            translate3d(
                0,
                0,
                0
            );
    }


    /*
     * Scroll DOWN:
     * header goes upward.
     */
    .vega-header-sticky-root
    .vega-el-header-pro{

        transition:
            box-shadow
            .2s ease;
    }


    body.vega-mobile-bars-hidden
    .vega-header-sticky-root{

        transform:
            translate3d(
                0,
                -105%,
                0
            ) !important;
    }



    /*
     * BOTTOM NAV TRANSITION
     */
    body.vega-has-mobile-dock
    .vega-mobile-dock{

        transition:
            transform
            .26s
            cubic-bezier(
                .4,
                0,
                .2,
                1
            ),
            opacity
            .2s ease !important;

        will-change:
            transform,
            opacity;

        transform:
            translate3d(
                0,
                0,
                0
            );

        opacity:1;
    }


    /*
     * Scroll DOWN:
     * bottom navigation moves below viewport.
     */
    body.vega-mobile-bars-hidden
    .vega-mobile-dock{

        transform:
            translate3d(
                0,
                calc(
                    100% + 35px
                ),
                0
            ) !important;

        opacity:.15;
    }


    /*
     * Search / navigation interaction:
     * force bars visible.
     */
    body.vega-mobile-bars-force-visible
    .vega-header-sticky-root,

    body.vega-mobile-bars-force-visible
    .vega-mobile-dock{

        transform:
            translate3d(
                0,
                0,
                0
            ) !important;

        opacity:1 !important;
    }

}



/* =====================================================
   ACCESSIBILITY
   ===================================================== */

@media(prefers-reduced-motion:reduce){

    .vega-header-sticky-root,

    .vega-mobile-dock{

        transition:none !important;
    }
}


/* =====================================================
   DESKTOP COMPACT STICKY HEADER
   Full header at top -> search/main row while scrolling
   ===================================================== */

@media(min-width:768px){

    .vega-header-sticky-root
    .vega-el-header-pro__top,

    .vega-header-sticky-root
    .vega-el-header-pro__nav{

        overflow:hidden !important;

        opacity:1;

        transform:
            translateY(0);

        transition:
            max-height .24s ease,
            opacity .18s ease,
            transform .24s ease,
            border .2s ease;
    }


    .vega-header-sticky-root
    .vega-el-header-pro__top{

        max-height:42px;
    }


    .vega-header-sticky-root
    .vega-el-header-pro__nav{

        max-height:54px;
    }


    /*
     * Main logo + search + actions row.
     */
    .vega-header-sticky-root
    .vega-el-header-pro__main{

        transition:
            min-height .24s ease,
            padding .24s ease,
            box-shadow .24s ease,
            background .24s ease;
    }


    /*
     * Once page has scrolled:
     * hide top strip + navigation.
     */
    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__top,

    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__nav{

        max-height:0 !important;

        min-height:0 !important;

        opacity:0 !important;

        transform:
            translateY(-8px);

        overflow:hidden !important;

        pointer-events:none;

        border-width:0 !important;
    }


    /*
     * Compact ecommerce search row.
     */
    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__main{

        min-height:58px !important;

        padding-top:3px !important;
        padding-bottom:3px !important;

        background:#fff;

        box-shadow:
            0 5px 20px
            rgba(20,25,20,.075);
    }


    /*
     * Slightly compact logo after scroll.
     */
    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__brand img{

        max-height:40px !important;

        width:auto !important;

        transition:
            max-height .24s ease;
    }


    /*
     * Search stays visually dominant.
     */
    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__search{

        flex:1 1 auto;

        min-width:0;
    }


    body.vega-desktop-header-compact
    .vega-header-sticky-root
    .vega-el-header-pro__search input{

        min-height:44px !important;

        height:44px !important;
    }

}
