/*
 * Form fields + submit buttons — brand-spec across every form on the site.
 *
 * Brand guide §04 (Direction A · Components):
 *   - Buttons: 44px min-height, 8px radius, semibold, brand-deep bg, paper text;
 *     ink on hover.
 *   - Form fields: 44px min-height, 1px border, 6px radius. Label above, help below.
 *
 * Why a single file instead of per-plugin: every form plugin (WPForms,
 * WC, CF7, isjac-core auth forms) reaches the same `<input>` / `<select>`
 * / `<textarea>` / submit underneath. Element-level styling at low
 * specificity stays consistent across whichever plugin renders the form.
 *
 * All colors reference brand tokens from isjac-core/assets/css/tokens.css.
 * The lone exception is the data-URI SVG chevron — data: URIs can't read
 * CSS custom properties at runtime, so the stroke color is baked in. Both
 * default and focus variants are pre-rendered to match brand tokens.
 */

/* ---------- Inputs / selects / textareas ---------- *
 * Brand spec: 44px height, 1px border, 6px radius. Calm focus ring.
 * Scope to entry-content + known form containers so admin-area inputs
 * don't get re-themed. */
.entry-content input[type="text"],
.entry-content input[type="email"],
.entry-content input[type="tel"],
.entry-content input[type="url"],
.entry-content input[type="password"],
.entry-content input[type="search"],
.entry-content input[type="number"],
.entry-content input[type="date"],
.entry-content input[type="time"],
.entry-content textarea,
.entry-content select,
.wpforms-field input[type="text"],
.wpforms-field input[type="email"],
.wpforms-field input[type="tel"],
.wpforms-field input[type="url"],
.wpforms-field input[type="password"],
.wpforms-field input[type="number"],
.wpforms-field textarea,
.wpforms-field select,
.wpcf7-form input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.wpcf7-form textarea,
.wpcf7-form select,
.woocommerce-checkout input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.cfw-input,
.cfw-input-group input,
.cfw-input-group select,
.cfw-input-group textarea,
.cfw-module input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.cfw-module select,
.cfw-module textarea {
	min-height: var(--isjac-input-min-height);
	padding: 0 var(--isjac-input-padding-x);
	border: 1px solid var(--isjac-border-default);
	border-radius: var(--isjac-radius-sm);
	background-color: var(--isjac-surface-card);
	color: var(--isjac-text-primary);
	font-family: inherit;
	font-size: var(--isjac-font-size-small);
	line-height: 1.4;
	width: 100%;
	box-sizing: border-box;
	transition: border-color 150ms ease-out, box-shadow 150ms ease-out;
}

.entry-content textarea,
.wpforms-field textarea,
.wpcf7-form textarea {
	min-height: 8rem;
	resize: vertical;
}

.entry-content input:hover,
.entry-content textarea:hover,
.entry-content select:hover,
.wpforms-field input:hover,
.wpforms-field textarea:hover,
.wpforms-field select:hover,
.cfw-input:hover,
.cfw-module input:hover,
.cfw-module select:hover,
.cfw-module textarea:hover {
	border-color: var(--isjac-color-brand-mid);
}

.entry-content input:focus-visible,
.entry-content textarea:focus-visible,
.entry-content select:focus-visible,
.wpforms-field input:focus-visible,
.wpforms-field textarea:focus-visible,
.wpforms-field select:focus-visible,
.cfw-input:focus-visible,
.cfw-module input:focus-visible,
.cfw-module select:focus-visible,
.cfw-module textarea:focus-visible {
	outline: 0;
	border-color: var(--isjac-color-brand-deep);
	box-shadow: 0 0 0 3px rgba(21, 82, 111, 0.18);
}

.entry-content input::placeholder,
.entry-content textarea::placeholder,
.wpforms-field input::placeholder,
.wpforms-field textarea::placeholder {
	color: var(--isjac-text-muted);
}

.entry-content input[disabled],
.entry-content textarea[disabled],
.entry-content select[disabled] {
	background: var(--isjac-color-brand-wash);
	color: var(--isjac-text-muted);
	cursor: not-allowed;
}

