/* =========================================================
   LOCK STATUS
   ---------------------------------------------------------
   Version: 1.4.0
   Status: Production Locked
   Last Audit: 2026-05 (Rich Brand System Upgrade)
   Locked By: Mission43 Core System

   This version is frozen.
   Visual changes require:
   - Token update only
   - CHANGELOG.md entry
   - Version bump
   ========================================================= */

/* =========================================================
   DESIGN SYSTEM GOVERNANCE
   ---------------------------------------------------------
   This file defines the canonical Mission43 form UI system.
   DO NOT:
   - Introduce new colors outside design tokens
   - Hardcode red / gray values outside :root
   - Override token usage inline in components

   All visual changes must flow through:
   - :root design tokens (Section 1)
   - Card system (Section 7A)
   - Input system (Section 4)

   Brand-specific overrides live in:
   - html[data-m43-brand='fieldhouse'] blocks only

   This prevents brand drift across forms.
   ========================================================= */

/* =========================================================
   Mission43 Universal Form Core
   Version: 1.4.0
   Release: Rich Brand System – Mission43 + Fieldhouse
   Hosted via Cloudflare Pages
   ========================================================= */

/* =========================================================
   FONT LOADERS
   ---------------------------------------------------------
   Montserrat: Fieldhouse brand font (the guide's Gotham web substitute — matches the in-house
     e-sign signing form, which also uses Montserrat; corrected from Poppins 2026-07-14).
   Inter: Mission43 web brand font (brand guide approved)
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700;800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&display=swap');

/* =========================================================
   1. DESIGN TOKENS — MISSION43 (DEFAULT)
   ---------------------------------------------------------
   Primary brand source: Mission43 Brand Guide 2025
   PMS 186 red, Inter web font, military precision aesthetic
   ========================================================= */

:root {
  /* --- Primary Brand Colors --- */
  --m43-red: #d71635;          /* PMS 186 — primary brand red */
  --m43-red-dark: #b8102b;     /* hover/pressed — darkens correctly */
  --m43-navy: #062539;         /* secondary navy */
  --m43-blue: #0088c7;         /* secondary blue */
  --m43-warm-gray: #a19890;    /* Warm Gray 4 */
  --m43-charcoal: #373b3a;     /* Cool Gray 11 */

  /* --- Text --- */
  --m43-text-primary: #373b3a;  /* Cool Gray 11 (brand charcoal) */
  --m43-text-muted: #6d675f;    /* warm gray, AA-safe (brand Warm Gray 4 family) */
  --m43-text-on-accent: #ffffff;

  /* --- Surfaces & Fills --- */
  --m43-surface-page: #f5f4f2;        /* subtle warm page bg */
  --m43-surface-card: #ffffff;        /* form card surface */
  --m43-fill: #f8f7f5;               /* input resting fill */
  --m43-fill-focus: #ffffff;          /* input focused */
  --m43-fill-complete: #f2f1ef;       /* input filled/completed */

  /* --- Borders --- */
  --m43-border: rgba(23, 23, 23, 0.2);
  --m43-border-strong: rgba(23, 23, 23, 0.35);

  /* --- Radii --- */
  --m43-radius-input: 10px;
  --m43-radius-button: 8px;
  --m43-radius-card: 14px;
  --m43-radius-section: 10px;
  --m43-radius-pill: 999px;

  /* --- Typography --- */
  --m43-font-body: 'Inter', 'Inter Variable', sans-serif;
  --m43-font-label: 'Inter', 'Inter Variable', sans-serif;

  /* --- Shadows --- */
  --m43-shadow-card: 0 1px 3px rgba(0, 0, 0, 0.06), 0 4px 16px rgba(0, 0, 0, 0.04);
  --m43-shadow-hover: 0 4px 14px rgba(0, 0, 0, 0.08);
  --m43-shadow-input: 0 1px 2px rgba(0, 0, 0, 0.04);

  /* --- Brand Abstraction Layer --- */
  --m43-accent: var(--m43-red);
  --m43-accent-dark: var(--m43-red-dark);
  --m43-accent-rgb: 215, 22, 53;

  /* --- Section Accent (brand left-border on section headers) --- */
  --m43-section-accent: var(--m43-accent);
  --m43-section-text: var(--m43-text-primary);
  --m43-section-bg: transparent;
}

/* =========================================================
   1A. DESIGN TOKENS — FIELDHOUSE OVERRIDE
   ---------------------------------------------------------
   Primary brand source: Idaho Outdoor Fieldhouse Brand Playbook 2021
   Forest green PMS 3435C primary, terracotta PMS 7417C CTA accent,
   Montserrat web font (Gotham substitute), warm parchment surfaces
   ========================================================= */

html[data-m43-brand='fieldhouse'] {
  /* --- Fieldhouse Core Palette --- */
  --m43-forest: #114734;       /* PMS 3435C — primary brand green */
  --m43-terracotta: #e64c38;   /* PMS 7417C — CTA / accent */
  --m43-sage: #5e7361;         /* PMS 5615C — secondary green */
  --m43-steel: #a5bac9;        /* PMS 5435C — blue-gray accent */
  --m43-parchment: #eae6e4;    /* Warm Gray 1C 30% — page bg */
  --m43-warm-gray: #d6d1ca;    /* Warm Gray 1C — borders */
  --m43-charcoal: #414042;     /* Black 90% — text */

  /* --- Fieldhouse Surfaces --- */
  --m43-surface-page: #eae6e4;       /* parchment page background */
  --m43-surface-card: #ffffff;
  --m43-fill: #f5f1ee;               /* warm cream input fill */
  --m43-fill-focus: #fffcfa;
  --m43-fill-complete: #ede9e5;

  /* --- Fieldhouse Borders (green-tinted) --- */
  --m43-border: rgba(17, 71, 52, 0.16);
  --m43-border-strong: rgba(17, 71, 52, 0.3);

  /* --- Fieldhouse Typography --- */
  --m43-font-body: Montserrat, Inter, sans-serif;
  --m43-font-label: Montserrat, Inter, sans-serif;

  /* --- Fieldhouse Radii (slightly rounder — warmer feel) --- */
  --m43-radius-input: 12px;
  --m43-radius-button: 12px;
  --m43-radius-card: 16px;
  --m43-radius-section: 12px;

  /* --- Fieldhouse Brand Abstraction --- */
  --m43-accent: #e64c38;       /* terracotta for CTAs */
  --m43-accent-dark: #c94432;
  --m43-accent-rgb: 230, 76, 56;
  --m43-text-primary: #231f20;
  --m43-text-muted: #5e7361;   /* sage green for muted text */

  /* --- Fieldhouse Section Accent --- */
  --m43-section-accent: var(--m43-forest);
  --m43-section-text: var(--m43-forest);
  --m43-section-bg: rgba(17, 71, 52, 0.04);
}

