/**
 * Tamweel Plus unified workflow form presentation layer.
 *
 * The body marker and known source-form roots keep these rules isolated from
 * Elementor and unrelated third-party forms. Source plugins retain all logic.
 */

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) {
	--tppc-form-control-height: 48px;
	--tppc-form-control-border: #c9d9e8;
	--tppc-form-control-hover: #8fb3d2;
	--tppc-form-placeholder: #718397;
	box-sizing: border-box;
	color: var(--tppc-color-foreground);
	font-family: var(--tppc-font-family);
	font-size: var(--tppc-font-size-md);
	line-height: var(--tppc-line-height-body);
	text-align: start;
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) *,
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) *::before,
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) *::after {
	box-sizing: border-box;
}

/* Labels and logical field grouping. */
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form
) label {
	color: var(--tppc-color-foreground);
	font-family: var(--tppc-font-family);
	font-weight: 700;
	line-height: 1.6;
	text-align: start;
}

.tppc-unified-form-ui :is(
	.tpwf-field,
	.tpsi-request-form > label,
	.tpsi-review-form > label,
	.tpsic-field,
	.tprf-form label,
	.tprf-inline-form label,
	.cpm-step-form-field,
	.cpm-step-review-inline-form label,
	.cpm-add-step-form label,
	.cpm-project-note-form label,
	.cpm-rating-form label
) {
	gap: var(--tppc-space-2);
}

.tppc-unified-form-ui :is(
	.tpwf-field small,
	.tpsi-request-form small,
	.tpsi-review-form small,
	.tpsic-field small,
	.tprf-form small,
	.tprf-inline-form small,
	.cpm-step-form small,
	.cpm-step-review-inline-form small,
	.cpm-add-step-form small,
	.cpm-project-note-form small,
	.cpm-rating-form small,
	.tpwf-field-help,
	.tpsic-help,
	.cpm-step-form-question
) {
	color: var(--tppc-color-muted);
	font-size: var(--tppc-font-size-sm);
	font-weight: 400;
	line-height: 1.7;
}

/* Text controls. Checkbox/radio/hidden inputs remain source-owned. */
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(
	input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
	select,
	textarea
) {
	inline-size: 100%;
	min-block-size: var(--tppc-form-control-height);
	margin: 0;
	padding: 0.75rem 1rem;
	border: 1px solid var(--tppc-form-control-border);
	border-radius: var(--tppc-radius-md);
	background-color: var(--tppc-color-surface);
	box-shadow: 0 1px 2px rgb(16 35 62 / 4%);
	color: var(--tppc-color-foreground);
	font: 400 var(--tppc-font-size-md) / 1.5 var(--tppc-font-family);
	text-align: start;
	transition: border-color var(--tppc-transition), box-shadow var(--tppc-transition), background-color var(--tppc-transition);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) textarea {
	min-block-size: 8rem;
	resize: vertical;
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, textarea)::placeholder {
	color: var(--tppc-form-placeholder);
	opacity: 1;
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, select, textarea):not([type="hidden"]):hover {
	border-color: var(--tppc-form-control-hover);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, select, textarea):not([type="hidden"]):focus,
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, select, textarea):not([type="hidden"]):focus-visible {
	border-color: var(--tppc-color-accent);
	outline: 2px solid transparent;
	box-shadow: var(--tppc-focus-ring);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, select, textarea)[aria-invalid="true"],
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(input, select, textarea):user-invalid {
	border-color: var(--tppc-color-danger);
	box-shadow: 0 0 0 3px rgb(180 35 24 / 12%);
}

/* Checkboxes and radios keep native semantics with a larger, consistent hit area. */
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-rating-form
) :is(input[type="checkbox"], input[type="radio"]) {
	inline-size: 1.25rem;
	block-size: 1.25rem;
	margin: 0;
	accent-color: var(--tppc-color-primary);
	vertical-align: middle;
}

