/* =====================================================
   Future Minds Consulting — Forminator theme
   wfm.tonalli.ro

   Restyles Forminator forms to match the coaches grid and the education
   testimonials. Same tokens, taken from the site's Divi global colors:
     --fmc-fm-primary   #E25F70  coral
     --fmc-fm-secondary #FBB79E  peach
     --fmc-fm-tan       #FAD5A6  warm tan
     --fmc-fm-heading   #4C384A  plum
     --fmc-fm-muted     #866768  mauve

   WHY SO MANY !important
   ----------------------
   Forminator's own stylesheet runs at 4-class specificity
   (.forminator-ui.forminator-custom-form.forminator-design--default
    .forminator-input), and on top of that it GENERATES a per-form <style>
   block from each form's Appearance tab at render time — which can land after
   this file in the cascade. !important on the colour/border/font properties is
   what makes this theme win in both cases, regardless of load order and
   without having to know the form ID.

   Layout properties (padding, display, flex) are left alone wherever possible
   so Forminator's own responsive grid keeps working.

   Set the form's Appearance -> Style to "Default" for the cleanest result.
   ===================================================== */

.forminator-ui.forminator-custom-form {
	--fmc-fm-primary: #e25f70;
	--fmc-fm-primary-dark: #c94a5b;
	--fmc-fm-secondary: #fbb79e;
	--fmc-fm-tan: #fad5a6;
	--fmc-fm-heading: #4c384a;
	--fmc-fm-muted: #866768;
	--fmc-fm-body: rgba(0, 0, 0, 0.78);
	--fmc-fm-white: #ffffff;
	--fmc-fm-surface: #ffffff;
	--fmc-fm-field-bg: #fdfaf8;
	--fmc-fm-hairline: rgba(134, 103, 104, 0.28);

	/* Error red is deliberately NOT the brand coral — coral is the submit
	   button and every accent, so reusing it for errors reads as decoration
	   rather than a warning. */
	--fmc-fm-error: #b3261e;
	--fmc-fm-success: #2e7d5b;

	--fmc-fm-font-heading: var(--et_global_heading_font, inherit);
	--fmc-fm-font-body: var(--et_global_body_font, inherit);

	--fmc-fm-radius: 12px;
	--fmc-fm-radius-lg: 18px;

	font-family: var(--fmc-fm-font-body) !important;
	color: var(--fmc-fm-body);
}

/* =====================================================
   FORM TITLE / SUBTITLE
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-title {
	font-family: var(--fmc-fm-font-heading) !important;
	font-size: 26px !important;
	font-weight: 700 !important;
	line-height: 1.25 !important;
	color: var(--fmc-fm-heading) !important;
	text-wrap: balance;
}

.forminator-ui.forminator-custom-form .forminator-subtitle {
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 15px !important;
	line-height: 1.6 !important;
	color: var(--fmc-fm-muted) !important;
}

/* =====================================================
   LABELS, DESCRIPTIONS
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-label {
	margin: 0 0 7px !important;
	font-family: var(--fmc-fm-font-heading) !important;
	font-size: 12.5px !important;
	font-weight: 700 !important;
	letter-spacing: 0.06em !important;
	line-height: 1.5 !important;
	text-transform: uppercase !important;
	color: var(--fmc-fm-heading) !important;
}

/* Forminator marks required fields with a span inside the label; it ships no
   styles for it, so this is additive and harmless if the span isn't there. */
.forminator-ui.forminator-custom-form .forminator-required,
.forminator-ui.forminator-custom-form .forminator-label .forminator-required {
	color: var(--fmc-fm-primary) !important;
	font-weight: 700;
}

.forminator-ui.forminator-custom-form .forminator-description {
	margin-top: 6px !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 12.5px !important;
	font-weight: 400 !important;
	line-height: 1.55 !important;
	color: var(--fmc-fm-muted) !important;
}

/* =====================================================
   TEXT INPUTS, TEXTAREA, SELECT
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-input,
.forminator-ui.forminator-custom-form .forminator-textarea {
	padding: 13px 16px !important;
	background-color: var(--fmc-fm-field-bg) !important;
	border: 1px solid var(--fmc-fm-hairline) !important;
	border-radius: var(--fmc-fm-radius) !important;
	box-shadow: none !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 15px !important;
	font-weight: 400 !important;
	line-height: 1.5 !important;
	color: var(--fmc-fm-body) !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.forminator-ui.forminator-custom-form .forminator-textarea {
	min-height: 140px !important;
	padding: 14px 16px !important;
	line-height: 1.7 !important;
	resize: vertical;
}

.forminator-ui.forminator-custom-form .forminator-input:hover,
.forminator-ui.forminator-custom-form .forminator-textarea:hover {
	border-color: rgba(226, 95, 112, 0.45) !important;
}

/* Focus: coral border plus a soft ring. The ring is a box-shadow rather than
   an outline so it follows the 12px corner radius. */
