/**
 * MOYE
 * Copyright 2014 Baidu Inc. All rights reserved.
 *
 * @file 选项卡样式
 * @author leon <leonlu@outlook.com>
 */

@import './variable.less';
@import './dep.less';


/**************************************
 **
 *************************************/


.@{moye-prefix}-tab {

    .inline-block();
    position: relative;
    list-style: none;
    height: 28px;
    line-height: 28px;
    border-bottom: 1px solid #d9d9d9;
    font-size: 0;

    &-wrapper {
        list-style: none;
        padding: 0;
        height: 100%;
    }

    &-item {
        .inline-block();
        position: relative;
        z-index: 0;
        cursor: pointer;
        vertical-align: bottom;
        font-size: 12px;
        background-color: #fafafa;
        padding: 0 15px;

        &::after,
        i {
            content: '';
            position: absolute;
            top: 5px;
            left: -2px;
            width: 0;
            height: 16px;
            font-size: 0;
            line-height: 0;
            border-left: 1px solid #dedede;
            border-right: 1px solid #fff;
        }

        &-first:after {
            display: none !important;
        }

    }

    &-item-active {
        z-index: 1;
        height: 26px;
        line-height: 24px;
        // margin-bottom: -1px;
        background-color: #fff;
        border-top: 2px solid #275cea;
    }

    &-bar {
        display: none;
    }


    &.@{moye-prefix}-tab-plugin-tabbar {

        .@{moye-prefix}-tab {

            &-item-active {
                border-top: none;
            }

            &-bar {
                display: block;
                position: absolute;
                top: 0;
                left: 0;
                .size(100px, 0);
                z-index: 3;
                border: 1px solid #275cea;
                border-width: 1px 0;
            }
        }
    }

}
