@use "@fox/styles/abstracts" as fox;

.fields {
  display: flex;
  inline-size: 100%;
  min-inline-size: 0;
  flex-direction: column;
}

.field {
  display: flex;
  inline-size: 100%;
  flex-direction: column;
  gap: fox.gap(3);
  padding-block: fox.padding(6);
  border-block-end: fox.border(1) solid fox.color(border-neutral-subtler);
}

.pair {
  display: flex;
  align-items: flex-start;
  gap: fox.gap(3);

  > * {
    flex: 1 1 0;
    min-inline-size: 0;
  }
}

.sectionTitle {
  margin: 0;
  padding-block-start: fox.padding(6);
  color: fox.color(font-theme-primary);
  font-family: fox.font-family(body);
  font-size: fox.font-size(label-md);
  font-weight: fox.font-weight(bold);
}