.forminator-ui.forminator-custom-form .forminator-input:focus,
.forminator-ui.forminator-custom-form .forminator-textarea:focus,
.forminator-ui.forminator-custom-form .forminator-input:focus-visible,
.forminator-ui.forminator-custom-form .forminator-textarea:focus-visible {
	outline: none !important;
	background-color: var(--fmc-fm-white) !important;
	border-color: var(--fmc-fm-primary) !important;
	box-shadow: 0 0 0 3px rgba(226, 95, 112, 0.16) !important;
}

.forminator-ui.forminator-custom-form .forminator-input::placeholder,
.forminator-ui.forminator-custom-form .forminator-textarea::placeholder {
	color: rgba(134, 103, 104, 0.65) !important;
	opacity: 1;
}

.forminator-ui.forminator-custom-form .forminator-input:disabled,
.forminator-ui.forminator-custom-form .forminator-textarea:disabled {
	background-color: rgba(134, 103, 104, 0.06) !important;
	color: var(--fmc-fm-muted) !important;
}

/* Native <select> — used when select2 is off, and for some field types.
   Replaces the OS arrow with a coral chevron so it matches the rest. */
.forminator-ui.forminator-custom-form select.forminator-input,
.forminator-ui.forminator-custom-form select.forminator-select {
	-webkit-appearance: none !important;
	-moz-appearance: none !important;
	appearance: none !important;
	padding-right: 42px !important;
	background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%23e25f70' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 16px center !important;
	background-size: 15px 15px !important;
}

/* =====================================================
   SELECT2 DROPDOWNS

   Forminator bundles stock select2 and layers its own classes on top, so the
   real structure is:

     in the form   .select2-container.forminator-select
                     .select2-selection--single
                       .select2-selection__rendered   <- the visible text
                       .select2-selection__arrow      <- the chevron
     on <body>     .forminator-select.forminator-select-dropdown-container--open
                     .forminator-select-dropdown
                       .select2-search > input
                       .select2-results__options
                         .select2-results__option

   The open panel is appended to <body>, NOT left inside the form — so the
   panel rules below must NOT be scoped under .forminator-ui or they can never
   match. They're scoped to .forminator-select instead, which select2 puts on
   the container, so other select2 instances on the site (WooCommerce, admin)
   are left alone.
   ===================================================== */

/* ---- Closed box ---- */

.forminator-ui.forminator-custom-form .select2-container .select2-selection--single,
.forminator-ui.forminator-custom-form .select2-container .select2-selection--multiple {
	height: auto !important;
	min-height: 0 !important;
	padding: 13px 42px 13px 16px !important;
	background-color: var(--fmc-fm-field-bg) !important;
	border: 1px solid var(--fmc-fm-hairline) !important;
	border-radius: var(--fmc-fm-radius) !important;
	box-shadow: none !important;
	outline: none !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
	color: var(--fmc-fm-body) !important;
	transition: border-color 0.2s ease, box-shadow 0.2s ease, background-color 0.2s ease;
}

.forminator-ui.forminator-custom-form .select2-container .select2-selection__rendered {
	padding: 0 !important;
	line-height: 1.5 !important;
	color: var(--fmc-fm-body) !important;
}

.forminator-ui.forminator-custom-form .select2-container .select2-selection__placeholder {
	color: rgba(134, 103, 104, 0.65) !important;
}

.forminator-ui.forminator-custom-form .select2-container:hover .select2-selection--single {
	border-color: rgba(226, 95, 112, 0.45) !important;
}

/* Open or keyboard-focused: same coral border + ring as a text input.
   select2 puts the focus outline on an inner element, hence outline:none. */
.forminator-ui.forminator-custom-form .select2-container--open .select2-selection--single,
.forminator-ui.forminator-custom-form .select2-container--focus .select2-selection--single,
.forminator-ui.forminator-custom-form .select2-container--open .select2-selection--multiple,
.forminator-ui.forminator-custom-form .select2-container--focus .select2-selection--multiple {
	background-color: var(--fmc-fm-white) !important;
	border-color: var(--fmc-fm-primary) !important;
	box-shadow: 0 0 0 3px rgba(226, 95, 112, 0.16) !important;
	outline: none !important;
}

