.FormItem {
  padding: 12px 16px;
  display: block;
}

.FormItem__top {
  padding-top: 2px;
  padding-bottom: 8px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  color: var(--text_secondary);
}

.FormItem--sizeY-compact .FormItem__top {
  padding-bottom: 6px;
}

.FormItem__bottom {
  color: var(--text_secondary);
  padding-top: 8px;
}

.FormItem--sizeY-compact .FormItem__bottom {
  padding-top: 6px;
}

.FormItem--error .FormItem__bottom {
  color: var(--field_error_border);
}

.FormItem--valid .FormItem__bottom,
.FormItem--verified .FormItem__bottom {
  color: var(--field_valid_border);
}

.FormItem .Cell,
.FormItem .SimpleCell,
.FormItem .RichCell,
.FormItem .CellButton,
.FormItem .Radio,
.FormItem .Checkbox {
  width: 100%;
  box-sizing: content-box;
  margin-left: -16px;
  margin-right: -16px;
}

/**
 * iOS
 */

.FormItem--ios,
.FormItem--ios .Removable {
  padding-left: 12px;
  padding-right: 12px;
}

.FormItem--ios .Cell,
.FormItem--ios .SimpleCell,
.FormItem--ios .RichCell,
.FormItem--ios .CellButton,
.FormItem--ios .Radio,
.FormItem--ios .Checkbox,
.FormItem--ios .Removable {
  margin-left: -12px;
  margin-right: -12px;
}

/**
 * ANDROID & VKCOM
 */

.FormItem--android .Removable__remove,
.FormItem--vkcom .Removable__remove {
  margin-top: -2px;
  margin-bottom: -2px;
  margin-right: -16px;
}

.FormItem--android.FormItem--sizeY-compact .Removable__remove,
.FormItem--vkcom.FormItem--sizeY-compact .Removable__remove {
  margin-left: 2px;
  margin-right: -14px;
  margin-top: -4px;
  margin-bottom: -4px;
}
