.ios {
  .icon-checkbox,
  .checkbox i {
    &:after {
      content: 'checkbox_ios';
      font-size: 21px;
    }
  }

  label.item-checkbox {
    &.active-state {
      transition-duration: 0ms;
    }
  }
  label.item-checkbox input[type="checkbox"]:indeterminate ~ .icon-checkbox,
  label.item-checkbox input[type="checkbox"]:indeterminate ~ * .icon-checkbox,
  .checkbox input[type="checkbox"]:indeterminate ~ i {
    &:after {
      height: 1px;
      margin-top: 0px;
    }
  }
  label.item-checkbox.item-checkbox-icon-end input[type="checkbox"] ~ .icon-checkbox {
    position: absolute;
    top: 50%;
    margin-top: -11px;
    .ltr({
      right: calc(var(--f7-safe-area-right) + 10px);
    });
    .rtl({
      left: calc(var(--f7-safe-area-left) + 10px);
    })
  }
  label.item-checkbox.item-checkbox-icon-end {
    .item-inner {
      .ltr({
        padding-right: calc(var(--f7-safe-area-right) + 36px);
      });
      .rtl({
        padding-left: calc(var(--f7-safe-area-left) + 36px);
      });
    }
  }
  label.item-checkbox-icon-start {
    > .icon-checkbox {
      .ltr({
        margin-right: calc(var(--f7-list-item-media-margin) + var(--f7-checkbox-extra-margin));
      });
      .rtl({
        margin-left: calc(var(--f7-list-item-media-margin) + var(--f7-checkbox-extra-margin));
      });
    }
  }
}