.forminator-ui.forminator-custom-form .select2-selection:focus,
.forminator-ui.forminator-custom-form .select2-selection__rendered:focus {
	outline: none !important;
}

/* ---- Arrow ----
   Forminator draws this with its OWN icon font ([class*="forminator-icon-"]
   inside .select2-selection__arrow) and already rotates it 180deg via
   [aria-expanded=true]. So: don't draw a second chevron and don't re-rotate
   it — just recolour what's there, and leave its geometry alone so it stays
   where Forminator put it.

   The `b` rule is the fallback for stock select2's CSS-triangle arrow, used
   when the icon font isn't present. Harmless when it is. */
.forminator-ui.forminator-custom-form .select2-selection__arrow {
	color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .select2-selection__arrow [class*="forminator-icon-"],
.forminator-ui.forminator-custom-form .select2-selection__arrow [class*="forminator-icon-"]::before,
.forminator-ui.forminator-custom-form .select2-selection__arrow i {
	color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .select2-selection__arrow b {
	border-top-color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .select2-container--open .select2-selection__arrow b {
	border-bottom-color: var(--fmc-fm-primary) !important;
}

/* ---- Multi-select tags ---- */

.forminator-ui.forminator-custom-form .select2-selection__choice {
	margin: 3px 6px 3px 0 !important;
	padding: 3px 10px !important;
	background-color: rgba(251, 183, 158, 0.28) !important;
	border: 1px solid rgba(226, 95, 112, 0.28) !important;
	border-radius: 999px !important;
	font-size: 13px !important;
	color: var(--fmc-fm-heading) !important;
}

.forminator-ui.forminator-custom-form .select2-selection__choice__remove {
	margin-right: 5px !important;
	color: var(--fmc-fm-primary) !important;
}

/* ---- Open panel (appended to <body>) ---- */

.forminator-select .forminator-select-dropdown,
.forminator-select.select2-container .select2-dropdown {
	margin-top: 6px !important;
	background-color: var(--fmc-fm-white, #fff) !important;
	border: 1px solid rgba(226, 95, 112, 0.35) !important;
	border-radius: 12px !important;
	box-shadow: 0 16px 34px rgba(76, 56, 74, 0.18) !important;
	overflow: hidden !important;
}

.forminator-select .select2-results__options {
	padding: 6px !important;
	background: transparent !important;
}

.forminator-select .select2-results__option {
	margin: 0 !important;
	padding: 10px 14px !important;
	border-radius: 8px !important;
	background: transparent !important;
	font-family: var(--fmc-fm-font-body, inherit) !important;
	font-size: 14.5px !important;
	line-height: 1.5 !important;
	color: rgba(0, 0, 0, 0.78) !important;
}

/* select2's default highlight is a solid blue — this is what replaces it. */
.forminator-select .select2-results__option--highlighted,
.forminator-select .select2-results__option[data-selected="true"]:hover,
.forminator-select .select2-results__option:hover {
	background-color: rgba(251, 183, 158, 0.3) !important;
	color: #4c384a !important;
}

.forminator-select .select2-results__option--selected,
.forminator-select .select2-results__option[aria-selected="true"] {
	background-color: rgba(226, 95, 112, 0.12) !important;
	color: #4c384a !important;
	font-weight: 600 !important;
}

.forminator-select .select2-results__option:focus,
.forminator-select .select2-results__option:focus-visible {
	outline: 2px solid #e25f70 !important;
	outline-offset: -2px !important;
}

.forminator-select .forminator-select-dropdown:focus,
.forminator-select .select2-dropdown:focus,
.forminator-select .select2-results:focus,
.forminator-select .select2-results__options:focus {
	outline: none !important;
}

.forminator-select .select2-results__message {
	color: #866768 !important;
	font-style: normal !important;
}

/* Search box inside the panel */
.forminator-select .select2-search--dropdown {
	padding: 8px !important;
	background: transparent !important;
}

.forminator-select .select2-search__field,
.forminator-select .select2-search input {
	padding: 9px 12px !important;
	background-color: #fdfaf8 !important;
	border: 1px solid rgba(134, 103, 104, 0.28) !important;
	border-radius: 8px !important;
	box-shadow: none !important;
	outline: none !important;
	font-family: var(--fmc-fm-font-body, inherit) !important;
	font-size: 14px !important;
	color: rgba(0, 0, 0, 0.78) !important;
}

.forminator-select .select2-search__field:focus,
.forminator-select .select2-search input:focus {
	border-color: #e25f70 !important;
	box-shadow: 0 0 0 3px rgba(226, 95, 112, 0.16) !important;
}

/* =====================================================
   CHECKBOXES + RADIOS

   Forminator hides the real control and paints .forminator-checkbox-box /
   .forminator-radio-bullet next to it, so the checked state hangs off the
   sibling selector.
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-checkbox,
.forminator-ui.forminator-custom-form .forminator-radio {
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 14.5px !important;
	line-height: 1.6 !important;
	color: var(--fmc-fm-body) !important;
}

.forminator-ui.forminator-custom-form .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-radio-bullet {
	background-color: var(--fmc-fm-white) !important;
	border: 1px solid var(--fmc-fm-hairline) !important;
	box-shadow: none !important;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.forminator-ui.forminator-custom-form .forminator-checkbox-box {
	border-radius: 5px !important;
}

.forminator-ui.forminator-custom-form .forminator-radio-bullet {
	border-radius: 50% !important;
}

.forminator-ui.forminator-custom-form .forminator-checkbox:hover .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-radio:hover .forminator-radio-bullet {
	border-color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .forminator-checkbox input:checked + .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-radio input:checked + .forminator-radio-bullet {
	background-color: var(--fmc-fm-primary) !important;
	border-color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .forminator-checkbox input:focus-visible + .forminator-checkbox-box,
.forminator-ui.forminator-custom-form .forminator-radio input:focus-visible + .forminator-radio-bullet {
	box-shadow: 0 0 0 3px rgba(226, 95, 112, 0.22) !important;
}

/* =====================================================
   BUTTONS
   ===================================================== */

.forminator-ui.forminator-custom-form button.forminator-button-submit,
.forminator-ui.forminator-custom-form .forminator-button-submit,
.forminator-ui.forminator-custom-form .forminator-button-paypal {
	padding: 14px 36px !important;
	background: var(--fmc-fm-primary) !important;
	border: 1px solid var(--fmc-fm-primary) !important;
	border-radius: 999px !important;
	box-shadow: 0 6px 14px rgba(226, 95, 112, 0.3) !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: 0.02em !important;
	line-height: 1.4 !important;
	color: var(--fmc-fm-white) !important;
	cursor: pointer;
	transition: background 0.25s ease, transform 0.25s ease, box-shadow 0.25s ease;
}

.forminator-ui.forminator-custom-form button.forminator-button-submit:hover,
.forminator-ui.forminator-custom-form button.forminator-button-submit:focus-visible {
	background: var(--fmc-fm-heading) !important;
	border-color: var(--fmc-fm-heading) !important;
	color: var(--fmc-fm-white) !important;
	transform: translateY(-2px);
	box-shadow: 0 10px 20px rgba(76, 56, 74, 0.28) !important;
	outline: none !important;
}

.forminator-ui.forminator-custom-form button.forminator-button-submit:focus-visible {
	outline: 2px solid var(--fmc-fm-primary) !important;
	outline-offset: 3px;
}

.forminator-ui.forminator-custom-form button.forminator-button-submit:disabled,
.forminator-ui.forminator-custom-form button.forminator-button-submit.forminator-button-onload {
	opacity: 0.65;
	transform: none;
	cursor: wait;
}

/* Secondary: multi-step "Back", file "Upload", and any non-submit button. */
.forminator-ui.forminator-custom-form .forminator-button-back,
.forminator-ui.forminator-custom-form .forminator-button-upload {
	padding: 12px 28px !important;
	background: transparent !important;
	border: 1px solid var(--fmc-fm-hairline) !important;
	border-radius: 999px !important;
	box-shadow: none !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	color: var(--fmc-fm-heading) !important;
	cursor: pointer;
	transition: background 0.22s ease, border-color 0.22s ease, color 0.22s ease;
}

.forminator-ui.forminator-custom-form .forminator-button-back:hover,
.forminator-ui.forminator-custom-form .forminator-button-upload:hover {
	background: rgba(251, 183, 158, 0.18) !important;
	border-color: var(--fmc-fm-primary) !important;
	color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .forminator-button-delete {
	color: var(--fmc-fm-error) !important;
}

/* =====================================================
   VALIDATION + RESPONSE MESSAGES
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-error-message {
	margin-top: 6px !important;
	padding: 0 !important;
	background: none !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 12.5px !important;
	font-weight: 600 !important;
	line-height: 1.5 !important;
	color: var(--fmc-fm-error) !important;
}

.forminator-ui.forminator-custom-form .forminator-has_error .forminator-input,
.forminator-ui.forminator-custom-form .forminator-has_error .forminator-textarea,
.forminator-ui.forminator-custom-form .forminator-input.forminator-has_error,
.forminator-ui.forminator-custom-form .forminator-textarea.forminator-has_error {
	background-color: rgba(179, 38, 30, 0.04) !important;
	border-color: var(--fmc-fm-error) !important;
}

.forminator-ui.forminator-custom-form .forminator-has_error .forminator-input:focus,
.forminator-ui.forminator-custom-form .forminator-input.forminator-has_error:focus {
	box-shadow: 0 0 0 3px rgba(179, 38, 30, 0.14) !important;
}

/* The banner shown after submit. */
.forminator-ui .forminator-response-message {
	margin: 0 0 22px !important;
	padding: 16px 20px !important;
	border: 1px solid transparent !important;
	border-radius: var(--fmc-fm-radius, 12px) !important;
	font-family: var(--fmc-fm-font-body, inherit) !important;
	font-size: 14.5px !important;
	line-height: 1.6 !important;
}

.forminator-ui .forminator-response-message.forminator-success {
	background: rgba(46, 125, 91, 0.08) !important;
	border-color: rgba(46, 125, 91, 0.35) !important;
	color: #2e7d5b !important;
}

.forminator-ui .forminator-response-message.forminator-error {
	background: rgba(179, 38, 30, 0.06) !important;
	border-color: rgba(179, 38, 30, 0.32) !important;
	color: #b3261e !important;
}

.forminator-ui .forminator-response-message p {
	margin: 0 0 8px !important;
	color: inherit !important;
}

.forminator-ui .forminator-response-message p:last-child {
	margin-bottom: 0 !important;
}

/* =====================================================
   FILE UPLOAD
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-file-upload,
.forminator-ui.forminator-custom-form .forminator-multi-upload {
	background-color: var(--fmc-fm-field-bg) !important;
	border: 1px dashed var(--fmc-fm-hairline) !important;
	border-radius: var(--fmc-fm-radius) !important;
	transition: border-color 0.2s ease, background-color 0.2s ease;
}

.forminator-ui.forminator-custom-form .forminator-multi-upload:hover {
	background-color: rgba(251, 183, 158, 0.12) !important;
	border-color: var(--fmc-fm-primary) !important;
}

.forminator-ui.forminator-custom-form .forminator-uploaded-file {
	border-radius: 8px !important;
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 13.5px !important;
	color: var(--fmc-fm-body) !important;
}

/* =====================================================
   MULTI-STEP PAGINATION
   ===================================================== */

.forminator-ui.forminator-custom-form .forminator-pagination-steps .forminator-step-label {
	font-family: var(--fmc-fm-font-body) !important;
	font-size: 13px !important;
	color: var(--fmc-fm-muted) !important;
}

.forminator-ui.forminator-custom-form .forminator-progress-bar span,
.forminator-ui.forminator-custom-form .forminator-progress-value {
	background: linear-gradient(90deg, var(--fmc-fm-primary), var(--fmc-fm-secondary)) !important;
}

/* =====================================================
   RESPONSIVE
   ===================================================== */

@media (max-width: 620px) {
	.forminator-ui.forminator-custom-form .forminator-title {
		font-size: 22px !important;
	}

	.forminator-ui.forminator-custom-form .forminator-input,
	.forminator-ui.forminator-custom-form .forminator-textarea {
		/* 16px keeps iOS Safari from zooming the page on focus. */
		font-size: 16px !important;
		padding: 12px 14px !important;
	}

	.forminator-ui.forminator-custom-form button.forminator-button-submit {
		width: 100% !important;
		padding: 15px 24px !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.forminator-ui.forminator-custom-form .forminator-input,
	.forminator-ui.forminator-custom-form .forminator-textarea,
	.forminator-ui.forminator-custom-form button.forminator-button-submit,
	.forminator-ui.forminator-custom-form .forminator-button-back,
	.forminator-ui.forminator-custom-form .forminator-checkbox-box,
	.forminator-ui.forminator-custom-form .forminator-radio-bullet {
		transition: none !important;
	}

	.forminator-ui.forminator-custom-form button.forminator-button-submit:hover {
		transform: none;
	}
}
