// 本文字和element中完全一样


.el-tag {
    background-color: #ecf5ff;
    border-color: #d9ecff;
    display: inline-block;
    height: 32px;
    padding: 0 10px;
    line-height: 30px;
    font-size: 12px;
    color: #409EFF;
    border-width: 1px;
    border-style: solid;
    border-radius: 4px;
    box-sizing: border-box;
    white-space:nowrap;
	
	&.is-hit {
		border-color:#409EFF
	}
	.el-tag__close {
	    color:#409eff
	}
	el-tag__close:hover {
	    color: #FFF;
	    background-color:#409eff
	}
	&.el-tag--info {
		background-color: #f4f4f5;
		border-color: #e9e9eb;
		color:#909399;
		&.is-hit {
			border-color:#909399
		}
		.el-tag__close {
		    color:#909399
		}
		.el-tag__close:hover {
		    color: #FFF;
		    background-color:#909399
		}
	}
	&.el-tag--success {
		background-color: #f0f9eb;
		border-color: #e1f3d8;
		color:#67c23a;
		&.is-hit {
			border-color:#67C23A
		}
		.el-tag__close {
		    color:#67c23a
		}
		.el-tag__close:hover {
		    color: #FFF;
		    background-color:#67c23a
		}
	}
	
	&.el-tag--warning {
		background-color: #fdf6ec;
		border-color: #faecd8;
		color:#e6a23c;
		&.is-hit {
			border-color:#E6A23C
		}
		.el-tag__close {
		    color:#e6a23c
		}
		.el-tag__close:hover {
		    color: #FFF;
		    background-color:#e6a23c
		}
	}
	
	&.el-tag--danger {
		background-color: #fef0f0;
		border-color: #fde2e2;
		color:#f56c6c;
		&.is-hit {
		    border-color:#F56C6C
		}
		.el-tag__close {
		    color:#f56c6c;
			&:hover {
				color: #FFF;
				background-color:#f56c6c
			}
		}
	}
	
	
	.el-icon-close {
	    border-radius: 50%;
	    text-align: center;
	    position: relative;
	    cursor: pointer;
	    font-size: 12px;
	    height: 16px;
	    width: 16px;
	    line-height: 16px;
	    vertical-align: middle;
	    top: -1px;
	    right:-5px;
		&::before {
			display:block
		}
	}
	
}


.el-tag--dark {
    background-color: #409eff;
    border-color: #409eff;
    color:#fff;
	
	&.is-hit {
		border-color:#409EFF
	}
	.el-tag__close {
	    color:#fff
	}
	.el-tag__close:hover {
	    color: #FFF;
	    background-color:#66b1ff
	}
	&.el-tag--info {
		background-color: #909399;
		border-color: #909399;
		color:#fff
	}
}

.el-tag--dark.el-tag--info.is-hit {
    border-color:#909399
}

.el-tag--dark.el-tag--info .el-tag__close {
    color:#fff
}

.el-tag--dark.el-tag--info .el-tag__close:hover {
    color: #FFF;
    background-color:#a6a9ad
}

.el-tag--dark.el-tag--success {
    background-color: #67c23a;
    border-color: #67c23a;
    color:#fff
}

.el-tag--dark.el-tag--success.is-hit {
    border-color:#67C23A
}

.el-tag--dark.el-tag--success .el-tag__close {
    color:#fff
}

.el-tag--dark.el-tag--success .el-tag__close:hover {
    color: #FFF;
    background-color:#85ce61
}

.el-tag--dark.el-tag--warning {
    background-color: #e6a23c;
    border-color: #e6a23c;
    color:#fff
}

.el-tag--dark.el-tag--warning.is-hit {
    border-color:#E6A23C
}

.el-tag--dark.el-tag--warning .el-tag__close {
    color:#fff
}

.el-tag--dark.el-tag--warning .el-tag__close:hover {
    color: #FFF;
    background-color:#ebb563
}

.el-tag--dark.el-tag--danger {
    background-color: #f56c6c;
    border-color: #f56c6c;
    color:#fff
}

.el-tag--dark.el-tag--danger.is-hit {
    border-color:#F56C6C
}

.el-tag--dark.el-tag--danger .el-tag__close {
    color:#fff
}

.el-tag--dark.el-tag--danger .el-tag__close:hover {
    color: #FFF;
    background-color:#f78989
}

.el-tag--plain {
    background-color: #fff;
    border-color: #b3d8ff;
    color:#409eff
}

.el-tag--plain.is-hit {
    border-color:#409EFF
}

.el-tag--plain .el-tag__close {
    color:#409eff
}

.el-tag--plain .el-tag__close:hover {
    color: #FFF;
    background-color:#409eff
}

.el-tag--plain.el-tag--info {
    background-color: #fff;
    border-color: #d3d4d6;
    color:#909399
}

.el-tag--plain.el-tag--info.is-hit {
    border-color:#909399
}

.el-tag--plain.el-tag--info .el-tag__close {
    color:#909399
}

.el-tag--plain.el-tag--info .el-tag__close:hover {
    color: #FFF;
    background-color:#909399
}

.el-tag--plain.el-tag--success {
    background-color: #fff;
    border-color: #c2e7b0;
    color:#67c23a
}

.el-tag--plain.el-tag--success.is-hit {
    border-color:#67C23A
}

.el-tag--plain.el-tag--success .el-tag__close {
    color:#67c23a
}

.el-tag--plain.el-tag--success .el-tag__close:hover {
    color: #FFF;
    background-color:#67c23a
}

.el-tag--plain.el-tag--warning {
    background-color: #fff;
    border-color: #f5dab1;
    color:#e6a23c
}

.el-tag--plain.el-tag--warning.is-hit {
    border-color:#E6A23C
}

.el-tag--plain.el-tag--warning .el-tag__close {
    color:#e6a23c
}

.el-tag--plain.el-tag--warning .el-tag__close:hover {
    color: #FFF;
    background-color:#e6a23c
}

.el-tag--plain.el-tag--danger {
    background-color: #fff;
    border-color: #fbc4c4;
    color:#f56c6c
}

.el-tag--plain.el-tag--danger.is-hit {
    border-color:#F56C6C
}

.el-tag--plain.el-tag--danger .el-tag__close {
    color:#f56c6c
}

.el-tag--plain.el-tag--danger .el-tag__close:hover {
    color: #FFF;
    background-color:#f56c6c
}



.el-tag--medium {
    height: 28px;
    line-height:26px;
	.el-icon-close {
	    -webkit-transform: scale(.8);
	    transform:scale(.8)
	}
}

.el-tag--small {
    height: 24px;
    padding: 0 8px;
    line-height:22px;
	
	.el-icon-close {
	    -webkit-transform: scale(.8);
	    transform:scale(.8)
	}
}

.el-tag--mini {
    height: 20px;
    padding: 0 5px;
    line-height:19px;
	.el-icon-close {
	    margin-left: -3px;
	    -webkit-transform: scale(.7);
	    transform:scale(.7)
	}
}