@import url('../common/common.less');

#ads-wrapper{
    display:none;
}
.tk-page {
    position:fixed;
    top:55px;
    bottom:60px;
    width:100%;
    .tuku-category-wrapper {
        background:#fff;
        height: 40px;
        line-height: 40px;
        .center();

        .tuku-category {
            flex: 1;
            text-align: center;
            border-right: 1px solid rgba(0,0,0,.1);
            border-bottom: 1px solid rgba(0,0,0,.1);

            &.tuku-active {
                border-bottom: 3px solid #E84542;
                color: #E84542;
            }

            &:last-child {
                border-right: 0;
            }
        }
    }

    .tuku-qishu-wrapper {
        background-color: #F9F9F9;
        width: 100%;
        height: 40px;
        line-height: 40px;
        .center();
        text-align: center;

        .tuku-qishu-left {
            width: 35%;
            color: #0076FF;
        }

        .tuku-qishu-current {
            width: 30%;
        }

        .tuku-qishu-right {
            width: 35%;
            color: #0076FF;

            &.notActive {
                color: rgb(0,0,0);
            }
        }
    }

    .tuku-wrapper {
        width: 100%;
        position: absolute;
        top: 83px;
        bottom: 0;
        .tuku-area {
            float: left;
            width: 100px;
            max-height: 100%;
            overflow: auto;
            position:absolute;
            top:0;
            bottom:0;  
            /* //重写滚动条样式*/
            &::-webkit-scrollbar {
                background-color: rgba(0,0,0,.6);
            }
            /*定义滚动条轨道 内阴影+圆角*/
            &::-webkit-scrollbar-track {
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1) !important;
            }
            /*定义滑块 内阴影+圆角*/
            &::-webkit-scrollbar-thumb {
                background-color: rgba(0,0,0,.1) !important;
            }

            .tuku-area-item {
                border-right: 1px solid rgba(0,0,0,.1);
                border-bottom: 1px solid rgba(0,0,0,.1);
                text-align: center;
                font-size: 14px;
                font-weight: bold;
                padding: 10px 0;
            }

            .area-selected {
                border-bottom: 3px solid #E84542;
                color: #E84542;
            }
        }

        .tuku-list-wrapper {
            margin-left: 100px;
            height: 100%;
            overflow-y: auto;
            overflow-x: hidden;
            position:absolute;
            top:0;
            bottom:0;  
            /* //重写滚动条样式*/
            &::-webkit-scrollbar {
                background-color: rgba(0,0,0,.6);
            }
            /*定义滚动条轨道 内阴影+圆角*/
            &::-webkit-scrollbar-track {
                -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.1) !important;
            }
            /*定义滑块 内阴影+圆角*/
            &::-webkit-scrollbar-thumb {
                background-color: rgba(0,0,0,.1) !important;
            }

            .tuku-list {
                padding: 6px 8px;
                border-radius: 2px;

                a {
                    .textRow();
                    padding: 5px;
                    border: 1px solid rgba(0,0,0,.1);
                    text-align: center;
                }

                span {
                    .textRow();
                    display: block;
                    padding: 5px 8px;
                    border: 1px solid rgba(0,0,0,.1);
                    text-align: center;
                }
            }

            &.tk-newlist {
                margin-left: 0;
            }
        }
    }
}