/* =========================================================
   1B. FIELDHOUSE VISUAL REFINEMENTS
   ---------------------------------------------------------
   Button: rounder, terracotta, strong presence
   Card choices: green-tinted border on hover
   Form container: parchment-aware
   ========================================================= */

html[data-m43-brand='fieldhouse'] .wFormContainer .actions input[type='submit'],
html[data-m43-brand='fieldhouse'] .wFormContainer .wfPagingButtons input {
  border-radius: 12px !important;
  font-weight: 600 !important;
}

html[data-m43-brand='fieldhouse'] .wFormContainer .actions input[type='submit']:hover,
html[data-m43-brand='fieldhouse'] .wFormContainer .wfPagingButtons input:hover {
  background: var(--m43-accent-dark) !important;
}

html[data-m43-brand='fieldhouse'] .wForm .choices .oneChoice label.postField {
  border: 1px solid var(--m43-border) !important;
  box-shadow: 0 1px 4px rgba(17, 71, 52, 0.04);
}

html[data-m43-brand='fieldhouse'] .wForm .choices .oneChoice label.postField:hover {
  border-color: rgba(17, 71, 52, 0.3) !important;
}

/* Page background — both brands */
html[data-m43-brand='mission43'] body {
  background-color: var(--m43-surface-page) !important;
}

html[data-m43-brand='fieldhouse'] body {
  background-color: var(--m43-parchment) !important;
}

/* =========================================================
   2. GLOBAL TYPOGRAPHY NORMALIZATION
   ========================================================= */

html[data-m43-brand='fieldhouse']
  .wFormContainer
  *:not(.htmlContent):not(.htmlContent *) {
  font-family: var(--m43-font-body) !important;
  color: var(--m43-text-primary);
}

html[data-m43-brand='fieldhouse'] body,
html[data-m43-brand='fieldhouse'] .wFormContainer,
html[data-m43-brand='fieldhouse'] .wFormContainer * {
  font-family: var(--m43-font-body) !important;
}

html[data-m43-brand='mission43']
  .wFormContainer
  *:not(.htmlContent):not(.htmlContent *) {
  font-family: var(--m43-font-body) !important;
  color: var(--m43-text-primary);
}

.wForm label.preField {
  font-family: var(--m43-font-label) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  color: var(--m43-text-primary) !important;
  display: block !important;
  margin-bottom: 6px !important;
}

/* =========================================================
   2A. FORM TITLE
   ========================================================= */

.wFormTitle {
  font-family: var(--m43-font-label) !important;
  font-size: 22px !important;
  font-weight: 700 !important;
  color: var(--m43-text-primary) !important;
  letter-spacing: -0.01em !important;
  line-height: 1.2 !important;
  margin-bottom: 24px !important;
  padding-bottom: 16px !important;
  border-bottom: 2px solid var(--m43-accent) !important;
}

html[data-m43-brand='fieldhouse'] .wFormTitle {
  color: var(--m43-forest) !important;
  border-bottom-color: var(--m43-forest) !important;
}

/* =========================================================
   2B. SECTION / PAGE HEADERS (FormAssembly legend elements)
   ---------------------------------------------------------
   Targets fieldset legends and section labels within the form.
   ========================================================= */

