.content {
  display: flex;
  flex-flow: column nowrap;
  gap: 12px;
  margin: 0 24px 0 0;
}

.row {
  display: flex;
  flex-flow: row nowrap;
  gap: 12px;
  align-items: flex-start;
  justify-content: flex-start;

  height: 40px;

  &.no-mb {
    margin-bottom: -51px;
  }

  .ml-auto {
    margin-left: auto;
  }
}

.h1 {
  flex: 1 1 auto;
  font: var(--default-font-h1);
}

.mr-auto {
  margin-right: auto;
}

.section {
  display: flex;
  flex-flow: column nowrap;
  gap: 12px;

  .header > button {
    cursor: pointer;

    display: inline-flex;
    flex-flow: row nowrap;
    gap: 4px;
    align-items: center;

    font-size: 16pt;

    background: none;
    border: none;

    .icon {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition: transform 0.2s ease;

      &.turned {
        transform: rotate(-180deg);
      }
    }
  }

  .form-content {
    display: flex;
    flex: 1 0 auto;
    flex-flow: row wrap;
    gap: 12px;
  }
}

.gray {
  color: var(--color-gray-aaa);
}