/* File fields are visually distinct and preserve the browser upload control. */
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.cpm-step-form,
	.cpm-add-step-form
) input[type="file"] {
	min-block-size: 56px;
	padding: 0.4rem;
	border-style: dashed;
	background: #f8fbfe;
	color: var(--tppc-color-muted);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.cpm-step-form,
	.cpm-add-step-form
) input[type="file"]::file-selector-button {
	min-block-size: 42px;
	margin-inline-end: var(--tppc-space-3);
	padding: 0.55rem 1rem;
	border: 0;
	border-radius: var(--tppc-radius-sm);
	background: var(--tppc-color-primary-soft);
	color: var(--tppc-color-primary);
	cursor: pointer;
	font-family: var(--tppc-font-family);
	font-weight: 700;
}

/* Primary actions. Specific reject/cancel controls are styled separately. */
.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(button, input[type="submit"], input[type="button"]) {
	display: inline-flex;
	min-block-size: 44px;
	align-items: center;
	justify-content: center;
	gap: var(--tppc-space-2);
	padding: 0.7rem 1.35rem;
	border: 1px solid transparent;
	border-radius: var(--tppc-radius-md);
	background: var(--tppc-color-primary);
	box-shadow: 0 4px 12px rgb(16 73 129 / 14%);
	color: #fff;
	cursor: pointer;
	font: 700 var(--tppc-font-size-md) / 1.4 var(--tppc-font-family);
	text-decoration: none;
	touch-action: manipulation;
	transition: background-color var(--tppc-transition), border-color var(--tppc-transition), color var(--tppc-transition), box-shadow var(--tppc-transition), opacity var(--tppc-transition);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(button, input[type="submit"], input[type="button"]):hover {
	background: var(--tppc-color-primary-strong);
	box-shadow: 0 6px 16px rgb(16 73 129 / 20%);
	color: #fff;
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(button, input[type="submit"], input[type="button"]):focus-visible {
	outline: 2px solid transparent;
	box-shadow: var(--tppc-focus-ring), 0 6px 16px rgb(16 73 129 / 20%);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-request-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-project-note-form,
	.cpm-rating-form,
	.cpm-project-chat__form
) :is(button, input[type="submit"], input[type="button"]):disabled {
	cursor: not-allowed;
	opacity: 0.48;
	box-shadow: none;
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-rating-form
) :is(
	.tpwf-button--secondary,
	.tprf-secondary,
	.cpm-button--secondary,
	button[name="previous"],
	button[data-action="previous"]
) {
	border-color: var(--tppc-color-primary);
	background: var(--tppc-color-surface);
	box-shadow: none;
	color: var(--tppc-color-primary);
}

.tppc-unified-form-ui :is(
	.tpwf-form,
	.tpsi-review-form,
	.tpsic-form,
	.tprf-form,
	.tprf-inline-form,
	.tprf-action-form,
	.cpm-step-form,
	.cpm-step-review-inline-form,
	.cpm-add-step-form,
	.cpm-rating-form
) :is(
	.tpwf-button--secondary,
	.tprf-secondary,
	.cpm-button--secondary,
	button[name="previous"],
	button[data-action="previous"]
):hover {
	background: var(--tppc-color-primary-soft);
	color: var(--tppc-color-primary-strong);
}

.tppc-unified-form-ui :is(
	.tpsi-review-form,
	.tpsic-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-review-inline-form
) :is(
	.tpsic-button-danger,
	.tprf-review-form-reject button,
	.cpm-button--danger,
	button[name="decision"][value="reject"]
) {
	border-color: var(--tppc-color-danger);
	background: var(--tppc-color-surface);
	box-shadow: none;
	color: var(--tppc-color-danger);
}

.tppc-unified-form-ui :is(
	.tpsi-review-form,
	.tpsic-form,
	.tprf-review-form,
	.tprf-action-form,
	.cpm-step-review-inline-form
) :is(
	.tpsic-button-danger,
	.tprf-review-form-reject button,
	.cpm-button--danger,
	button[name="decision"][value="reject"]
):hover {
	background: var(--tppc-color-danger-soft);
	color: #8f1c14;
}

/* Meaningful section rail: one consistent visual cue for progress/grouping. */
.tppc-unified-form-ui :is(
	.tpwf-panel,
	.tpsic-form-section,
	.tprf-form-section,
	.cpm-step-form-intro,
	.cpm-step-form-data
) {
	border-inline-start: 4px solid var(--tppc-color-secondary);
}

.tppc-unified-form-ui :is(
	.tpwf-panel h2,
	.tpwf-panel h3,
	.tpsic-form-section h2,
	.tpsic-form-section h3,
	.tprf-form-section h3,
	.tprf-form-section h4,
	.cpm-step-form-intro strong,
	.cpm-step-form-data > strong
) {
	color: var(--tppc-color-primary);
	font-family: var(--tppc-font-family);
	font-weight: 700;
	line-height: var(--tppc-line-height-tight);
}

/* Feedback surfaces use tone plus a structural border, never color alone. */
.tppc-unified-form-ui :is(
	.tpwf-notice,
	.tpwf-form-errors,
	.tpsi-notice,
	.tpsic-notice,
	.tprf-notice,
	.cpm-notice,
	.cpm-message,
	.cpm-error
) {
	padding: var(--tppc-space-4);
	border: 1px solid #b9d2e8;
	border-inline-start: 4px solid var(--tppc-color-info);
	border-radius: var(--tppc-radius-md);
	background: var(--tppc-color-info-soft);
	color: var(--tppc-color-foreground);
	font-family: var(--tppc-font-family);
	line-height: var(--tppc-line-height-body);
}

.tppc-unified-form-ui :is(
	.tpwf-error,
	.tpwf-field-error,
	.tpsi-error,
	.tpsic-error,
	.tprf-error,
	.cpm-error
) {
	color: var(--tppc-color-danger);
	font-size: var(--tppc-font-size-sm);
	font-weight: 700;
	line-height: 1.6;
}

/* Keep action rows predictable in RTL and allow wrapping on narrow screens. */
.tppc-unified-form-ui :is(
	.tpwf-actions,
	.tpwf-form-actions,
	.tpsi-form-actions,
	.tpsic-actions,
	.tprf-form-actions,
	.tprf-action-form,
	.cpm-step-actions,
	.cpm-modern-filter-form__actions
) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--tppc-space-3);
}