/* ---------- Labels (above field) ---------- */
.wpforms-field-label,
.wpcf7-form-control-wrap label,
.woocommerce-form-row label,
.cfw-input-group label,
.cfw-module label,
.entry-content label {
	display: block;
	margin-bottom: var(--isjac-space-1);
	font-weight: 600;
	color: var(--isjac-text-primary);
	font-size: var(--isjac-font-size-small);
}

/* ---------- Help text + descriptions (below field) ---------- */
.wpforms-field-description,
.wpforms-field-sublabel,
.wpcf7-form-control-wrap .wpcf7-form-control-help,
.entry-content .form-help-text,
.entry-content .description {
	display: block;
	margin-top: var(--isjac-space-1);
	font-size: var(--isjac-font-size-micro);
	color: var(--isjac-text-muted);
	line-height: 1.45;
}

/* Required-field marker is brand-deep (an indicator, not an error). */
.wpforms-required-label {
	color: var(--isjac-color-brand-deep);
	margin-left: 2px;
}

/* ---------- Select chevron ---------- *
 * `appearance: none` from the input rule above strips the browser chevron;
 * draw one back with an inline SVG. Hex values in data-URI SVGs cannot
 * reference CSS custom properties (data: URIs are not parsed in the
 * page's CSS context), so default + focus variants are pre-baked from
 * the brand palette. Update both if --isjac-color-ink or
 * --isjac-color-brand-deep change. */
.entry-content select,
.wpforms-field select,
.wpcf7-form select,
.woocommerce-checkout select,
.cfw-input-group select,
.cfw-module select {
	appearance: none;
	-webkit-appearance: none;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23020726' stroke-width='2'><path d='M4 6l4 4 4-4'/></svg>");
	background-repeat: no-repeat;
	background-position: right var(--isjac-input-padding-x) center;
	background-size: 14px 14px;
	padding-right: 2.25rem;
}

.entry-content select:focus,
.wpforms-field select:focus,
.wpcf7-form select:focus,
.woocommerce-checkout select:focus,
.cfw-input-group select:focus,
.cfw-module select:focus {
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%2315526F' stroke-width='2'><path d='M4 6l4 4 4-4'/></svg>");
}

/* ---------- Submit buttons (Primary) ---------- *
 * Brand spec: 44px min-height, 8px radius, semibold, brand-deep → ink on hover.
 * Apply across WPForms, WC, CF7. theme.json owns the core/button block style;
 * this rule covers form-plugin submits separately. */
.entry-content input[type="submit"],
.entry-content button[type="submit"],
.wpforms-submit,
.wpcf7-form .wpcf7-submit,
.woocommerce-checkout button[type="submit"],
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.cfw-button-primary,
.cfw-button-place-order,
button.cfw-button {
	min-height: var(--isjac-button-min-height);
	padding: var(--isjac-pad-sm) var(--isjac-pad-lg);
	border: 0;
	border-radius: var(--isjac-radius-md);
	background-color: var(--isjac-button-primary-bg);
	color: var(--isjac-button-primary-text);
	font-family: inherit;
	font-size: var(--isjac-font-size-base);
	font-weight: 600;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	transition: background-color 150ms ease-out, transform 100ms ease-out;
}

.entry-content input[type="submit"]:hover,
.entry-content button[type="submit"]:hover,
.wpforms-submit:hover,
.wpcf7-form .wpcf7-submit:hover,
.woocommerce-checkout button[type="submit"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.cfw-button-primary:hover,
.cfw-button-place-order:hover,
button.cfw-button:hover {
	background-color: var(--isjac-button-primary-hover);
	color: var(--isjac-button-primary-text);
}

.entry-content input[type="submit"]:focus-visible,
.entry-content button[type="submit"]:focus-visible,
.wpforms-submit:focus-visible,
.wpcf7-form .wpcf7-submit:focus-visible,
.woocommerce button.button:focus-visible {
	outline: 2px solid var(--isjac-color-brand-deep);
	outline-offset: 3px;
}

.entry-content input[type="submit"][disabled],
.entry-content button[type="submit"][disabled],
.wpforms-submit[disabled],
.wpcf7-form .wpcf7-submit[disabled] {
	background: var(--isjac-color-brand-mid);
	color: var(--isjac-button-primary-text);
	cursor: not-allowed;
	opacity: 0.65;
}
