/* ==========================================================================
   TRC Request Form — Mobile layout
   Desktop unaffected: rules scoped to narrow viewports + JS .trc-form-wrap--mobile
   ========================================================================== */

@media screen and (max-width: 767px),
	screen and (max-width: 1024px) and (hover: none) and (pointer: coarse) {

	.trc-form-wrap,
	.trc-form-wrap.trc-form-wrap--mobile {
		--trc-m-bg: #f1f5f9;
		--trc-m-surface: #ffffff;
		--trc-m-border: #e2e8f0;
		--trc-m-primary: #144995;
		--trc-m-radius: 16px;
		--trc-m-gap: 14px;
		--trc-m-pad: 16px;
		--trc-m-action-h: 72px;
		box-sizing: border-box;
		width: 100vw !important;
		max-width: 100vw !important;
		margin-left: calc(50% - 50vw) !important;
		margin-right: calc(50% - 50vw) !important;
		background: var(--trc-m-bg) !important;
		color: var(--p-text-body);
		padding: 0 0 calc(16px + env(safe-area-inset-bottom, 0px)) !important;
		min-height: auto;
		overflow-x: hidden;
		-webkit-overflow-scrolling: touch;
	}

	.trc-form-wrap .trc-form {
		max-width: 100%;
		width: 100%;
		margin: 0;
		padding: 0;
	}

	/* Progress — sticky header */
	.trc-form-wrap .trc-progress {
		position: sticky;
		top: 0;
		z-index: 30;
		display: flex;
		align-items: flex-start;
		justify-content: center;
		gap: 0;
		margin: 0 0 var(--trc-m-gap);
		padding: 12px var(--trc-m-pad) 14px;
		background: var(--trc-m-surface);
		border-bottom: 1px solid var(--trc-m-border);
		box-shadow: 0 2px 12px rgba(15, 23, 42, 0.06);
	}

	.trc-form-wrap .trc-progress__item {
		flex: 1 1 0;
		min-width: 0;
		max-width: 50%;
		gap: 8px;
	}

	.trc-form-wrap .trc-progress__line {
		flex: 0 0 40px;
		width: 40px;
		max-width: 40px;
		min-width: 28px;
		height: 2px;
		margin: 21px 4px 0;
		background: var(--trc-m-border);
	}

	.trc-form-wrap .trc-progress__step {
		width: 42px;
		height: 42px;
	}

	.trc-form-wrap .trc-progress__icon svg,
	.trc-form-wrap .trc-progress__icon .trc-icon {
		width: 38px;
		height: 38px;
	}

	.trc-form-wrap .trc-progress__label {
		display: block;
		font-size: 11px !important;
		font-weight: 700 !important;
		line-height: 1.4 !important;
		max-width: 100% !important;
		padding: 0 4px;
		color: var(--p-text-body) !important;
		word-break: break-word;
		hyphens: auto;
	}

	/* Steps */
	.trc-form-wrap .trc-form__step {
		padding: 0 var(--trc-m-pad) calc(var(--trc-m-action-h) + env(safe-area-inset-bottom, 0px));
	}

	.trc-form-wrap .trc-form__message {
		margin: 0 var(--trc-m-pad) var(--trc-m-gap);
		padding: 12px 14px;
		border-radius: 12px;
		font-size: 14px;
		line-height: 1.6;
	}

	/* Fields */
	.trc-form-wrap .trc-field {
		margin-bottom: var(--trc-m-gap);
	}

	.trc-form-wrap .trc-field__label--float {
		top: 14px;
		right: 16px;
		font-size: 12px;
		font-weight: 700;
		color: var(--p-text-muted);
	}

	.trc-form-wrap .trc-field__textarea,
	.trc-form-wrap .trc-field__select,
	.trc-form-wrap .trc-custom-select__trigger {
		background: var(--trc-m-surface) !important;
		border: 1px solid var(--trc-m-border) !important;
		border-radius: var(--trc-m-radius) !important;
		box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
		color: var(--p-text-body) !important;
	}

	.trc-form-wrap .trc-field__textarea {
		min-height: 140px;
		padding: 40px 16px 16px;
		font-size: 16px;
		line-height: 1.65;
		resize: none;
	}

	.trc-form-wrap .trc-field__select,
	.trc-form-wrap .trc-custom-select__trigger {
		padding: 38px 16px 14px 44px;
		font-size: 16px;
		min-height: 58px;
		text-align: right;
	}

	.trc-form-wrap .trc-custom-select__value {
		white-space: normal;
		line-height: 1.45;
	}

	/* Select dropdown — open downward on mobile */
	.trc-form-wrap .trc-custom-select__list {
		top: 100%;
		bottom: auto;
		left: 0;
		right: 0;
		background: var(--trc-m-surface);
		border: 1px solid var(--trc-m-border);
		border-top: 0;
		border-radius: 0 0 var(--trc-m-radius) var(--trc-m-radius);
		max-height: min(260px, 45vh);
		box-shadow: 0 8px 24px rgba(15, 23, 42, 0.12);
		transform: translateY(-6px);
	}

	.trc-form-wrap .trc-custom-select--open .trc-custom-select__list {
		transform: translateY(0);
	}

	.trc-form-wrap .trc-custom-select--open .trc-custom-select__trigger {
		border-bottom-left-radius: 0 !important;
		border-bottom-right-radius: 0 !important;
	}

	.trc-form-wrap .trc-custom-select__option {
		padding: 14px 16px;
		font-size: 15px;
		line-height: 1.5;
	}

	.trc-form-wrap .trc-select-wrap__chevron,
	.trc-form-wrap .trc-custom-select .trc-select-wrap__chevron {
		left: 14px;
	}

	.trc-form-wrap .trc-form__row,
	.trc-form-wrap .trc-form__row--contact {
		display: flex !important;
		flex-direction: column !important;
		grid-template-columns: 1fr !important;
		gap: var(--trc-m-gap);
		margin-bottom: var(--trc-m-gap);
	}

	/* Audio recorder */
	.trc-form-wrap .trc-audio-bar {
		flex-direction: column;
		align-items: stretch;
		background: var(--trc-m-surface) !important;
		border: 1px dashed #94a3b8 !important;
		border-radius: var(--trc-m-radius) !important;
		padding: 16px 12px;
		gap: 12px;
		min-height: 0;
		margin-bottom: var(--trc-m-gap);
		overflow: hidden;
		box-sizing: border-box;
		max-width: 100%;
	}

	.trc-form-wrap .trc-audio-bar--recording {
		border-style: solid !important;
		border-color: #e11d48 !important;
		background: #fff1f2 !important;
	}

	.trc-form-wrap .trc-audio-bar--has-file {
		border-style: solid !important;
		border-color: #3d9a4f !important;
		background: #f0fdf4 !important;
	}

	.trc-form-wrap .trc-audio-bar__content {
		text-align: center;
		width: 100%;
		min-width: 0;
	}

	.trc-form-wrap .trc-audio-bar__label {
		font-size: 15px;
		font-weight: 600;
	}

	.trc-form-wrap .trc-audio-bar__status {
		text-align: center;
		word-break: break-word;
	}

	.trc-form-wrap .trc-audio-bar__hint {
		font-size: 13px;
		line-height: 1.8;
		padding: 0 4px;
	}

	.trc-form-wrap .trc-audio-recorder {
		justify-content: center;
	}

	.trc-form-wrap .trc-audio-bar__actions {
		display: flex;
		justify-content: center;
		align-items: center;
		width: 100%;
		max-width: 100%;
		flex-wrap: wrap;
		gap: 10px;
	}

	.trc-form-wrap .trc-audio-bar__record {
		width: auto;
		min-width: 0;
		max-width: calc(100% - 8px);
		flex: 0 1 auto;
		justify-content: center;
		min-height: 40px;
		padding: 9px 16px;
		border-radius: 8px;
	}

	.trc-form-wrap .trc-audio-bar__record svg {
		width: 18px;
		height: 18px;
		flex-shrink: 0;
	}

	.trc-form-wrap .trc-audio-bar__record-text {
		font-size: 13px;
		font-weight: 600;
		white-space: nowrap;
	}

	.trc-form-wrap .trc-audio-bar__delete {
		align-self: center;
		min-width: 40px;
		min-height: 40px;
		padding: 10px;
		touch-action: manipulation;
	}

	.trc-recorder-app {
		padding: 12px;
	}

	.trc-recorder-app__panel {
		width: min(100%, 340px);
		padding: 20px 16px 16px;
	}

	.trc-recorder-app__btn {
		width: min(100%, 220px);
		min-height: 44px;
	}

	.trc-recorder-app--mobile .trc-recorder-app__btn--record,
	button#trc-recorder-record.trc-recorder-app__btn--record {
		color: #ffffff !important;
		background-color: #144995 !important;
		background-image: none !important;
		border: 0 !important;
		box-shadow: 0 2px 10px rgba(20, 73, 149, 0.35) !important;
		font-size: 15px !important;
		font-weight: 700 !important;
		opacity: 1 !important;
		-webkit-tap-highlight-color: transparent;
	}

	.elementor button#trc-recorder-record,
	.elementor-widget-shortcode button#trc-recorder-record {
		color: #ffffff !important;
		background-color: #144995 !important;
		background-image: none !important;
	}

	.trc-recorder-app--mobile .trc-recorder-app__btn--record:active {
		background: #0c2f5e !important;
	}

	.trc-form-wrap .trc-audio-player {
		width: 100%;
	}

	.trc-form-wrap .trc-audio-player__element {
		width: 100%;
		min-height: 44px;
	}

	.trc-form-wrap .trc-audio-recorder__timer {
		font-size: 18px;
		font-weight: 700;
		letter-spacing: 0.04em;
	}

	/* Step 2 — contact fields */
	.trc-form-wrap .trc-form__step--contact {
		padding-bottom: calc(var(--trc-m-action-h) + 16px);
	}

	.trc-form-wrap .trc-form__step--contact .trc-field--input {
		min-height: 72px;
		margin-bottom: 0;
		background: var(--trc-m-surface);
		border: 1px solid var(--trc-m-border);
		border-radius: var(--trc-m-radius);
		box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
		overflow: hidden;
	}

	.trc-form-wrap input.trc-field__input--contact {
		padding: 36px 16px 14px !important;
		min-height: 70px !important;
		height: auto !important;
		font-size: 16px !important;
		background: transparent !important;
		border: none !important;
		border-radius: 0 !important;
		-webkit-border-radius: 0 !important;
		text-align: right;
		direction: rtl;
	}

	.trc-form-wrap #trc-contact-mobile,
	.trc-form-wrap #trc-contact-email {
		direction: ltr;
		text-align: left;
	}

	.trc-form-wrap .trc-form__step--contact .trc-field__label--float {
		right: 16px;
		top: 12px;
		font-size: 12px;
	}

	/* Cost box */
	.trc-form-wrap .trc-cost-box {
		background: var(--trc-m-surface);
		border: 1px solid rgba(20, 73, 149, 0.18);
		border-radius: var(--trc-m-radius);
		padding: 16px;
		margin-top: 4px;
		margin-bottom: var(--trc-m-gap);
		box-shadow: 0 2px 10px rgba(20, 73, 149, 0.08);
	}

	.trc-form-wrap .trc-cost-box__price {
		flex-direction: column;
		align-items: stretch;
		gap: 8px;
		margin-bottom: 12px;
	}

	.trc-form-wrap .trc-cost-box__label {
		font-size: 14px;
	}

	.trc-form-wrap .trc-cost-box__amount-row {
		justify-content: flex-start;
	}

	.trc-form-wrap .trc-cost-box__amount {
		font-size: 26px;
	}

	.trc-form-wrap .trc-cost-box__info {
		padding: 14px;
		border-radius: 12px;
		background: #f8fafc;
	}

	.trc-form-wrap .trc-cost-box__info p {
		font-size: 13px;
		line-height: 1.75;
		margin: 0;
	}

	/* Mobile action bar — single fixed bar in template; hide in-form buttons */
	.trc-form-wrap .trc-form__actions {
		display: none !important;
	}

	.trc-mobile-bar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 100010;
		display: flex;
		flex-direction: column;
		gap: 10px;
		margin: 0;
		padding: 12px var(--trc-m-pad) calc(12px + env(safe-area-inset-bottom, 0px));
		background: #f1f5f9;
		border-top: 1px solid var(--trc-m-border);
		box-shadow: 0 -6px 24px rgba(15, 23, 42, 0.14);
		box-sizing: border-box;
		pointer-events: auto;
		isolation: isolate;
	}

	.trc-mobile-bar[hidden] {
		display: none !important;
	}

	.trc-mobile-bar__step {
		display: flex;
		flex-direction: column;
		gap: 10px;
		width: 100%;
	}

	.trc-mobile-bar__step[hidden] {
		display: none !important;
	}

	.trc-mobile-bar__step--payment {
		flex-direction: column-reverse;
	}

	.trc-mobile-bar__btn {
		width: 100% !important;
		min-height: 52px !important;
		padding: 14px 20px !important;
		font-size: 16px !important;
		font-weight: 600 !important;
		border-radius: 14px !important;
		touch-action: manipulation;
		-webkit-tap-highlight-color: transparent;
		opacity: 1 !important;
		visibility: visible !important;
	}

	#trc-mobile-step2 {
		flex-direction: column-reverse;
	}

	.trc-form-wrap {
		padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
	}

	.trc-form-wrap .trc-btn--secondary {
		background: var(--trc-m-surface) !important;
		border: 1px solid var(--trc-m-border) !important;
		color: var(--p-text-body) !important;
	}

	.trc-form-wrap .trc-btn--primary:disabled {
		background: #cbd5e1 !important;
		color: #64748b !important;
		opacity: 1 !important;
	}

	.trc-form-wrap .trc-field__textarea:focus,
	.trc-form-wrap .trc-field__select:focus,
	.trc-form-wrap .trc-custom-select__trigger:focus,
	.trc-form-wrap input.trc-field__input--contact:focus {
		box-shadow: 0 0 0 3px rgba(20, 73, 149, 0.18) !important;
		outline: none;
	}

	/* Elementor — prevent clipping */
	.elementor-widget-shortcode .elementor-widget-container,
	.elementor-element .elementor-widget-container,
	.elementor-column:has(.trc-form-wrap) > .elementor-element-populated {
		overflow: visible !important;
	}

	.elementor-widget-shortcode .trc-form-wrap,
	.elementor-element .trc-form-wrap,
	.elementor-widget-container .trc-form-wrap {
		width: 100vw !important;
		max-width: 100vw !important;
		box-sizing: border-box;
	}
}

@media screen and (max-width: 360px) {
	.trc-form-wrap .trc-progress__label {
		font-size: 10px !important;
	}

	.trc-form-wrap .trc-progress__icon svg,
	.trc-form-wrap .trc-progress__icon .trc-icon {
		width: 34px;
		height: 34px;
	}

	.trc-form-wrap .trc-progress__step {
		width: 38px;
		height: 38px;
	}

	.trc-form-wrap .trc-progress__line {
		flex-basis: 24px;
		width: 24px;
		max-width: 24px;
	}
}

/* JS class fallback when viewport meta is missing or touch tablet */
.trc-form-wrap.trc-form-wrap--mobile {
	--trc-m-bg: #f1f5f9;
	--trc-m-surface: #ffffff;
	--trc-m-border: #e2e8f0;
	--trc-m-radius: 16px;
	--trc-m-gap: 14px;
	--trc-m-pad: 16px;
	--trc-m-action-h: 72px;
}

.trc-form-wrap.trc-form-wrap--mobile .trc-form__row,
.trc-form-wrap.trc-form-wrap--mobile .trc-form__row--contact {
	display: flex !important;
	flex-direction: column !important;
}