.Checkbox {
  display: block;
  }

  .Checkbox__input {
    display: none;
    }

  .Checkbox__container {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    }

    .Checkbox__icon {
      flex-shrink: 0;
      width: 20px;
      height: 20px;
      box-sizing: border-box;
      margin: 0 14px 0 2px;
      border-radius: 4px;
      border: 2px solid var(--icon_secondary);
      color: transparent;
      }

    .Checkbox__content {
      flex-grow: 1;
      font-size: 16px;
      line-height: 20px;
      color: var(--text_primary);
      }

  .Checkbox__input:checked ~ .Checkbox__container .Checkbox__icon {
    background-color: var(--accent);
    border-color: var(--accent);
    color: var(--white);
    }

  .Checkbox__input[disabled] ~ .Checkbox__container {
    opacity: .6;
    }

.Checkbox--ios {
  padding: 12px;
  }

  .Checkbox--ios .Checkbox__container {}

    .Checkbox--ios .Checkbox__content {
      font-size: 16px;
      line-height: 20px;
      }

.Checkbox--android {
  padding: 16px;
  }

  .Checkbox--android .Checkbox__container {}

    .Checkbox--android .Checkbox__content {
      font-size: 16px;
      line-height: 20px;
      }