.color-primary {
    color: var(--brand-primary);
}

.bg-primary {
    background-color: var(--brand-primary);
}

a {
    color: var(--brand-primary);
    cursor: pointer;
}

a:hover, a:focus {
    color: var(--brand-primary);
    text-decoration: none;
}

a:focus {
    outline: none;
    outline-offset: unset;
}

input:focus {
	border: 1px solid var(--brand-primary);
}

input:focus-visible {
	outline: none;
}

/* \u64cd\u4f5c\u6309\u94ae\u60ac\u6d6e */
.btn-default:hover {
    border-color: var(--brand-primary);
    background: none;
    color: var(--brand-primary);
}

/* \u64cd\u4f5c\u6309\u94ae\u56fe\u6807 */
.btn-default:hover>span {
    border-color: var(--brand-primary);
    background: none;
    color: var(--brand-primary);
}

/* \u9f20\u6807\u60ac\u6d6e\u3010\u5168\u9009\u3011\u6309\u94ae\u65f6\uff0c\u6309\u94ae\u4e0a\u56fe\u6807\u989c\u8272 */
.btn-default:hover>span>span {
    color: var(--brand-primary);
}

/* \u64cd\u4f5c\u6309\u94ae\u70b9\u51fb */
.btn-default:focus, .btn-default.focus {
   	background: none;
    border-color: var(--brand-primary);
    color: var(--brand-primary);
}

/* \u64cd\u4f5c\u6309\u94ae\u70b9\u51fb\u65f6\u56fe\u6807\u989c\u8272 */
.btn-default:focus>span, .btn-default.focus>span {
    color: var(--brand-primary);
}

/* \u70b9\u51fb\u3010\u5168\u9009\u3011\u6309\u94ae\u65f6\uff0c\u6309\u94ae\u4e0a\u56fe\u6807\u989c\u8272 */
.btn-default:focus>span>span, .btn-default.focus>span>span {
    color: var(--brand-primary);
}

/* \u64cd\u4f5c\u6309\u94ae\u5904\u4e8e\u70b9\u51fb\u72b6\u6001\u65f6 */
.btn-default:active, .btn-default.active {
    background: none;
    box-shadow: none;
    border-color: var(--brand-primary);
}

/* \u70b9\u51fb\u64cd\u4f5c\u6309\u94ae\u540e\u51fa\u73b0\u4fe1\u606f\u63d0\u793a\u6846\u65f6 */
.btn-default:active:hover, .btn-default.active:hover {
	background: none;
	border-color: var(--brand-primary);
	color: var(--brand-primary);
}

/* \u52fe\u9009\u6570\u636e\u6761\u6570 */
.text-primary {
    color: var(--brand-primary);
}

/* start-\u4fee\u6539checkbox\u6837\u5f0fy */
input[type=checkbox] {
	text-align: center;
    vertical-align: middle;
    border: none;
    appearance: none;
    -webkit-appearance: none;
    outline: none;
    cursor: pointer;
    margin-top: 0;
}

input[type=checkbox]::after {
	content: "";
	display: inline-block;
	width: 14px;
    height: 14px;
    border: 1px solid #D3D3D3;
    color: #fff;
}

input[type=checkbox]:hover:after {
	border-color: var(--brand-primary);
}

input[type=checkbox]:checked:after {
	content: "\2713";
	width: 14px;
    height: 14px;
    line-height: 12px;
    border: 1px solid var(--brand-primary);
    color: #fff;
    background: var(--brand-primary);
    -webkit-font-smoothing: antialiased;
    font-size: 14px;
    font-weight: 400;
}

input[type=checkbox]:focus {
	outline: none;
}
/* end-\u4fee\u6539checkbox\u6837\u5f0fy */

/* start-\u4fee\u6539radio\u6837\u5f0fy */
input[type="radio"]:focus {
	outline: none;
	border: none;
}

input[type=radio] {
    width: 20px;
    height: 20px;
    appearance: none;
    position: relative;
    outline: none;
    border: none;
}
input[type=radio]:before {
    content: "";
    width: 14px;
    height: 14px;
    border: 1px solid var(--brand-primary);
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
}
input[type=radio]:checked:before {
    content: "";
    width: 14px;
    height: 14px;
    border: 1px solid var(--brand-primary);
    display: inline-block;
    border-radius: 50%;
    vertical-align: middle;
}
input[type=radio]:checked:after {
    content: "";
    width: 8px;
    height: 8px;
    text-align: center;
    background: var(--brand-primary);
    border-radius: 50%;
    display: block;
    position: absolute;
    top: 3px;
    left: 3px;
}
input[type=radio] + label, input[type=radio]:checked + label {
    color: #666;
    margin-left: 5px;
}
/* end-\u4fee\u6539radio\u6837\u5f0fy */

/* \u6309\u94ae\u6dfb\u52a0\u5168\u5c40\u6837\u5f0fy */
.gridtable input[type="button"] {
    color: #666666;
    background: #fff;
    border: 1px solid #D3D3D3;
    font-size: 12px;
    height: 24px;
    line-height: 24px;
    display: inline-block;
    border-radius: 4px;
    padding: 0 12px;
}

.gridtable input[type="button"]:hover {
    color: var(--brand-primary);
    border: 1px solid var(--brand-primary);
}

input[type="button"], button {
    color: #666666;
    background: #fff;
    border: 1px solid #D3D3D3;
    font-size: 12px;
    height: 32px;
    line-height: 32px;
    display: inline-block;
    border-radius: 4px;
    padding: 0 12px;
}

input[type="button"]:hover, button:hover {
	background: #fff;
    color: var(--brand-primary);
    border: 1px solid var(--brand-primary);
}