// Checkbox
// --------------------------------------------------

.checkbox {
  display: block;
}

.checkbox-on {
  display: none;
}

.checkbox-off {
  display: block;
}

.checkbox[aria-checked=true] {

  .checkbox-on {
    display: block;
  }

  .checkbox-off {
    display: none;
  }

}

.checkbox[aria-disabled=true] {
  pointer-events: none;
  opacity: 0.5;
  color: gray;

  .media-checkbox {
    color: inherit;
  }
}

.checkbox .item-media,
.checkbox .item-content {
  pointer-events: none;
}