
/* selection选框盒子 */
.selection-box{display: inline-block;height: auto;overflow: hidden;position: relative;text-align: center;vertical-align: middle;margin: 0;padding: 0;cursor: pointer;}
.selection-box.checkbox,
.selection-box.radio{padding-left: 20px;}
.selection-box.selection-inline{margin-top: 0;}

.selection-box label{display: inline-block;position: relative;margin: 0;padding: 0;padding-left: 4px;font-size: 14px;color: #333;line-height: 26px;font-weight: 400;cursor: pointer;}
.selection-box label::before{content: "";display: inline-block;width: 16px;height: 16px;background-color: #fff;border: 1px solid #aaa;border-radius: 2px;position: absolute;top: 5px;left: -18px;z-index: 1;cursor: pointer;}
.selection-box label::after{display: inline-block;width: 16px;height: 16px;font-size: 12px;color: #333;line-height: 16px;text-align: center;position: absolute;left: -18px;top: 5px;z-index: 2;cursor: pointer;}
.selection-box.selection-circle label::before,
.selection-box.selection-circle label::after{border-radius: 100%;}

/* 默认 */
.selection-box input[type="checkbox"],
.selection-box input[type="radio"]{
margin: 0;padding: 0;position: absolute;top: 5px;left: 2px;z-index: 5;cursor: pointer;opacity: 0;}
.selection-box input[type="checkbox"]:hover + label::before,
.selection-box input[type="radio"]:hover + label::before{border-color: #333;}
.selection-box input[type="checkbox"]:checked + label::after,
.selection-box input[type="radio"]:checked + label::after{font-family: "FontAwesome";content: "\f00c";}

/* 不可用 */
.selection-box input[type="checkbox"]:disabled,
.selection-box input[type="checkbox"]:disabled + label::before,
.selection-box input[type="checkbox"]:disabled + label::after,
.selection-box input[type="radio"]:disabled,
.selection-box input[type="radio"]:disabled + label::after,
.selection-box input[type="radio"]:disabled + label::before,
.selection-box.selection-disabled,
.selection-box.selection-disabled label{cursor: default;}
.selection-box.selection-disabled label::before,
.selection-box.selection-disabled label::before{background-color: #ddd;}
.selection-box input[type="checkbox"]:disabled + label,
.selection-box input[type="radio"]:disabled + label{opacity: 0.7;}
.selection-box.selection-disabled input[type="checkbox"]:hover + label::before,
.selection-box.selection-disabled input[type="radio"]:hover + label::before{border-color: #aaa;}

/* 蓝色 */
.selection-box.selection-primary input[type="checkbox"]:checked + label::before,
.selection-box.selection-primary input[type="radio"]:checked + label::before{background-color: #337ab7;border-color: #337ab7;}
.selection-box.selection-primary input[type="checkbox"]:checked + label::after,
.selection-box.selection-primary input[type="radio"]:checked + label::after{color: #fff;}

/* 绿色 */
.selection-box.selection-success input[type="checkbox"]:checked + label::before,
.selection-box.selection-success input[type="radio"]:checked + label::before{background-color: #5cb85c;border-color: #5cb85c;}
.selection-box.selection-success input[type="checkbox"]:checked + label::after,
.selection-box.selection-success input[type="radio"]:checked + label::after{color: #fff;}

/* 天蓝色 */
.selection-info input[type="checkbox"]:checked + label::before,
.selection-info input[type="radio"]:checked + label::before{background-color: #5bc0de;border-color: #5bc0de;}
.selection-info input[type="checkbox"]:checked + label::after,
.selection-info input[type="radio"]:checked + label::after{color: #fff;}

/* 黄色 */
.selection-warning input[type="checkbox"]:checked + label::before,
.selection-warning input[type="radio"]:checked + label::before{background-color: #f0ad4e;border-color: #f0ad4e;}
.selection-warning input[type="checkbox"]:checked + label::after,
.selection-warning input[type="radio"]:checked + label::after {color: #fff;}

/* 红色 */
.selection-danger input[type="checkbox"]:checked + label::before,
.selection-danger input[type="radio"]:checked + label::before{background-color: #d9534f;border-color: #d9534f;}
.selection-danger input[type="checkbox"]:checked + label::after,
.selection-danger input[type="radio"]:checked + label::after{color: #fff;}
