%tag-filter-style {
    background: rgba(99, 182, 174, 1);
    background-image: none;
    cursor:pointer;
}
%tag-hover-style {
    background: rgba(99, 182, 174, 1);
    color: rgba(255,255,255,1);
    text-shadow: 0 -1px 0 rgba(0,0,0,0.2);
    border-radius: 4px;
}
.issue-tags {
    padding: 8px 0;
    ul {
        li {
            line-height: 20px;
            a:hover {
                @extend %tag-hover-style;
            }
            .tag-filter {
                @extend %tag-filter-style;
            }
            .tag-remove, .icon-remove, .icon-white {
                @extend %tag-filter-style;
                float:right;
            }
        }
        .tag-filter {
            @extend %tag-filter-style;
        }
        .tag-remove, .icon-remove, .icon-white {
            @extend %tag-filter-style;
            float:right;
        }
        a:hover {
            @extend %tag-hover-style;
        }
    }
    ul li.active{
        a {
            border-radius: 4px;
        }
    }
    .nav-header {
        margin-bottom: 8px;
    }
    .tag-admin {
        float: right;
        cursor:pointer;
        font-weight: 400;
    }
    .tag-admin-unuse {
        color: rgba(99, 182, 174, 1);
    }
    .tag-admin-using {
        color: #999;
    }
    .nav-list-edit .tag-item {
        display: block;
        padding: 3px 1px;
        color: #08c;
    }
}

/* edit tag */
ul.color-chooser .color-cooser-color {
    display: block;
    text-align: center;
    height: 25px;
    cursor: pointer;
    box-sizing: border-box;
    border: solid 2px transparent;
}
.edit-color-label-form.open .color-chooser, .edit-color-label-form.open .color-editor {
    display: block;
}
ul.color-chooser {
    height: 25px;
    list-style-type: none;
    display: table-row;
}
ul.color-chooser li {
    display: table-cell;
    width: 1%;
    vertical-align: top;
}
.fieldWithErrors {
    display: inline;
}
.edit-color-label-form .color-editor-bg {
    position: absolute;
    left: 0;
    height: 25px;
    width: 130px;
    opacity: 0.12;
    border-radius: 3px;
}
.edit-color-label-form .color-editor .color-editor-input {
    position: absolute;
    left: 0;
    background-color: transparent;
    min-height: 25px;
    border-left-width: 26px;
    padding-top: 3px;
    padding-bottom: 3px;
    width: 130px;
}
.edit-color-label-form .color-editor .invalid-color-indicator {
    display: none;
    position: absolute;
    top: 5px;
    left: 9px;
    color: #c00;
    z-index: 10;
    font-weight: bold;
}
.edit-color-label-form .color-editor {
    margin-top: 5px;
    position: relative;
    height: 25px;
    margin-bottom: 10px;
}
.edit-color-label-form .color-editor .invalid-color-indicator {
    display: none;
    position: absolute;
    top: 5px;
    left: 9px;
    color: #c00;
    z-index: 10;
    font-weight: bold;
}
.edit-color-label-form input[type="text"] {
    min-height: 34px;
    padding: 7px 8px;
    outline: none;
    color: #333;
    background-color: #fff;
    background-repeat: no-repeat;
    background-position: right center;
    border: 1px solid #ccc;
    border-radius: 3px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,0.075);
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    vertical-align: middle;
}
.edit-color-label-form.is-not-valid .color-editor .invalid-color-indicator {
    display: block;
}
