.p-form {
  --color-error: #881337;
  --color-error--light: #ffe4e6;
  --color-success: #14532d;
  --color-success--light: #dcfce7;

  --spacing: 1.5rem;
  --spacing-repeater-buttons: 2.3rem;

  --border-radius: var(--v-border-radius-xs);

  --v-field-padding: 1rem;
  --v-field-border: 1px solid #686e77;
  --v-field-height: 2.5rem;
  --v-field-font-size: 1rem;
  --v-field-border-radius: var(--v-border-radius-sm);
  --v-field-shadow: var(--v-shadow-xs);
}

.p-form input[type="radio"],
.p-form input[type="checkbox"] {
  margin: 0;
  width: 1.2rem;
  height: 1.2rem;
}

.p-form .select2-selection,
.p-form input[type="text"],
.p-form input[type="email"],
.p-form input[type="search"],
.p-form select,
.p-form textarea {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0 var(--v-field-padding);
  border: var(--v-field-border) !important;
  height: var(--v-field-height);
  line-height: var(--v-field-height);
  font-size: var(--v-field-font-size);
  border-radius: var(--v-field-border-radius) !important;
  box-sizing: border-box !important;
  box-shadow: var(--v-field-shadow);
}

.p-form textarea {
  line-height: 1.3;
  height: 10rem;
}

.p-form__field--comment {
  font-style: italic;
  font-size: 80%;
  line-height: 1.3;
}

.p-form__fields {
  display: flex;
  flex-wrap: wrap;
  row-gap: var(--spacing);
  margin: 0 calc(var(--spacing) / 2 * -1);
}

.p-form__field {
  flex-basis: 100%;
  padding: 0 calc(var(--spacing) / 2);
}

.p-form .select2-selection {
  height: auto !important;
}

.p-form span.select2-container,
.p-form span.select2-container span {
  display: block;
}

.p-form .select2-selection__rendered {
  padding: 0 !important;
  margin: 0 !important;
  float: none;
  display: flex !important;
  flex-wrap: wrap;
  gap: 0.3rem;
}

.p-form input[type="search"].select2-search__field {
  max-width: 100% !important;
  border: none !important;
}

.p-form .select2-search,
.p-form .select2-selection__choice {
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

.p-form .select2-selection__choice {
  margin: 0.3rem 0 !important;
}

@media (min-width: 700px) {
  .p-form__field--50 {
    flex-basis: 50%;
  }

  .p-form__field--33 {
    flex-basis: 33.33%;
  }
}