/* WBN Forms — base styles. Deliberately light: colours and radius come from CSS variables so a theme can restyle. */
.wbnf-form { --wbnf-accent: var(--green, #4F6B2C); --wbnf-error: #B3412E; --wbnf-line: #E2D8CA; --wbnf-fill: #FAF6EE; --wbnf-radius: .875rem; position: relative; }
.wbnf-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; }
.wbnf-w-full { grid-column: 1 / -1; }
@media (max-width: 560px) { .wbnf-w-half { grid-column: 1 / -1; } }
.wbnf-step { border: 0; margin: 0; padding: 0; min-width: 0; display: none; }
.wbnf-step.is-active, .wbnf-form:not([data-steps]) .wbnf-step, .wbnf-form[data-steps="1"] .wbnf-step { display: block; }
.wbnf-step > legend { font-weight: 700; margin-bottom: 1rem; padding: 0; }
.wbnf-form .wbnf-progress { display: flex; gap: .5rem; list-style: none; margin: 0 0 1.25rem; padding: 0; font-size: .8125rem; }
.wbnf-form .wbnf-progress li { margin: 0; }
.wbnf-progress li { flex: 1; padding-top: .5rem; border-top: 3px solid var(--wbnf-line); color: #6E625A; }
.wbnf-progress li.is-done, .wbnf-progress li.is-current { border-color: var(--wbnf-accent); }
.wbnf-progress li.is-current { color: inherit; font-weight: 600; }
.wbnf-field { position: relative; min-width: 0; }
.wbnf-field[hidden] { display: none; }
.wbnf-field label { display: block; font-weight: 600; font-size: .875rem; margin-bottom: .375rem; }
.wbnf-req { color: var(--wbnf-error); }
.wbnf-field input[type="text"], .wbnf-field input[type="email"], .wbnf-field input[type="tel"], .wbnf-field input[type="number"], .wbnf-field input[type="date"],
.wbnf-field select, .wbnf-field textarea, .wbnf-field input[type="file"] {
	width: 100%; box-sizing: border-box; min-height: 3.25rem; padding: .75rem 1rem; font: inherit; color: inherit;
	border: 1px solid var(--wbnf-line); border-radius: var(--wbnf-radius); background: var(--wbnf-fill);
}
.wbnf-field textarea { min-height: 8rem; resize: vertical; }
.wbnf-field input:focus, .wbnf-field select:focus, .wbnf-field textarea:focus { outline: 0; border-color: var(--wbnf-accent); background: #fff; box-shadow: 0 0 0 3px rgba(79, 107, 44, .18); }
.wbnf-field.has-error input, .wbnf-field.has-error select, .wbnf-field.has-error textarea { border-color: var(--wbnf-error); }
.wbnf-field.is-valid input:not(:placeholder-shown), .wbnf-field.is-valid textarea:not(:placeholder-shown) { border-color: var(--wbnf-accent); }
.wbnf-error { display: block; margin-top: .25rem; font-size: .8125rem; color: var(--wbnf-error); }
.wbnf-choices { border: 0; margin: 0; padding: 0; }
.wbnf-choices legend { font-weight: 600; font-size: .875rem; margin-bottom: .375rem; padding: 0; }
.wbnf-choice { display: flex !important; align-items: flex-start; gap: .625rem; font-weight: 400 !important; margin-bottom: .375rem !important; cursor: pointer; }
.wbnf-choice input { margin-top: .2rem; accent-color: var(--wbnf-accent); }
/* floating labels: control first, label sits in the field until it is focused or filled */
.wbnf-form--float .wbnf-field--float label { position: absolute; left: 1rem; top: 1.0625rem; margin: 0; max-width: calc(100% - 2rem); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; pointer-events: none; font-weight: 400; font-size: 1rem; color: #6E625A; transform-origin: left top; transition: transform .18s, color .18s; }
.wbnf-form--float .wbnf-field--float input, .wbnf-form--float .wbnf-field--float textarea { padding: 1.45rem 1rem .5rem; }
.wbnf-form--float .wbnf-field--float textarea { padding-top: 1.7rem; }
.wbnf-form--float .wbnf-field--float input:focus ~ label, .wbnf-form--float .wbnf-field--float input:not(:placeholder-shown) ~ label,
.wbnf-form--float .wbnf-field--float textarea:focus ~ label, .wbnf-form--float .wbnf-field--float textarea:not(:placeholder-shown) ~ label { transform: translateY(-.6rem) scale(.78); font-weight: 600; }
.wbnf-actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1.25rem; align-items: center; }
.wbnf-btn { min-height: 3rem; padding: 0 1.5rem; border: 1px solid transparent; border-radius: 62.5rem; font: 700 1rem/1 inherit; cursor: pointer; background: var(--wbnf-accent); color: #fff; }
.wbnf-btn.wbnf-back { background: transparent; color: inherit; border-color: var(--wbnf-line); }
.wbnf-btn[disabled] { opacity: .6; cursor: default; }
.wbnf-btn[hidden] { display: none; }
.wbnf-note { margin: .75rem 0 0; font-weight: 600; }
.wbnf-note.is-success { color: var(--wbnf-accent); }
.wbnf-note.is-error { color: var(--wbnf-error); }
.wbnf-note { transition: opacity .4s ease; }
.wbnf-note.is-fading { opacity: 0; }
.wbnf-note:empty { display: none; }
.wbnf-form.is-done .wbnf-step, .wbnf-form.is-done .wbnf-actions, .wbnf-form.is-done .wbnf-progress { display: none; }