.base{
  position: relative;
  display: inline-flex;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  outline: 0;
  vertical-align: baseline;
  font-style: normal;
  min-height:  var(--local_labelfont);
  font-size: var(--local_labelfont);
  line-height:  var(--local_labelfont);
  min-width:  15px;
}
.pointer,
.readonly,
.disabled {
  cursor: var(--checkbox_cursor)
}
.pointer {
  --checkbox_cursor: pointer
}
.disabled{
  --checkbox_cursor:not-allowed
}
.readonly {
  --checkbox_cursor: default
}

.size_sm{
--local_after_left:4px;
--local_after_width:4px;
--local_after_height:8px;
--local_after_borderWidth:1.5px;
--local_before_width:12px;
--local_before_height:12px;
--local_labelfont:14px
}
.indeterminate.size_sm{
  --local_after_width: 6px;
  --local_after_top: 40%;
}

.size_md{
  --local_after_left:5px;
  --local_after_width:5px;
  --local_after_height:10px;
  --local_after_borderWidth:2px;
  --local_before_width:15px;
  --local_before_height:15px;
  --local_labelfont:16px
}
.size_lg{
  --local_after_left:6px;
  --local_after_width:6px;
  --local_after_height:12px;
  --local_after_borderWidth:2.5px;
  --local_before_width:18px;
  --local_before_height:18px;
  --local_labelfont:18px
}
.indeterminate.size_md{
  --local_after_width: 8px;
  --local_after_top: 42%;
}
.indeterminate.size_lg{
  --local_after_width: 10px;
  --local_after_top: 45%;
}

.primary{
  --local_before_bg: var(--lib_primary_bg_color);

}
.danger{
  --local_before_bg: var(--lib_danger_bg_color);

}
.success{
  --local_before_bg: var(--lib_success_bg_color);
}

.label{
  color: #000;
  -webkit-transition: color .1s ease;
  transition: color .1s ease;
  line-height:  var(--local_labelfont);
  margin: 0 10px;
}
.check_button:before{
  left:  var(--local_after_left);
  top: 0;
  width:  var(--local_after_width);
  height: var(--local_after_height);
  border: solid #fff;
  border-width: 0  var(--local_after_borderWidth)  var(--local_after_borderWidth) 0;
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
  content: "";
  position: absolute;
  opacity: 0;
}
.check_button{
  width: var(--local_before_width);
  height: var(--local_before_height);
  background: #fff;
  border-radius: .21428571rem;
  border: 1px solid #ddd;
}
.checkContainment .check_button,.indeterminate .check_button{
    background-color: var(--local_before_bg);
    color:#eee
}
.indeterminate .check_button:before{
  transform: none;
  border-width: 0px;
  background: #fff;
  height: 10%;
  width: var(--local_after_width);
  top: var(--local_after_top);
}
.checkContainment .check_button:before,.indeterminate .check_button:before{
  opacity: 1;
  color: #000;
}
.inputCheckbox{
  cursor: inherit;
  width: inherit;
  height: inherit;
  opacity: 0;
  composes: cover from "../../commoncss/flex.module.css";
  top: 0;
  left: 0;
  margin: 0;
  padding: 0;
  z-index: 1;
}