/*
p-form
:.. p-form__fields
    :.. p-form__field (p-form__field--submit | p-form__field--50 | p-form__field--25 | ...)
    :.. ...
        :.. label
        :.. field
*/

.p-form label {
  display: block !important;
  margin-bottom: var(--v-form-field__label-margin) !important;
  font-size: 100% !important;
  line-height: var(--v-line-height__default) !important;
}

.p-form fieldset {
  margin: 0 !important;
  padding: 0 !important;
  background-color: transparent !important;
  border: none !important;
}

.p-form fieldset > :last-child {
  margin-bottom: 0 !important;
}

.p-form legend {
  display: block !important;
  font-size: var(--v-font-size__h3) !important;
  font-weight: var(--v-font-weight__default--bold);
  margin: 0 0 var(--v-form__spacing) 0 !important;
}

.p-form input[type="text"],
.p-form input[type="search"],
.p-form input[type="email"],
.p-form input[type="number"],
.p-form input[type="tel"],
.p-form input[type="password"],
.p-form textarea,
.p-form select {
  background-color: var(--v-color__1--150) !important;
  border: var(--v-form-field__border-size) solid var(--v-color__1--150) !important;

  display: block !important;
  width: 100% !important;
  padding: var(--v-form-field__padding--tb) var(--v-form-field__padding--rl) !important;
  margin: 0 !important;
  border-radius: var(--v-border-radius__lg) !important;
  font-size: var(--v-form-field__font-size) !important;
  font-family: var(--v-font-family__default) !important;
  line-height: var(--v-form-field__line-height) !important;
  box-shadow: none !important;
  block-size: unset !important;
  transition: var(--v-transition__default) !important;
}

.p-form textarea {
  border-radius: var(--v-border-radius__md) !important;
}

.p-form input[type="text"]:focus,
.p-form input[type="search"]:focus,
.p-form input[type="email"]:focus,
.p-form input[type="number"]:focus,
.p-form input[type="tel"]:focus,
.p-form input[type="password"]:focus,
.p-form textarea:focus,
.p-form select:focus {
  outline: none !important;
  border-color: var(--v-color__1) !important;
}

.p-form input[type="number"]::-webkit-outer-spin-button,
.p-form input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

.p-form input[type="number"] {
  -moz-appearance: textfield !important;
}

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

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

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

.p-form__field-comment {
  font-style: italic;
  font-size: 90%;
}

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

  .p-form__field--50 {
    flex-basis: 50%;
  }
}