.wForm .wfPage > .wfPageTitle,
.wForm .section > legend,
.wForm fieldset > legend,
.wForm .wf-field-group-header {
  font-family: var(--m43-font-label) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
  color: var(--m43-section-text) !important;
  background: var(--m43-section-bg) !important;
  padding: 10px 14px !important;
  margin: 24px 0 16px !important;
  border-left: 3px solid var(--m43-section-accent) !important;
  border-radius: 0 var(--m43-radius-section) var(--m43-radius-section) 0 !important;
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* =========================================================
   2C. FIELD HINTS / HELPER TEXT
   ========================================================= */

.wForm .field-hint,
.wForm .wfHint,
.wForm .hint,
.wForm .field-help-text {
  font-family: var(--m43-font-body) !important;
  font-size: 12.5px !important;
  color: var(--m43-text-muted) !important;
  line-height: 1.45 !important;
  margin-top: 5px !important;
  display: block !important;
}

/* =========================================================
   2D. REQUIRED FIELD INDICATOR
   ---------------------------------------------------------
   Appends a branded asterisk after required field labels.
   ========================================================= */

.wForm .oneField.required label.preField::after {
  content: ' *';
  color: var(--m43-accent);
  font-weight: 700;
  margin-left: 1px;
}

/* =========================================================
   3. LAYOUT NORMALIZATION
   ========================================================= */

.wForm .oneField,
.wForm .inputWrapper {
  width: 100% !important;
  max-width: 100% !important;
}

.wForm .oneField {
  margin-bottom: 22px;
}

/* =========================================================
   3A. FORM CONTAINER CARD
   ---------------------------------------------------------
   Lifts the form off the page background with a subtle card.
   Layout.css handles max-width and centering.
   ========================================================= */

.wFormContainer {
  background: var(--m43-surface-card) !important;
  border-radius: var(--m43-radius-card) !important;
  box-shadow: var(--m43-shadow-card) !important;
  padding: 36px 40px !important;
  box-sizing: border-box !important;
}

@media (max-width: 768px) {
  .wFormContainer {
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 24px 16px !important;
  }
}

/* =========================================================
   4. INPUT SYSTEM
   ========================================================= */

.wForm input[type='text'],
.wForm input[type='email'],
.wForm input[type='tel'],
.wForm input[type='password'],
.wForm textarea,
.wForm select {
  appearance: none !important;
  font-family: var(--m43-font-label) !important;
  background: var(--m43-fill) !important;
  border: 1.5px solid var(--m43-border) !important;
  border-radius: var(--m43-radius-input) !important;
  font-size: 15px !important;
  font-weight: 500 !important;
  color: var(--m43-text-primary) !important;
  padding: 12px 14px !important;
  min-height: 44px !important;
  box-sizing: border-box !important;
  box-shadow: var(--m43-shadow-input) !important;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease !important;
}

/* =========================================================
   4A. HIGH-SPECIFICITY INPUT OVERRIDES
   ---------------------------------------------------------
   FA's theme CSS uses deeply-nested selectors with !important
   that beat the base .wForm selectors above on background,
   border-width, and width. Adding .wFormContainer raises our
   specificity above theirs while keeping the same cascade position.
   ========================================================= */

.wFormContainer .wForm input[type='text'],
.wFormContainer .wForm input[type='email'],
.wFormContainer .wForm input[type='tel'],
.wFormContainer .wForm input[type='password'],
.wFormContainer .wForm textarea,
.wFormContainer .wForm select {
  background-color: var(--m43-fill) !important;
  border: 1.5px solid var(--m43-border) !important;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* All .inputWrapper elements are display:inline-block in FA, so width:100% on inputs
   resolves circularly against the wrapper's own shrink-to-fit size, not the column.
   Making the wrapper a block element lets inputs correctly fill the column width. */
.wFormContainer .wForm .inputWrapper {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Phone: belt-and-suspenders — min-width forces full width even if FA re-asserts
   an absolute px width on the input after IMask initializes. */
.wFormContainer .wForm input.calc-phone,
.wFormContainer .wForm input[class*='calc-phone'] {
  min-width: 100% !important;
}

/* Phone fields standalone in a full-width row look disproportionate — a 10-digit
   number doesn't need full form width. Cap the field container at 50% so it aligns
   visually with one column of the two-column rows above it. */
.wFormContainer .wForm .oneField:has(input.calc-phone),
.wFormContainer .wForm .oneField:has(input[class*='calc-phone']) {
  max-width: 50% !important;
}

/* ---------------------------------------------------------
   B1 (styling audit 2026-07-14): a standalone <select>'s field container
   shrink-wrapped to its short label ("State"), collapsing the select below its own
   placeholder width so it rendered "Please selec…". Let the select's field container
   fill the row like a text field does, so the control can always show its content.
   :not(.wf-acl-hidden):not(.offstate) — out-specifies the .wForm .wf-acl-hidden hide rule
   otherwise; without this guard, `display: block !important` forces a conditionally-hidden
   or honeypot select back onto the page (fixed for the mobile block + inline-group rules
   in 1.6.2, but these base rules were missed — see 1.6.3 changelog entry).
   --------------------------------------------------------- */
.wFormContainer .wForm .oneField:has(select:not([multiple])):not(.wf-acl-hidden):not(.offstate) {
  display: block !important;
  width: 100% !important;
}
/* The field container above expands, but FA leaves the <select> itself inline-block at
   its content width (148px), so it still can't show "Please select…". Force the control
   to fill its now-full-width wrapper. Same wf-acl-hidden/offstate guard as above. */
.wFormContainer .wForm select:not([multiple]):not(.wf-acl-hidden):not(.offstate) {
  display: block !important;
  width: 100% !important;
}

/* ---------------------------------------------------------
   B2 + B3 (styling audit 2026-07-14): mobile fixes.
   B2 — long form titles were clipped at the right edge on narrow screens
        ("Fieldhouse Orientation Application"); wrap and scale down.
   B3 — desktop width caps (phone 50%) and shrink-wrapped standalone fields
        (date, state, ZIP) stayed half-width on mobile, leaving a ragged column while
        text fields went full-width. Force every field container full-width below the
        breakpoint. Higher specificity than the existing .wForm .oneField mobile rule,
        so it also overrides the phone 50% cap above.
   --------------------------------------------------------- */
@media (max-width: 768px) {
  /* Match the base .wFormTitle scope (line ~238) — the title sits outside .wFormContainer,
     so an over-qualified selector would not apply. */
  .wFormTitle {
    font-size: 19px !important;
    line-height: 1.25 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
    word-break: break-word !important;
  }

  /* :not(.wf-acl-hidden):not(.offstate) — this selector out-specifies the
     .wForm .wf-acl-hidden hide rule, and `display: block !important` would force
     FA-hidden fields (honeypots, conditional fields) visible on mobile. */
  .wFormContainer .wForm .oneField:not(.wf-acl-hidden):not(.offstate),
  .wFormContainer .wForm .oneField:has(input.calc-phone):not(.wf-acl-hidden):not(.offstate),
  .wFormContainer .wForm .oneField:has(input[class*='calc-phone']):not(.wf-acl-hidden):not(.offstate),
  .wFormContainer .wForm .oneField:has(select):not(.wf-acl-hidden):not(.offstate) {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
  }
}

/* =========================================================
   4B. COLUMN LAYOUT — EQUAL COLUMNS + GAP
   ---------------------------------------------------------
   FA renders multi-column field groups as table.columnLayout
   with table-layout:auto, which sizes columns independently
   per row based on label text — producing asymmetric widths.
   table-layout:fixed + 100% width forces equal columns.
   Symmetric 8px inner padding creates a 16px inter-column gap
   with identical content widths on both sides.
   Desktop only — FA handles mobile column stacking natively.
   ========================================================= */

@media (min-width: 641px) {
  .wFormContainer .wForm table.columnLayout {
    width: 100% !important;
    table-layout: fixed !important;
  }

  .wFormContainer .wForm table.columnLayout td {
    vertical-align: top !important;
    padding-left: 8px !important;
    padding-right: 8px !important;
    box-sizing: border-box !important;
  }

  .wFormContainer .wForm table.columnLayout td:first-child {
    padding-left: 0 !important;
  }

  .wFormContainer .wForm table.columnLayout td:last-child {
    padding-right: 0 !important;
  }
}

/* =========================================================
   4C. SELECT + MULTI-SELECT + TEXTAREA REFINEMENTS
   ========================================================= */

.wForm select:not([multiple]) {
  padding-right: 40px !important;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23171717' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'><polyline points='6 9 12 15 18 9'/></svg>") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  background-size: 14px !important;
  cursor: pointer !important;
}

.wForm select {
  background-color: var(--m43-fill) !important;
}

.wForm select[multiple] {
  padding: 12px 14px !important;
  min-height: 120px !important;
  font-weight: 500 !important;
  appearance: none !important;
  background-color: var(--m43-fill) !important;
}

.wForm select[multiple] option:checked {
  background-color: rgba(var(--m43-accent-rgb), 0.08) !important;
  color: var(--m43-text-primary) !important;
}

.wForm select[multiple].m43-has-value {
  border-color: var(--m43-border-strong) !important;
}

.wForm textarea {
  min-height: 120px !important;
  resize: vertical !important;
  background-color: var(--m43-fill) !important;
}

/* --- Focus State --- */
.wForm input:focus,
.wForm textarea:focus,
.wForm select:focus {
  outline: none !important;
  background: var(--m43-fill-focus) !important;
  border-color: var(--m43-accent) !important;
  box-shadow:
    0 0 0 3px rgba(var(--m43-accent-rgb), 0.14),
    var(--m43-shadow-input) !important;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease !important;
}

/* --- Completed Field State --- */
.wForm input.m43-has-value,
.wForm textarea.m43-has-value,
.wForm select.m43-has-value {
  background: var(--m43-fill-complete) !important;
  border-color: var(--m43-border-strong) !important;
  transition: background 0.15s ease, border-color 0.15s ease !important;
}

/* =========================================================
   4D. READ-ONLY PREFILL PRESENTATION
   ---------------------------------------------------------
   For FormAssembly fields tagged with variable/class
   readOnlyPrefillField. The submitted field remains present,
   while the visible value reads as generated waiver/body text.
   ========================================================= */

.wForm .oneField.m43-readonly-prefill-field {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wForm .oneField.m43-readonly-prefill-field .inputWrapper {
  display: inline !important;
  width: auto !important;
  max-width: none !important;
}

.wForm input.calc-readOnlyPrefillField,
.wForm textarea.calc-readOnlyPrefillField,
.wForm input[class*='readOnlyPrefillField'],
.wForm textarea[class*='readOnlyPrefillField'],
.wForm input[name*='readOnlyPrefillField'],
.wForm textarea[name*='readOnlyPrefillField'],
.wForm input[id*='readOnlyPrefillField'],
.wForm textarea[id*='readOnlyPrefillField'] {
  appearance: none !important;
  display: inline !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  color: inherit !important;
  font: inherit !important;
  font-weight: 700 !important;
  line-height: inherit !important;
  outline: 0 !important;
}

.wForm input.m43-readonly-prefill-source,
.wForm textarea.m43-readonly-prefill-source {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  min-height: 0 !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  clip-path: inset(50%) !important;
  overflow: hidden !important;
  white-space: nowrap !important;
  background: transparent !important;
  box-shadow: none !important;
}

.wForm .m43-readonly-prefill-display {
  display: inline !important;
  font: inherit !important;
  font-weight: 700 !important;
  color: inherit !important;
  line-height: inherit !important;
  white-space: normal !important;
}

/* =========================================================
   4E. AUTOFILL NORMALIZATION (Chrome / Safari)
   Removes browser blue autofill and keeps brand fill
   ========================================================= */

.wForm input:-webkit-autofill,
.wForm input:-webkit-autofill:hover,
.wForm input:-webkit-autofill:focus,
.wForm textarea:-webkit-autofill,
.wForm select:-webkit-autofill {
  -webkit-box-shadow: 0 0 0 1000px var(--m43-fill) inset !important;
  box-shadow: 0 0 0 1000px var(--m43-fill) inset !important;
  -webkit-text-fill-color: var(--m43-text-primary) !important;
  border: 1.5px solid var(--m43-border) !important;
  transition: background-color 5000s ease-in-out 0s !important;
}

.wForm input:-webkit-autofill:focus {
  border-color: var(--m43-accent) !important;
  box-shadow:
    0 0 0 3px rgba(var(--m43-accent-rgb), 0.14),
    0 0 0 1000px var(--m43-fill) inset !important;
}

/* =========================================================
   5. BUTTONS — SUBMIT / PAGING
   ========================================================= */

/* Allow FormAssembly conditional rules to hide buttons */
.wFormContainer .actions input[type='submit'],
.wFormContainer .wfPagingButtons input {
  display: inline-flex;
  align-items: center !important;
  justify-content: center !important;
  background: var(--m43-accent) !important;
  color: var(--m43-text-on-accent) !important;
  border-radius: var(--m43-radius-button) !important;
  height: 44px !important;
  padding: 0 28px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  line-height: 1em !important;
  border: none !important;
  box-shadow: 0 2px 8px rgba(var(--m43-accent-rgb), 0.28) !important;
  transition:
    background 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.1s ease !important;
  cursor: pointer !important;
}

.wFormContainer .actions input[type='submit']:hover,
.wFormContainer .wfPagingButtons input:hover {
  background: var(--m43-accent-dark) !important;
  box-shadow: 0 4px 14px rgba(var(--m43-accent-rgb), 0.32) !important;
  transform: translateY(-1px) !important;
}

.wFormContainer .actions input[type='submit']:active,
.wFormContainer .wfPagingButtons input:active {
  transform: translateY(0) !important;
  box-shadow: 0 1px 4px rgba(var(--m43-accent-rgb), 0.2) !important;
}

/* =========================================================
   5A. CONDITIONAL VISIBILITY SAFETY
   ---------------------------------------------------------
   Ensures FormAssembly native conditional rules can hide
   submit / paging buttons even when core styling applies.
   ========================================================= */

.wForm .offstate,
.wForm .wf-acl-hidden {
  display: none !important;
}

.wFormContainer .actions[style*='display:none'] input[type='submit'],
.wFormContainer .actions[style*='display: none'] input[type='submit'],
.wFormContainer .actions[style*='visibility:hidden'] input[type='submit'],
.wFormContainer .actions[style*='visibility: hidden'] input[type='submit'] {
  display: none !important;
}

.wFormContainer .actions input[type='submit'][style*='display:none'],
.wFormContainer .actions input[type='submit'][style*='display: none'] {
  display: none !important;
}

/* =========================================================
   5B. FA NATIVE PROGRESS BAR
   ---------------------------------------------------------
   Styles FormAssembly's built-in progress bar element.
   Activated per-form via the FA form builder Progress Bar toggle.
   ========================================================= */

.wfProgressBarContainer,
.wfProgressBar__container {
  margin-bottom: 28px !important;
}

.wfProgressBar,
.wfProgressBar__bar {
  background: var(--m43-border) !important;
  border-radius: var(--m43-radius-pill) !important;
  height: 5px !important;
  overflow: hidden !important;
  box-shadow: none !important;
}

.wfProgressBar > div,
.wfProgressBar__fill,
.wfProgressBar__progress {
  background: var(--m43-accent) !important;
  height: 100% !important;
  border-radius: var(--m43-radius-pill) !important;
  transition: width 0.4s ease !important;
}

/* Progress percentage text */
.wfProgressBar__label,
.wfProgressBarText {
  font-family: var(--m43-font-label) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--m43-text-muted) !important;
  text-align: right !important;
  margin-bottom: 6px !important;
}

/* =========================================================
   5C. FA NATIVE PAGE NAVIGATION BAR
   ---------------------------------------------------------
   Styles FormAssembly's multi-page navigation tabs.
   ========================================================= */

.wfPageNavigation {
  display: flex !important;
  gap: 4px !important;
  margin-bottom: 28px !important;
  border-bottom: 2px solid var(--m43-border) !important;
  padding-bottom: 0 !important;
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch !important;
}

.wfPageNavigation a,
.wfPageNavigation span {
  font-family: var(--m43-font-label) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
  color: var(--m43-text-muted) !important;
  padding: 8px 14px !important;
  border-bottom: 2px solid transparent !important;
  margin-bottom: -2px !important;
  white-space: nowrap !important;
  text-decoration: none !important;
  transition: color 0.15s ease, border-color 0.15s ease !important;
}

.wfPageNavigation .wfCurrentPage,
.wfPageNavigation .wfCurrentPage a {
  color: var(--m43-accent) !important;
  border-bottom-color: var(--m43-accent) !important;
}

/* =========================================================
   6. ERROR SYSTEM
   Subtle, modern, soft-background UI
   ========================================================= */

/* --- 6A. Summary Block --- */

.m43-error-summary {
  margin-bottom: 20px;
  padding: 16px 18px;
  background: rgba(var(--m43-accent-rgb), 0.06);
  border-left: 3px solid var(--m43-accent);
  border-radius: 0 12px 12px 0;
  font-size: 14px;
  line-height: 1.6;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
  animation: m43FadeIn 0.18s ease-out;
  scroll-margin-top: 32px;
  transition:
    opacity 0.18s ease,
    transform 0.18s ease;
}

.m43-error-summary.m43-summary-resolving {
  opacity: 0;
  transform: translateY(-4px);
}

.m43-error-summary strong {
  font-weight: 600;
  font-size: 15px;
  display: block;
  margin-bottom: 8px;
}

.m43-error-summary ul {
  margin: 0;
  padding-left: 18px;
}

.m43-error-summary li {
  margin-bottom: 6px;
}

/* --- 6A.1 Summary Enhancements --- */

.m43-error-summary-heading {
  font-weight: 700;
  font-size: 14px;
  margin-bottom: 10px;
  color: var(--m43-accent);
  display: flex;
  align-items: center;
  gap: 8px;
}

.m43-error-summary-heading::before {
  content: '⚠';
  font-size: 14px;
}

.m43-error-summary a {
  color: var(--m43-accent);
  text-decoration: underline;
  font-weight: 500;
}

.m43-error-summary a:hover {
  text-decoration: none;
}

/* --- 6B. Inline Field Error --- */

.m43-inline-error {
  margin-top: 6px;
  font-size: 12.5px;
  font-weight: 600;
  color: var(--m43-accent);
  line-height: 1.45;
  letter-spacing: 0;
  display: flex;
  align-items: flex-start;
  gap: 6px;
}

.m43-inline-error::before {
  content: '⚠';
  font-size: 11px;
  line-height: 1.3;
  margin-top: 1px;
  opacity: 0.9;
}

/* --- 6C. Field Error State --- */

.wForm input.m43-field-error,
.wForm textarea.m43-field-error,
.wForm select.m43-field-error {
  border-color: var(--m43-accent) !important;
  box-shadow:
    0 0 0 3px rgba(var(--m43-accent-rgb), 0.12),
    var(--m43-shadow-input) !important;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease !important;
}

/* --- 6D. Field Container Error Highlight --- */

.wForm .oneField.m43-field-container-error {
  background: rgba(var(--m43-accent-rgb), 0.04);
  border-left: 3px solid var(--m43-accent);
  border-radius: 0 var(--m43-radius-section) var(--m43-radius-section) 0;
  padding: 8px 12px 12px 12px;
  transition:
    background 0.15s ease,
    border-color 0.15s ease;
}

/* --- 6E. Shake on first invalid submit --- */

@keyframes m43SubtleShake {
  0%   { transform: translateX(0); }
  20%  { transform: translateX(-3px); }
  40%  { transform: translateX(3px); }
  60%  { transform: translateX(-2px); }
  80%  { transform: translateX(2px); }
  100% { transform: translateX(0); }
}

@keyframes m43FadeIn {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}

.wForm .oneField.m43-shake {
  animation: m43SubtleShake 0.28s ease;
}

/* =========================================================
   7. CHOICES ALIGNMENT (Checkbox / Radio)
   ========================================================= */

.wForm .choices .oneChoice {
  display: flex !important;
  align-items: flex-start !important;
  gap: 10px !important;
  margin-bottom: 10px !important;
}

/* =========================================================
   7A. CARD-STYLE CHECKBOX / RADIO SYSTEM
   ========================================================= */

.wForm input[type='checkbox'],
.wForm input[type='radio'] {
  position: absolute !important;
  opacity: 0 !important;
  pointer-events: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* FormAssembly Likert/matrix fields use native radio inputs — restore them */
.wForm table.matrixLayout,
.wForm .matrixLayout {
  width: 100% !important;
  margin: 14px 0 24px !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  color: var(--m43-text-primary) !important;
  font-family: var(--m43-font-body) !important;
  table-layout: fixed !important;
}

.wForm table.matrixLayout thead th,
.wForm .matrixLayout thead th {
  background: #ffffff !important;
  border-bottom: 2px solid rgba(var(--m43-accent-rgb), 0.15) !important;
  color: var(--m43-text-muted) !important;
  font-family: var(--m43-font-label) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.2 !important;
  padding: 10px 8px !important;
  text-align: center !important;
}

.wForm table.matrixLayout thead th:first-child,
.wForm .matrixLayout thead th:first-child {
  width: 60% !important;
  background: transparent !important;
  border-bottom-color: transparent !important;
}

.wForm table.matrixLayout thead th:not(:first-child),
.wForm .matrixLayout thead th:not(:first-child) {
  width: 8% !important;
}

.wForm table.matrixLayout tbody tr,
.wForm .matrixLayout tbody tr {
  border-bottom: 1px solid rgba(var(--m43-accent-rgb), 0.08) !important;
  transition: background 0.12s ease !important;
}

.wForm table.matrixLayout tbody tr:last-child,
.wForm .matrixLayout tbody tr:last-child {
  border-bottom: 0 !important;
}

.wForm table.matrixLayout tbody th.headerCol,
.wForm .matrixLayout tbody th.headerCol {
  background: transparent !important;
  color: var(--m43-text-primary) !important;
  font-family: var(--m43-font-label) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 1.4 !important;
  padding: 14px 12px 14px 0 !important;
  text-align: left !important;
  vertical-align: middle !important;
  width: 60% !important;
  overflow-wrap: anywhere !important;
}

.wForm table.matrixLayout tbody th.headerCol label,
.wForm .matrixLayout tbody th.headerCol label {
  color: inherit !important;
  font: inherit !important;
}

.wForm table.matrixLayout tbody td,
.wForm .matrixLayout tbody td {
  background: transparent !important;
  padding: 10px 4px !important;
  width: 8% !important;
}

.wForm table.matrixLayout tbody tr:hover td,
.wForm .matrixLayout tbody tr:hover td {
  background: rgba(var(--m43-accent-rgb), 0.03) !important;
}

.wForm table.matrixLayout input[type='radio'],
.wForm .matrixLayout input[type='radio'] {
  position: static !important;
  opacity: 1 !important;
  pointer-events: auto !important;
  width: 18px !important;
  height: 18px !important;
  min-height: 18px !important;
  margin: 0 auto !important;
  padding: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  accent-color: var(--m43-accent) !important;
  background: #ffffff !important;
  border: 1.5px solid var(--m43-border) !important;
  border-radius: 50% !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition:
    background-color 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease !important;
}

.wForm table.matrixLayout input[type='radio']:checked,
.wForm .matrixLayout input[type='radio']:checked {
  background:
    radial-gradient(circle, #ffffff 0 33%, var(--m43-accent) 36% 100%) !important;
  border-color: var(--m43-accent) !important;
}

.wForm table.matrixLayout input[type='radio']:focus-visible,
.wForm .matrixLayout input[type='radio']:focus-visible {
  outline: 3px solid rgba(var(--m43-accent-rgb), 0.22) !important;
  outline-offset: 3px !important;
}

.wForm table.matrixLayout td,
.wForm .matrixLayout td {
  text-align: center !important;
  vertical-align: middle !important;
}

.wForm table.matrixLayout .oneChoice,
.wForm .matrixLayout .oneChoice {
  display: inline-flex !important;
  justify-content: center !important;
  align-items: center !important;
  margin-bottom: 0 !important;
}

/* --- Likert Mobile Stacked Layout --- */
@media (max-width: 768px) {
  .wForm table.matrixLayout,
  .wForm .matrixLayout,
  .wForm table.matrixLayout thead,
  .wForm .matrixLayout thead,
  .wForm table.matrixLayout tbody,
  .wForm .matrixLayout tbody,
  .wForm table.matrixLayout tr,
  .wForm .matrixLayout tr,
  .wForm table.matrixLayout th,
  .wForm .matrixLayout th,
  .wForm table.matrixLayout td,
  .wForm .matrixLayout td {
    display: block !important;
    width: 100% !important;
  }

  .wForm table.matrixLayout thead,
  .wForm .matrixLayout thead {
    display: none !important;
  }

  .wForm table.matrixLayout tbody tr,
  .wForm .matrixLayout tbody tr {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 6px !important;
    padding: 14px 0 16px !important;
    border-bottom: 1px solid rgba(var(--m43-accent-rgb), 0.12) !important;
  }

  .wForm table.matrixLayout tbody th.headerCol,
  .wForm .matrixLayout tbody th.headerCol {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 0 8px !important;
    font-size: 15px !important;
    line-height: 1.35 !important;
  }

  .wForm table.matrixLayout tbody th.headerCol label,
  .wForm .matrixLayout tbody th.headerCol label {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
    overflow-wrap: anywhere !important;
  }

  .wForm table.matrixLayout tbody td,
  .wForm .matrixLayout tbody td {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 4px !important;
    width: auto !important;
    min-width: 0 !important;
    min-height: 52px !important;
    box-sizing: border-box !important;
    padding: 8px 4px !important;
    border: 1.5px solid rgba(var(--m43-accent-rgb), 0.14) !important;
    border-radius: 8px !important;
    transition: background 0.12s ease, border-color 0.12s ease !important;
  }

  /* Highlight selected option cell on mobile */
  .wForm table.matrixLayout tbody td:has(input[type='radio']:checked),
  .wForm .matrixLayout tbody td:has(input[type='radio']:checked) {
    background: rgba(var(--m43-accent-rgb), 0.06) !important;
    border-color: var(--m43-accent) !important;
  }

  /* Numeric labels injected via ::before — supports up to 7-point scales */
  .wForm table.matrixLayout tbody td::before,
  .wForm .matrixLayout tbody td::before {
    color: var(--m43-text-muted) !important;
    font-size: 11px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
  }

  .wForm table.matrixLayout tbody td:nth-of-type(1)::before,
  .wForm .matrixLayout tbody td:nth-of-type(1)::before { content: '1' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(2)::before,
  .wForm .matrixLayout tbody td:nth-of-type(2)::before { content: '2' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(3)::before,
  .wForm .matrixLayout tbody td:nth-of-type(3)::before { content: '3' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(4)::before,
  .wForm .matrixLayout tbody td:nth-of-type(4)::before { content: '4' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(5)::before,
  .wForm .matrixLayout tbody td:nth-of-type(5)::before { content: '5' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(6)::before,
  .wForm .matrixLayout tbody td:nth-of-type(6)::before { content: '6' !important; }
  .wForm table.matrixLayout tbody td:nth-of-type(7)::before,
  .wForm .matrixLayout tbody td:nth-of-type(7)::before { content: '7' !important; }
}

/* --- Card-Style Choice Labels --- */
.wForm .choices .oneChoice label.postField {
  display: flex !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  padding: 14px 16px !important;
  background: var(--m43-surface-card) !important;
  border-radius: 10px !important;
  border: 1.5px solid var(--m43-border) !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  color: var(--m43-text-primary) !important;
  cursor: pointer !important;
  transition:
    background 0.15s ease,
    border-color 0.15s ease,
    box-shadow 0.15s ease,
    transform 0.12s ease !important;
  box-sizing: border-box !important;
}

/* Neutralize FormAssembly faux checkbox rendering */
.wForm .choices .oneChoice label.postField .input-checkbox-faux::before,
.wForm .choices .oneChoice label.postField .input-checkbox-faux::after {
  content: none !important;
}

.wForm .choices .oneChoice label.postField .input-checkbox-faux {
  box-shadow: none !important;
  background-image: none !important;
}

/* Faux checkbox */
.wForm .choices .oneChoice label.postField .input-checkbox-faux {
  width: 18px !important;
  height: 18px !important;
  border-radius: 4px !important;
  border: 1.5px solid var(--m43-border) !important;
  background: #ffffff !important;
  flex-shrink: 0 !important;
  position: relative !important;
  transition: background 0.12s ease, border-color 0.12s ease !important;
}

/* Faux radio */
.wForm .choices .oneChoice label.postField .input-radio-faux {
  width: 18px !important;
  height: 18px !important;
  border-radius: 50% !important;
  border: 1.5px solid var(--m43-border) !important;
  background: #ffffff !important;
  flex-shrink: 0 !important;
  position: relative !important;
  box-shadow: none !important;
  background-image: none !important;
  transition: background 0.12s ease, border-color 0.12s ease !important;
}

.wForm .choices .oneChoice input[type='radio']:checked + label.postField .input-radio-faux {
  background: var(--m43-accent) !important;
  border-color: var(--m43-accent) !important;
}

.wForm .choices .oneChoice input[type='radio']:checked + label.postField .input-radio-faux::after {
  content: '' !important;
  position: absolute !important;
  width: 8px !important;
  height: 8px !important;
  background: #ffffff !important;
  border-radius: 50% !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
}

.wForm .choices .oneChoice input:checked + label.postField {
  background: rgba(var(--m43-accent-rgb), 0.06) !important;
  border-color: var(--m43-accent) !important;
  box-shadow: 0 0 0 1px var(--m43-accent) !important;
}

.wForm .choices .oneChoice input:focus-visible + label.postField,
.wForm .choices .oneChoice input:focus + label.postField {
  border-color: var(--m43-accent) !important;
  box-shadow: 0 0 0 3px rgba(var(--m43-accent-rgb), 0.14) !important;
}

/* Checked checkbox indicator */
.wForm .choices .oneChoice input:checked + label.postField .input-checkbox-faux {
  background: var(--m43-accent) !important;
  border-color: var(--m43-accent) !important;
}

.wForm .choices .oneChoice input:checked + label.postField .input-checkbox-faux::after {
  content: '' !important;
  position: absolute !important;
  left: 4px !important;
  top: 1px !important;
  width: 5px !important;
  height: 10px !important;
  border: solid #ffffff !important;
  border-width: 0 2px 2px 0 !important;
  transform: rotate(45deg) !important;
}

@media (min-width: 769px) {
  .wForm .choices .oneChoice label.postField:hover {
    border-color: var(--m43-border-strong) !important;
    box-shadow: var(--m43-shadow-hover) !important;
    transform: translateY(-1px) !important;
  }
}

/* Hard reset — kill FormAssembly pseudo controls */
.wForm .choices .oneChoice::before,
.wForm .choices .oneChoice::after,
.wForm .choices .oneChoice label.postField::before,
.wForm .choices .oneChoice label.postField::after {
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* =========================================================
   8. GUEST REPEATER GRID FIX (UNIVERSAL)
   ========================================================= */

@media (min-width: 768px) {
  .wForm .removeable.section.inline.group:not(.wf-acl-hidden):not(.offstate) {
    display: grid !important;
    grid-template-columns: 1fr 1fr;
    column-gap: 32px;
    align-items: start;
  }

  .wForm .removeable.section.inline.group > .oneField:nth-of-type(1) {
    grid-column: 1;
  }

  .wForm .removeable.section.inline.group > .oneField:nth-of-type(2) {
    grid-column: 2;
  }
}

/* =========================================================
   9. MOBILE OPTIMIZATION
   ========================================================= */

@media (max-width: 768px) {
  /* Table column layout override */
  .wForm table.columnLayout,
  .wForm table.columnLayout tbody,
  .wForm table.columnLayout tr {
    display: block !important;
    width: 100% !important;
  }

  .wForm table.columnLayout td {
    display: block !important;
    width: 100% !important;
    padding-right: 0 !important;
  }

  .wFormContainer .actions input[type='submit'],
  .wFormContainer .wfPagingButtons input {
    width: 100% !important;
  }

  .wForm .oneField {
    margin-bottom: 18px;
  }

  /* Force inline grouped fields to stack.
     :not(.wf-acl-hidden):not(.offstate) — these selectors out-specify the
     .wForm .wf-acl-hidden hide rule, so an unguarded `display: block !important`
     would force FA-hidden elements visible on mobile. */
  .wForm .section.inline:not(.wf-acl-hidden):not(.offstate),
  .wForm .inline.group:not(.wf-acl-hidden):not(.offstate),
  .wForm .oneField.inline:not(.wf-acl-hidden):not(.offstate) {
    display: block !important;
    width: 100% !important;
  }

  .wForm .section.inline .oneField:not(.wf-acl-hidden):not(.offstate) {
    display: block !important;
    width: 100% !important;
  }

  .wForm .section.inline .oneField,
  .wForm .inline.group .oneField {
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Universal stacking safety */
  .wForm .section:not(.offstate):not(.wf-acl-hidden),
  .wForm .section.group:not(.offstate):not(.wf-acl-hidden),
  .wForm .section.inline.group:not(.offstate):not(.wf-acl-hidden),
  .wForm .removeable.section.inline.group:not(.offstate):not(.wf-acl-hidden) {
    display: block !important;
    grid-template-columns: 1fr !important;
  }

  .wForm .offstate,
  .wForm .wf-acl-hidden {
    display: none !important;
  }

  .wForm .oneField.inline:not(.wf-acl-hidden):not(.offstate),
  .wForm .inline .oneField:not(.wf-acl-hidden):not(.offstate),
  .wForm .section.inline .oneField:not(.wf-acl-hidden):not(.offstate) {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  .wForm .oneField {
    float: none !important;
  }

  .wForm .section,
  .wForm .section.group,
  .wForm .section.inline {
    width: 100% !important;
  }

  .wForm .oneField {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
  }

  .wForm .oneField .inputWrapper {
    width: 100% !important;
  }

  /* Lighter error border on mobile */
  .wForm .oneField.m43-field-container-error {
    border-left-width: 2px;
  }

  .m43-error-summary {
    margin-bottom: 18px;
    padding: 14px 14px;
  }

  .wForm .oneField.m43-field-container-error {
    padding: 8px 10px 10px 10px;
  }

  .m43-inline-error {
    font-size: 12px;
  }

  /* Better tap targets for choice cards */
  .wForm .choices .oneChoice label.postField {
    padding: 16px 18px !important;
  }

  /* Section headers tighter on mobile */
  .wForm .wfPage > .wfPageTitle,
  .wForm .section > legend,
  .wForm fieldset > legend {
    font-size: 10px !important;
    padding: 8px 12px !important;
    margin: 18px 0 12px !important;
  }
}

/* =========================================================
   10. ACCESSIBILITY — Reduced Motion Support
   ========================================================= */

@media (prefers-reduced-motion: reduce) {
  .wForm .oneField.m43-shake {
    animation: none !important;
  }

  .m43-error-summary,
  .wForm input,
  .wForm textarea,
  .wForm select,
  .wForm .choices .oneChoice label.postField,
  .wFormContainer .actions input[type='submit'],
  .wFormContainer .wfPagingButtons input {
    transition: none !important;
    transform: none !important;
    animation: none !important;
  }
}