﻿@import (reference) "bootstrap.less";
@import (reference) "Onestop.Common.Variables.less";
@import (reference) "Onestop.Common.Mixins.less";

.os-main-header {
    .os-make-xs-ruleset( {
        position: fixed;
        z-index: 10;
        width: 100%;
    }

    );
    
    .os-nav-icons {
        .os-signin-list {
            a{
                color: #fff;
            }
        }
    }
}

; .os-cart-dropdown { 
    @media (max-width: @screen-sm) {
        display:none !important;
    }

    > .dropdown-menu {
        top: 30px;
    }

    &:hover {
        > .dropdown-menu {
            display: block !important;
        }
    }
}

.mobile-cart {
    width: 55px;
    display: none !important;

    @media (max-width: @screen-sm) {
        display:inline-block !important;
    }
}

.icon-store {
    width: 12px;
    height: 17px;
    vertical-align: middle;
    background: url(/Themes/PEBA/Content/Images/store-marker.png) no-repeat 50% 0;
    display: inline-block;
    margin-left: 10px;
}

.zone-search {
    .btn-default {
        &:hover,
        &:active {
            background-color: @peba-blue !important;
        }
    }
}

.mobile-search {
    float: left;
    padding-top: 5px;
    height: 25px;
    width: 30px;
    cursor: pointer;
    margin-left: 20px;
}

.menu-text {
    float: left;
    margin-top: 35px;
    margin-left: -10px;
}

.mobile-search-input {
    width: 100%;
    transition: height 1s;
    height: 0;
    background: #f7f7f7;

    .zone-search {
        padding: 10px;

        .navbar-form {
            margin-top: 0;

            .os-make-xs-ruleset( {
                margin-top: 0;
                display: table;
                position: absolute;
                z-index: 0;
                width: 75%;
            });

            .os-make-sm-ruleset( {
                display: none;
            });


        }

        .input-group {
            .btn {
                border-right: none;
            }

            .form-control {
                position: initial;
                padding-left: 10px !important;
            }
        }
    }
}

.os-navbar-global {
    .container {
        padding-right: 0;
    }
}

    .os-navbar-global::before {
        display: block;
        width: 100%;
        position: absolute;
        bottom: -5px;
        content: '';
        height: 6px;
        background: url(/Themes/PEBA/Content/Images/shadow-header.png);
    }

.navbar-header::after {
    position: absolute;
    left: 50%;
    bottom: -34px;
    z-index: 28;
    margin-left: -60px;
    display: block;
    content: '';
    height: 34px;
    width: 121px;
    background: url(/Themes/PEBA/Content/Images/smenu.png);
}

.mobile-search-input.active {
    height: 75px;
}

.top-banner {
    width: 100%;
    height: 40px;
    padding: 10px 0;
    text-align: center;
    background-color: #fff;

    .widget-promobanner {
       a {
            color: red !important;
            text-decoration: none !important;
            font-weight: bold;
        }
    }
}

.os-promo-banner {
    .store-locator {
        display: none;
    }

    .os-nav-icons {
        margin-right: 20px;
    }
}

.zone-navigation-right {
    float: right;
    width: 100%;
    padding-top: 20px;
    padding-bottom: 0;
    width: auto;
    margin-left: 20px;
    max-width: 45%;
    display: none;
    
    .os-make-lg-ruleset({display: block});    
}


.icon-peba-story {
    display: inline-block;
    height: 22px;
    width: 25px;
    background: url(/Themes/PEBA/Content/Images/logo-menu.png);
    background-repeat: none;
    position: relative;
    top: 6px;
}





.os-body-wrapper.left.in  {
    .os-mobile-aside-variables();
    .os-main-header {
        left: @width; 
            
    }
}

.os-body-wrapper.right.in {
    .os-mobile-aside-variables();
    .os-main-header {
        right: @width;
            
    }
}
.os-cta-navtoggle {    
    .os-make-lg-ruleset({display: none});
}
@media (min-width: 768px) and (max-width: @screen-md-max) {
    .os-mobile-aside {
        .os-mobile-aside-variables();
        width: @width / 2;
    }

    .os-body-wrapper  {
        .os-mobile-aside-variables();
        &.left.in {
            left: @width / 2;
            .os-main-header {
                left: @width / 2;
            }
        }
        &.right.in {
            right: @width / 2;
            .os-main-header {
                right: @width / 2;
            }
        }
    }   
}

.os-body-wrapper {
    .zone-breadcrumb {
        margin-top: 40px;
        /*.os-breadcrumbs {
            padding-left: 0;
        }*/
    }
}

@media (max-width: @screen-xs-max) { 
    .os-body-wrapper {
        .zone-breadcrumb {
            margin-top: 80px;
        }
    }
    

    .top-banner {
        padding-top: 5px;

        .widget-promobanner {
            span {
                font-size: 12px;
                line-height: 14px;
                display: block;
            }
        }
    }
    
    .mobile-cart.dropdown {
        .os-btn-cart {
            margin-top: 15px;
        }

    }
}

.detail-home-page {
    .os-navbar-global {
        height: 79px;
    }
}


