// DIRECTIONAL
// ---------------------------------------------------------------
$rtl: 0 !default;
$dir: ltr !default;

@import "../theme/theme-imports";

/* gui/nav.scss */
/* Nav Secondary */
.nav-secondary {
    background: #fafafa;
    padding: 20px 0;
    z-index: 100;
    .nav-pills {
        justify-content: center;
        > li {
            a,
            span {
                display: block;
                font-size: .75rem;
                font-weight: 600;
                line-height: 20px;
                padding: 10px 13px;
                text-transform: uppercase;
                i {
                    font-size: .875rem;
                    margin-#{$right}: .35em;
                }
            }
        }
    }
    &.sticky-active {
        border-bottom-color: #e9e9e9;
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.1);
    }
}

.page-wrapper.sticky-scroll-up .nav-secondary {
    &.sticky-ready {
        transition: $left .3s, visibility 0.3s, opacity 0.3s, transform 0.3s, top 0.3s ease;
    }
    &.sticky-active.scroll-down {
        opacity: 0 !important;
        visibility: hidden;
        transform: translate3d( 0, -100%,0 );
    }
    &.sticky-active:not(.scroll-down) {
        opacity: 1 !important;
        visibility: visible;
        transform: translate3d( 0, 0,0 );
    }
}
/* gui/header.scss */
.page-wrapper.sticky-scroll-up #header {
    .header-main.sticky,
    &.sticky-header .main-menu-wrap {
        transform: translate3d( 0, 0, 0 );
        visibility: visible;
        opacity: 1;
    }
    &:not(.sticky-ready) .header-main {
        --e-con-transform-transition-duration: 0;
        --e-transform-transition-duration: 0;
    }
    &.sticky-ready .header-main.sticky,
    &.sticky-header.sticky-ready .main-menu-wrap {
        transition: transform 0.3s, opacity 0.3s, visibility 0.3s, left 0.3s ease !important;
    }
    &.scroll-down .header-main.sticky,
    &.sticky-header.scroll-down .main-menu-wrap {
        transform: translate3d( 0, -100%, 0 );
        opacity: 0;
        visibility: hidden;
    }
}

.page-wrapper.sticky-scroll-up #header .sticky .porto-scroll-progress {
	top: calc( -1 * var( --porto-sp-sticky-height, 14px ) );
}