/* ==========================================================================
   Formidable Forms, restyled to the FKC design system.
   --------------------------------------------------------------------------
   The static pages are served without wp_head(), so Formidable's own
   stylesheet is never enqueued and its markup arrives with browser-default
   inputs. Rather than load Formidable's CSS and then fight it, this styles its
   markup directly using the design tokens the page already carries.

   Mapping to the hand-built form these replaced:
     .frm_form_field      -> .field
     .frm_primary_label   -> .field label
     inputs / select / ta -> .input
     .frm_button_submit   -> .btn .btn--accent
   ========================================================================== */

.frm_forms,
.frm_forms .frm_form_fields > fieldset {
  border: 0;
  margin: 0;
  padding: 0;
  min-inline-size: 0;          /* fieldsets refuse to shrink without this */
}

.frm_forms .frm_fields_container {
  display: grid;
  gap: var(--sp-3);
}

/* ---- fields ------------------------------------------------------------- */
.frm_forms .frm_form_field {
  display: grid;
  gap: var(--sp-1);
  margin: 0;
}

.frm_forms .frm_primary_label {
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  color: var(--tx-on-light);
  margin: 0;
  padding: 0;
}

/* Formidable marks required fields with a span; match the site's abbr. */
.frm_forms .frm_required {
  color: var(--st-error);
  font-weight: var(--fw-semibold);
}

.frm_forms input[type="text"],
.frm_forms input[type="email"],
.frm_forms input[type="tel"],
.frm_forms input[type="number"],
.frm_forms input[type="url"],
.frm_forms input[type="password"],
.frm_forms input[type="file"],
.frm_forms select,
.frm_forms textarea {
  width: 100%;
  font-family: var(--ff-body);
  font-size: var(--fs-base);
  color: var(--tx-on-light);
  background: var(--bg-raised);
  border: 1px solid var(--c-cream-300);
  border-radius: var(--r-md);
  padding: var(--sp-1) var(--sp-2);
  min-height: var(--touch-min);
  transition: border-color var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-fast) var(--ease-out);
}

.frm_forms textarea { min-height: 8rem; padding-block: var(--sp-1); }

.frm_forms input:focus-visible,
.frm_forms select:focus-visible,
.frm_forms textarea:focus-visible {
  outline: var(--focus-width) solid var(--focus-ring);
  outline-offset: var(--focus-offset);
  border-color: var(--c-sage-600);
}

.frm_forms .frm_description,
.frm_forms .frm_form_field .frm_description {
  font-size: var(--fs-xs);
  color: var(--tx-on-light-muted);
}

/* ---- radios and checkboxes ---------------------------------------------- */
.frm_forms .frm_opt_container { display: grid; gap: var(--sp-1); }
.frm_forms .frm_radio,
.frm_forms .frm_checkbox {
  display: flex;
  align-items: center;
  gap: var(--sp-1);
  min-height: var(--touch-min);   /* whole row is the tap target */
  font-size: var(--fs-sm);
  color: var(--tx-on-light);
}
.frm_forms .frm_radio input,
.frm_forms .frm_checkbox input {
  width: 1.15rem;
  height: 1.15rem;
  accent-color: var(--c-sage-600);
  margin: 0;
  flex: 0 0 auto;
}
.frm_forms .frm_radio label,
.frm_forms .frm_checkbox label { font-weight: var(--fw-regular); margin: 0; }

/* ---- submit ------------------------------------------------------------- */
.frm_forms .frm_submit { margin-top: var(--sp-4); }

.frm_forms .frm_button_submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-1);
  font-family: var(--ff-body);
  font-size: var(--fs-sm);
  font-weight: var(--fw-semibold);
  min-height: var(--touch-min);
  padding: var(--sp-1) var(--sp-4);
  border: 1px solid transparent;
  border-radius: var(--r-pill);
  background: var(--btn-accent-bg);
  color: var(--btn-accent-tx);
  cursor: pointer;
  transition: background-color var(--dur-base) var(--ease-craft),
              transform var(--dur-fast) var(--ease-out),
              box-shadow var(--dur-base) var(--ease-craft);
}
.frm_forms .frm_button_submit:hover {
  background: var(--btn-accent-bg-hover);
  transform: translateY(-2px);
  box-shadow: var(--sh-md);
}
.frm_forms .frm_button_submit:active { transform: translateY(0); }

/* ---- validation and messages -------------------------------------------- */
.frm_forms .frm_error,
.frm_forms .frm_error_style {
  font-size: var(--fs-sm);
  color: #6E241F;
  background: #F6E7E5;
  border-radius: var(--r-md);
  padding: var(--sp-2);
}
.frm_forms .frm_blank_field input,
.frm_forms .frm_blank_field select,
.frm_forms .frm_blank_field textarea { border-color: var(--st-error); }
.frm_forms .frm_blank_field .frm_error { background: none; padding: 0; }

.frm_forms .frm_message,
.frm_message {
  font-size: var(--fs-md);
  color: var(--c-sage-700);
  background: var(--c-sage-100);
  border-radius: var(--r-md);
  padding: var(--sp-3);
}

/* Formidable's honeypot must stay hidden. */
.frm_forms .frm_verify { position: absolute; left: -9999px; }