@media (max-width: 767px) {
	.tppc-unified-form-ui :is(
		.tpsi-request-form,
		.tpsic-grid,
		.tprf-form-layout,
		.cpm-step-form-grid
	) {
		grid-template-columns: minmax(0, 1fr);
	}

	.tppc-unified-form-ui :is(
		.tpwf-form,
		.tpsi-request-form,
		.tpsi-review-form,
		.tpsic-form,
		.tprf-form,
		.tprf-inline-form,
		.tprf-review-form,
		.cpm-step-form,
		.cpm-step-review-inline-form,
		.cpm-add-step-form,
		.cpm-project-note-form,
		.cpm-rating-form,
		.cpm-project-chat__form
	) :is(button, input[type="submit"], input[type="button"]) {
		inline-size: 100%;
	}

	.tppc-unified-form-ui :is(
		.tpwf-actions,
		.tpwf-form-actions,
		.tpsi-form-actions,
		.tpsic-actions,
		.tprf-form-actions,
		.tprf-action-form,
		.cpm-step-actions
	) {
		align-items: stretch;
		flex-direction: column;
	}
}

@media (prefers-reduced-motion: reduce) {
	.tppc-unified-form-ui :is(
		.tpwf-form,
		.tpsi-request-form,
		.tpsi-review-form,
		.tpsic-form,
		.tprf-form,
		.tprf-inline-form,
		.tprf-review-form,
		.cpm-step-form,
		.cpm-step-review-inline-form,
		.cpm-add-step-form,
		.cpm-project-note-form,
		.cpm-rating-form,
		.cpm-project-chat__form
	) * {
		scroll-behavior: auto;
		transition-duration: 0.01ms;
	}
}

@media (forced-colors: active) {
	.tppc-unified-form-ui :is(
		.tpwf-form,
		.tpsi-request-form,
		.tpsi-review-form,
		.tpsic-form,
		.tprf-form,
		.tprf-inline-form,
		.tprf-review-form,
		.cpm-step-form,
		.cpm-step-review-inline-form,
		.cpm-add-step-form,
		.cpm-project-note-form,
		.cpm-rating-form,
		.cpm-project-chat__form
	) :is(input, select, textarea, button) {
		border: 1px solid ButtonText;
	}
}