/**
 * Navigation
 *
 * @license   GNU General Public License, version 2
 * @copyright 2013 OOO "ЛС-СОФТ" {@link http://livestreetcms.com}
 * @author    Denis Shakhov <denis.shakhov@gmail.com>
 */


.ls-nav {
    list-style: none;
    padding: 0;
}
.ls-nav-item {
    float: left;
    position: relative;
}
.ls-nav-item-link {
    display: block;
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    -ms-text-overflow: ellipsis;
    text-overflow: ellipsis;
}


/**
 * Stacked
 */
.ls-nav--stacked > .ls-nav-item {
    float: none;
    margin: 0;
}


/**
 * Поддержка счетчиков
 */
.ls-nav-item .ls-nav-item-badge {
    line-height: 20px;
    float: right;
    margin-left: 7px;
}


/**
 * Стрелка
 */
.ls-nav .ls-nav-item.ls-nav-item--has-children > .ls-nav-item-link,
.ls-nav.ls-nav--sub .ls-nav-item.ls-nav-item--has-children > .ls-nav-item-link {
    position: relative;
    padding-right: 25px;
}
.ls-nav-item-link > .ls-nav-item-caret {
    position: absolute;
    top: 50%;
    right: 9px;
    margin-top: -2px;
}
.ls-nav-item-link > .ls-nav-item-caret.ls-caret--right {
    right: 7px;
    margin-top: -4px;
}


/**
 * Pills
 */
.ls-nav--pills {
    margin-bottom: 15px;
}

.ls-nav--pills > .ls-nav-item {
    margin-right: 3px;
}
.ls-nav--pills > .ls-nav-item > .ls-nav-item-link {
    padding: 5px 12px;
    line-height: 20px;
    background: #8DCAFA;
    color: #fff;
    border-radius: 2px;
    -webkit-transition: background .2s, color .2s;
    transition: background .2s, color .2s;
}

/* Стрелка */
.ls-nav--pills .ls-nav-item-link > .ls-nav-item-caret {
    border-top-color: #fff;
}
.ls-nav--pills .ls-nav-item:hover > .ls-nav-item-link > .ls-caret--right {
    border-left-color: #fff;
}

/* Hover */
.ls-nav--pills > .ls-nav-item > .ls-nav-item-link:hover,
.ls-nav--pills > .ls-nav-item:hover > .ls-nav-item-link {
    background: #2196F3;
    color: #fff;
}

/* Active */
.ls-nav--pills > .ls-nav-item.active > .ls-nav-item-link {
    background: #2196F3;
    color: #fff;
}
.ls-nav--pills > .ls-nav-item.active > .ls-nav-item-link:hover {
    background: #2196F3;
    color: #fff;
}

/* Stacked */
.ls-nav.ls-nav--pills.ls-nav--stacked {
    margin-bottom: 15px;
}
.ls-nav.ls-nav--pills.ls-nav--stacked:last-child {
    margin-bottom: 0;
}
.ls-nav.ls-nav--pills.ls-nav--stacked > .ls-nav-item {
    float: none;
    margin-bottom: 3px;
    margin-right: 0;
}
.ls-nav.ls-nav--pills.ls-nav--stacked > .ls-nav-item > .ls-nav-item-link {
    float: none;
    display: block;
}


/**
 * Вложенная навигация (уровень вложенности > 1)
 */
.ls-nav--sub {
    position: absolute;
    display: none;
    min-width: 150px;
    z-index: 100;
    background: #fff;
    box-shadow: 0 5px 15px rgba(0, 0, 0, .3);
}
.ls-nav.ls-nav--sub > .ls-nav-item > .ls-nav-item-link {
    padding: 5px 12px;
    line-height: 20px;
}
.ls-nav--sub > .ls-nav-item:hover {
    background: #2196F3;
    color: #fff;
}
.ls-nav--sub > .ls-nav-item:hover > .ls-nav-item-link {
    color: #fff;
}
.ls-nav--sub > .ls-nav-item.active {
    background: #2196F3;
    color: #fff;
}
.ls-nav--sub > .ls-nav-item.active > .ls-nav-item-link {
    color: #fff;
}
.ls-nav-separator {
    height: 0;
    border-top: 1px solid #eee;
    margin: 5px 0;
}


/**
 * Sub
 */
.ls-nav--sub .ls-nav--sub {
    left: 100%;
    top: 0;
}
.ls-nav > .ls-nav-item--has-children {
    position: relative;
}
.ls-nav:not(.ls-nav--sub) > .ls-nav-item > .ls-nav--sub {
    top: 100%;
    left: 0;
}
.ls-nav .ls-nav-item:hover > .ls-nav--sub {
    display: block;
}


/**
 * Основное меню
 */
.ls-nav--main {
    background: #222;
}
.ls-nav--main > .ls-nav-item > .ls-nav-item-link {
    color: #ddd;
    padding: 15px 20px;
}
.ls-nav--main > .ls-nav-item > .ls-nav-item-link:hover {
    background: #333;
}
.ls-nav--main > .ls-nav-item.active > .ls-nav-item-link {
    background: #3a3a3a;
    color: #bbb;
}


/**
 * Group
 */
.ls-nav-group {
    position: relative;
    margin-bottom: 40px;
}
.ls-nav-group .ls-nav, .ls-nav-group .ls-nav.ls-nav-pills {
    margin-bottom: 10px;
}
.ls-nav-group > *:last-child {
    margin-bottom: 0;
}