/* form-embed.css — styles forms built in the Site Editor's FORMS section and
   embedded via %%form:id%% tokens (see .eleventy.js's form-tokens transform).
   Uses jQuery formBuilder/formRender (kevinchappell/formBuilder) — targets
   plain elements rather than library-specific classes so it isn't fragile
   to formRender's exact generated markup. */

.form-embed-wrap { max-width: 32rem; }

.form-embed-wrap .form-group,
.form-embed-wrap .frmb-render-form > div { margin: 0 0 0.875rem; }

.form-embed-wrap label {
  display: block; font-family: var(--head); font-weight: 600;
  font-size: .82rem; color: var(--navy); margin: 0 0 0.375rem;
}

.form-embed-wrap :is(input, textarea, select):not([type=checkbox]):not([type=radio]) {
  width: 100%; font: inherit; color: var(--ink); background: #fff;
  border: 1px solid #d6deea; border-radius: 0.5625rem;
  padding: 0.6875rem 0.8125rem; box-sizing: border-box;
}
.form-embed-wrap :is(input, textarea, select):focus {
  outline: 2px solid var(--cyan-text); outline-offset: 1px; border-color: var(--cyan-text);
}
.form-embed-wrap textarea { resize: vertical; min-height: 7rem; }

.form-embed-wrap .btn { width: auto; margin-block-start: 0.25rem; }

/* Form-level result/error message (see form-tokens transform in .eleventy.js) */
.form-embed-wrap .alert { border-radius: var(--radius); padding: 0.75rem 1rem; font-size: .85rem; margin: 0.875rem 0 0; }
.form-embed-wrap .alert-danger { background: #fdecec; border: 1px solid #f3b6b6; color: #8a2a2a; }

/* Success state (form hidden, this shown) */
.form-embed-result {
  font-size: .95rem; color: var(--navy); padding: 1rem;
  background: #f7fafd; border: 1px solid #e7ecf3; border-radius: var(--radius);
}