/* ==========================================================================
   WPForms inside the ported form wrappers
   --------------------------------------------------------------------------
   Each page wraps its WPForms shortcode in the source form's class
   (<div class="miniform"> or <div class="formcard">) and every field carries
   the source field class (minifield / row), so the page's OWN form CSS does
   the styling. WPForms' stylesheet is off (WPForms > Settings > Include Form
   Styling = No styling). This file only covers what WPForms markup adds or
   changes relative to the source markup.
   ========================================================================== */

/* WPForms wraps the fields and the button in its own containers. */
.miniform .wpforms-container,
.formcard .wpforms-container,
.miniform .wpforms-form,
.formcard .wpforms-form { margin: 0; }

/* The source marks nothing as required visually. */
.miniform .wpforms-required-label,
.formcard .wpforms-required-label { display: none; }

/* --------------------------------------------------------------------------
   .miniform grid (form class mac-grid - the case-study form)
   The source puts fields in <div class="minirow"> groups of three
   (grid auto-fit, minmax(210px,1fr), gap 16px; each field margin-bottom 16px)
   followed by a full-width .minifield.wide. WPForms outputs one flat list,
   so the flat list becomes one grid:
     - at most 3 columns (a source row never holds more than 3 fields)
     - the wide field spans the row and sits closer: between groups the
       source has no grid gap, only the 16px field margin, so it is pulled up
       by the gap (mac-group)
   -------------------------------------------------------------------------- */
.miniform .mac-grid .wpforms-field-container {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(max(210px, calc((100% - 32px) / 3)), 1fr));
	gap: 16px;
}
.miniform .mac-grid .wpforms-field.wide { grid-column: 1 / -1; }
.miniform .mac-grid .wpforms-field.wide.mac-group { margin-top: -16px; }

/* --------------------------------------------------------------------------
   .miniform without mac-grid (the two contact forms)
   The source contact page has no .miniform / .minirow / .minifield-label /
   .minifield-input CSS at all, so its fields render as plain blocks with the
   label inline before the input. Ported as-is (client decision pending).
     - the source has a space between </label> and <input>; WPForms does not,
       except where the hidden required "*" span leaves one
     - .miniform .minirow+.minirow { margin-top: 2px } -> mac-plus2
   -------------------------------------------------------------------------- */
.miniform form:not(.mac-grid) .wpforms-field-label:not(:has(.wpforms-required-label))::after { content: " "; }
.miniform form:not(.mac-grid) .wpforms-field.mac-plus2 { margin-top: 2px; }

/* The source button sits straight after the fields. */
.miniform .wpforms-submit-container { margin: 0; }

/* .formcard: the source button is inside a <p>. */
.formcard .wpforms-submit-container { margin: 0 0 18px; max-width: 72ch; }

/* The submit spinner WPForms shows while sending. */
.miniform .wpforms-submit-spinner,
.formcard .wpforms-submit-spinner { margin-left: 10px; vertical-align: middle; }

/* --------------------------------------------------------------------------
   Messages - same look as the source script's .formstatus boxes.
   -------------------------------------------------------------------------- */
.miniform label.wpforms-error,
.formcard label.wpforms-error,
.miniform em.wpforms-error,
.formcard em.wpforms-error {
	display: block;
	margin: 6px 0 0;
	font-family: var(--sans);
	font-size: 15px;
	font-weight: 600;
	font-style: normal;
	letter-spacing: 0;
	color: #6E5008;
}
.miniform .wpforms-field input.wpforms-error,
.miniform .wpforms-field select.wpforms-error,
.miniform .wpforms-field textarea.wpforms-error,
.formcard .wpforms-field input.wpforms-error,
.formcard .wpforms-field textarea.wpforms-error { border-color: var(--gold); }

.miniform .wpforms-error-container,
.formcard .wpforms-error-container {
	margin-top: 18px;
	padding: 16px 20px;
	border-radius: 8px;
	font-family: var(--sans);
	font-size: 17px;
	line-height: 1.55;
	background: #FBF2DE;
	border: 1px solid var(--gold);
	color: #6E5008;
}

.miniform .wpforms-confirmation-container-full,
.formcard .wpforms-confirmation-container-full {
	margin-top: 18px;
	padding: 16px 20px;
	border-radius: 8px;
	font-family: var(--sans);
	font-size: 17px;
	line-height: 1.55;
	background: #E8F3E8;
	border: 1px solid #9CC49C;
	color: #255025;
}
.miniform .wpforms-confirmation-container-full p,
.formcard .wpforms-confirmation-container-full p { margin: 0; max-width: none; font: inherit; color: inherit; border: 0; padding: 0; }

/* The source contact textareas carry rows="4"; WPForms outputs no rows attribute.
   4 lines at the page's textarea line-height (1.55) plus its padding and border. */
.miniform form:not(.mac-grid) textarea { height: calc(4 * 1.55em + 24px); }

/* ── WPForms utility classes that its own stylesheet carries.
      We load WPForms with styling turned off (wpforms-no-styles.css), and that
      sheet defines only field/layout rules - not these. Without them the
      elements WPForms marks as hidden are rendered as ordinary text, e.g. the
      screen-reader line "Submit button is disabled during form submission."
      appeared on screen on every form while it was submitting.
      Copied verbatim from the plugin's modern/wpforms-base.css so the forms
      behave exactly as the plugin intends. ── */
.wpforms-hidden { display:none !important }
.wpforms-field-hidden { display:none;padding:0 }
.wpforms-screen-reader-element {
 position:absolute !important;clip:rect(0, 0, 0, 0);height:1px;width:1px;
 border:0;overflow:hidden;word-wrap:normal !important
}
