/* src/css/lib/check.css */
.check-box {
  width: 100%;
  height: 40px;
  position: relative;
  display: inline-block;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.check-box.xl {
  height: 48px;
}
.check-box.lg {
  height: 44px;
}
.check-box.sm {
  height: 36px;
}
.check-box.tn {
  height: 32px;
}
.check-box input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}
.check-box .text {
  display: flex;
  height: 100%;
  align-items: center;
  padding-left: 36px;
  border-radius: 4px;
  background-color: #F3F4F6;
}
.check-box.notbg .text {
  background-color: transparent;
}
.check-box .mark {
  position: absolute;
  top: 50%;
  left: 8px;
  transform: translateY(-50%);
  width: 20px;
  height: 20px;
  background-color: rgba(0, 0, 0, 0.2);
}
.check-box input[type=checkbox] ~ .mark {
  border-radius: 4px;
}
.check-box input[type=radio] ~ .mark {
  border-radius: 50%;
}
.check-box:hover input ~ .mark {
  background-color: rgba(0, 0, 0, 0.3);
}
.check-box input:checked ~ .mark {
  background-color: #03A9F4;
}
.check-box.green input:checked ~ .mark {
  background-color: #4CAF50;
}
.check-box.orange input:checked ~ .mark {
  background-color: #FF9800;
}
.check-box.blue input:checked ~ .text {
  background-color: #81D4FA;
}
.check-box.green input:checked ~ .text {
  background-color: #A5D6A7;
}
.check-box.orange input:checked ~ .text {
  background-color: #FFCC80;
}
.check-box input:disabled ~ .mark {
  background-color: #fff;
}
.check-box input:disabled ~ .text {
  color: #A1A1AA;
  text-decoration: line-through;
}
.switch {
  position: relative;
  display: inline-block;
  width: 48px;
  height: 28px;
}
.switch input {
  opacity: 0;
  width: 0;
  height: 0;
}
.switch .slider {
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.1);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: 0.4s;
}
.switch .slider:before {
  position: absolute;
  content: "";
  height: 20px;
  width: 20px;
  left: 4px;
  bottom: 4px;
  background-color: #fff;
  box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
  transition: 0.4s;
}
.switch input:checked ~ .slider {
  background-color: #0ea5e9;
}
.switch.green input:checked ~ .slider {
  background-color: #10b981;
}
.switch.red input:checked ~ .slider {
  background-color: #f87171;
}
.switch input:checked ~ .slider:before {
  transform: translateX(20px);
}
.switch .slider.round {
  border-radius: 28px;
}
.switch .slider.round:before {
  border-radius: 50%;
}
/*# sourceMappingURL=check.css.map */