/**
 * PowerFlow Wash — form field styling (UI only; no backend processing
 * ships with the theme — connect to a form plugin or custom endpoint).
 */

.powerflow-field {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
	margin-bottom: 1.25rem;
}

.powerflow-field label {
	font-weight: 600;
	font-size: var(--wp--preset--font-size--sm, 0.875rem);
	color: var(--wp--preset--color--ink-900, #07182b);
}

.powerflow-field input,
.powerflow-field select,
.powerflow-field textarea {
	min-height: 44px;
	padding: 0.7rem 1rem;
	border: 1.5px solid var(--wp--preset--color--gray-300, #b4c2d0);
	border-radius: var(--wp--custom--radius--sm, 8px);
	font-family: var(--wp--preset--font-family--sans);
	font-size: var(--wp--preset--font-size--md, 1rem);
	background: #fff;
	transition: border-color var(--pf-dur-fast) var(--pf-ease-flow), box-shadow var(--pf-dur-fast) var(--pf-ease-flow);
}

.powerflow-field textarea {
	min-height: 140px;
	resize: vertical;
}

.powerflow-field input:focus,
.powerflow-field select:focus,
.powerflow-field textarea:focus {
	outline: none;
	border-color: var(--wp--preset--color--brand, #0b6be3);
	box-shadow: var(--pf-focus-ring);
}

.powerflow-field--error input,
.powerflow-field--error select,
.powerflow-field--error textarea {
	border-color: var(--wp--preset--color--danger, #e5484d);
}

.powerflow-field__error {
	font-size: var(--wp--preset--font-size--xs, 0.75rem);
	color: var(--wp--preset--color--danger, #e5484d);
}

.powerflow-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0 1.25rem;
}

@media (max-width: 640px) {
	.powerflow-form-grid {
		grid-template-columns: 1fr;
	}
}

.powerflow-radio-group {
	display: flex;
	flex-wrap: wrap;
	gap: 0.75rem;
	margin-bottom: 1.25rem;
}

.powerflow-radio-group label {
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	padding: 0.6rem 1rem;
	border: 1.5px solid var(--wp--preset--color--gray-300, #b4c2d0);
	border-radius: var(--wp--custom--radius--pill, 999px);
	cursor: pointer;
	font-size: var(--wp--preset--font-size--sm, 0.875rem);
	min-height: 44px;
}

.powerflow-radio-group input:checked + span,
.powerflow-radio-group label:has(input:checked) {
	border-color: var(--wp--preset--color--brand, #0b6be3);
	color: var(--wp--preset--color--brand, #0b6be3);
}