/* Overrides for semantic ui css values. Placed in same format and using same commenting structure */

/*******************************
           Checkbox
*******************************/

/*--------------
     Active
---------------*/

.ui.checkbox input:checked ~ .box:before,
.ui.checkbox input:checked ~ label:before {
  background: #2d78c9;
  border-color: rgba(34, 36, 38, 0.35);
}

.ui.checkbox input:checked ~ .box:after,
.ui.checkbox input:checked ~ label:after {
  opacity: 1;
  color: #ffffff;
}

/*--------------
  Active Focus
---------------*/

.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box:before,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:before,
.ui.checkbox input:checked:focus ~ .box:before,
.ui.checkbox input:checked:focus ~ label:before {
  background: #2d78c9;
  border-color: rgba(34, 36, 38, 0.35);
}

.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ .box:after,
.ui.checkbox input:not([type="radio"]):indeterminate:focus ~ label:after,
.ui.checkbox input:checked:focus ~ .box:after,
.ui.checkbox input:checked:focus ~ label:after {
  color: #ffffff;
}

/* ----- Radio Button Styles ----- */

/* Radio Checkbox */

.ui.radio.checkbox .box:after,
.ui.radio.checkbox label:after {
  background-color: #ffffff;
}

/* Active */

.ui.radio.checkbox input:checked ~ .box:before,
.ui.radio.checkbox input:checked ~ label:before {
  background-color: #2d78c9;
}

.ui.radio.checkbox input:checked ~ .box:after,
.ui.radio.checkbox input:checked ~ label:after {
  background-color: #ffffff;
}

/* Active Focus */

.ui.radio.checkbox input:focus:checked ~ .box:before,
.ui.radio.checkbox input:focus:checked ~ label:before {
  background-color: #2d78c9;
}

.ui.radio.checkbox input:focus:checked ~ .box:after,
.ui.radio.checkbox input:focus:checked ~ label:after {
  background-color: #ffffff;
}