.host {
  display: flex;
  flex-direction: column;
  padding-block: var(--vkui--size_base_padding_vertical--regular);
  padding-inline: var(--vkui--size_base_padding_horizontal--regular);
}

.column {
  flex-direction: column;
}

.row {
  flex-direction: row;
  flex-wrap: wrap;
}

/* stylelint-disable selector-max-universal -- Управляем флексом элементов и гапом */

.host > * {
  flex: 1;
}

.column > * {
  margin-block-end: var(--vkui--size_base_padding_vertical--regular);
}

.column > *:last-child {
  margin-block-end: 0;
}

.row > * {
  margin-inline-end: var(--vkui--size_base_padding_horizontal--regular);
}

.row > *:last-child {
  margin-inline-end: 0;
}

/* Если элементов больше чем 2, то растягиваем первый элемент */

.row > *:first-child:nth-last-child(n + 3) {
  flex: auto;
  inline-size: 100%;
  margin-block-end: var(--vkui--size_base_padding_vertical--regular);
  margin-inline-end: 0;
}

/* stylelint-enable selector-max-universal */
