/* HEADER CSS */
#header-secondary-outer {
    background: var(--color-surface);
}

#header-secondary-outer .nectar-center-text {
    text-align: left !important;
    left: 35% !important;
    font-size: 14px !important;
    line-height: 19.6px !important;
    padding: 8px 0 !important;
}

#header-secondary-outer nav>.sf-menu {
    padding: 8px 0 !important;
}

#header-secondary-outer nav>ul>li>a {
    margin: 0 12px !important;
}

#header-secondary-outer nav>ul>li>a .menu-title-text {
    color: var(--color-text) !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 19.6px;
    transition: color var(--dur-med) ease-in-out;
}

#header-secondary-outer nav>ul>li>a:hover .menu-title-text {
    color: var(--color-primary-hover) !important;
}

#header-outer .mobile-header li:not([class*="button_"]) > a .menu-title-text:after, #header-outer[data-lhe="animated_underline"] nav > ul >li:not([class*="button_"]) > a .menu-title-text:after, #header-secondary-outer[data-lhe="animated_underline"] nav >.sf-menu >li >a .menu-title-text:after {
    border-top: unset !important;
}

#header-outer[data-lhe="animated_underline"] #top .sf-menu > .sf-with-ul:not([class*="button"]) > a .menu-title-text {
    transition: color var(--dur-med) ease-in-out;
}

#header-outer[data-lhe="animated_underline"] #top .sf-menu > .sf-with-ul:not([class*="button"]) > a:hover .menu-title-text {
    color: var(--color-primary) !important;
}

#header-secondary-outer nav>ul>li.menu-last-item>a {
    margin: 0 0 0 36px !important;
    position: relative;
}

#header-secondary-outer nav>ul>li.menu-last-item>a::before {
    content: '';
    background: var(--color-text);
    width: 1px;
    height: 20px;
    position: absolute;
    top: 1px;
    left: -24px;
    pointer-events: none;
}

header a#logo {
    margin: var(--space-2) 0 !important;
}

header .col.span_9.col_last {
    height: 62px !important;
}

body #header-outer .icon-salient-search:before, body.material #header-outer .icon-salient-search:before {
    color: var(--color-text);
}

header .icon-salient-m-user:before {
    content: url('../../assets/icons/user.svg');
    position: absolute;
    top: -2px;
    left: 0px;
}

header .icon-salient-cart:before, body.material .icon-salient-cart:before {
    content: url('../../assets/icons/cart.svg') !important;
    position: absolute;
    top: -2px;
    left: 0px;
}

#mobile-menu .below-menu-items-wrap {
    display: block;
}

#mobile-menu .mobile-menu-support {
    margin-top: var(--space-2);
    padding: var(--space-2) 0 var(--space-4);
    border-top: 1px solid var(--color-border);
}

#mobile-menu .mobile-menu-support__title {
    margin: 8px 0 12px;
    color: var(--color-text);
    font-size: 14px;
    font-weight: 700;
    line-height: 19.6px;
}

#mobile-menu .mobile-menu-support__contact {
    display: block;
    width: fit-content;
    margin: 0 0 12px;
    color: var(--color-text);
    font-size: 14px;
    font-weight: 400;
    line-height: 19.6px;
    text-decoration: underline;
}

#mobile-menu .mobile-menu-support__email {
    margin-bottom: var(--space-2);
}

#mobile-menu .mobile-menu-support__socials {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: var(--space-1);
}

#mobile-menu .mobile-menu-support__social-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    clip-path: var(--shape-blob);
    background-color: var(--color-surface);
}

/* Salient dynamic social networks, varijanta sa font ikonom. */
#mobile-menu .mobile-menu-support__social-link i {
    font-size: 16px;
    color: var(--color-text);
}

#header-outer #mobile-menu ul li>a {
    font-size: 16px !important;
    line-height: 22.4px;
    padding: 8px 0 !important;
    color: var(--color-text);
}

#mobile-menu .menu-items-wrap ul:not(.nectar_widget)>li:before,
#mobile-menu .menu-items-wrap>ul:last-child>li:last-child:after {
    display: none !important;
}

#header-outer #mobile-menu ul {
    display: flex;
    flex-direction: column;
    gap: var(--space-2);
}

@media (max-width: 1200px) {
    header .icon-salient-m-user:before {
        position: unset;
    }

    header .icon-salient-cart:before, body.material .icon-salient-cart:before {
        position: unset;
    }

    html body[data-slide-out-widget-area-style="slide-out-from-right-hover"] .slide-out-widget-area-toggle.mobile-icon .lines:before, html body #header-outer .slide-out-widget-area-toggle.mobile-icon .lines:before, html #header-outer .left-aligned-ocm .lines:before {
        width: 22px !important;
    }

    .slide-out-widget-area-toggle.mobile-icon .lines-button.x2 .lines:after, .slide-out-widget-area-toggle.mobile-icon .lines-button.x2 .lines:before, .slide-out-widget-area-toggle.mobile-icon .lines-button:after {
        background-color: var(--color-text) !important;
    }

    body.mobile.material[data-header-color=light] #header-outer .slide-out-widget-area-toggle a .close-line, body.mobile.material[data-header-color=light] #header-outer.transparent .slide-out-widget-area-toggle a .close-line {
        background-color: var(--color-text) !important;
    }

    #header-outer:not(.transparent) #top .slide-out-widget-area-toggle .close-line {
        background-color: var(--color-text) !important;
    }

    body[data-slide-out-widget-area-style="simple"][data-ext-responsive="true"] #header-outer[data-full-width="false"] #mobile-menu {
        padding: 0 16px !important;
        height: 100vh;
    }
}

@media (max-width: 991px) {
    header a#logo {
        margin: 0 !important;
    }

    header .col.span_9.col_last {
        height: 38px !important;
    }

    body #header-secondary-outer, body #header-secondary-outer > .container, body #header-secondary-outer > .container > nav {
        min-height: unset !important;
    }

    #header-secondary-outer .nectar-center-text {
        max-width: 100% !important;
        text-align: center !important;
        left: 0 !important;
    }

    body #header-secondary-outer ul {
        display: none !important;
    }

    #header-outer .mobile-user-account .icon-salient-m-user {
        max-height: 22px;
    }

    body[data-slide-out-widget-area-style="simple"][data-ext-responsive="true"] #header-outer[data-full-width="false"] #mobile-menu {
        padding: 0 !important;
    }
}

@media (max-width: 389px) {
    #header-secondary-outer .nectar-center-text {
        font-size: 12px !important;
        line-height: 16.8px !important;
    }
}
/* END HEADER CSS */