/* ==========================================================================
   WPForms styling overrides — makes forms match the premium purple theme,
   and fixes the known issue where the first ~3 digits of a phone number sit
   under the country flag icon (WPForms Smart Phone Field / intl-tel-input).
   ========================================================================== */

.wpforms-container {
	max-width: 100%; /* actual width comes from the wrapping .rtq-form-card / .rtq-hero-form, never full browser width */
	font-family: var(--rtq-font-body, 'Inter', sans-serif);
}

.wpforms-container .wpforms-field {
	padding: 10px 0;
}

.wpforms-container label.wpforms-field-label {
	font-weight: 600;
	color: var(--rtq-ink, #111827);
	font-size: 0.92rem;
	margin-bottom: 6px;
}

.wpforms-container input[type=text],
.wpforms-container input[type=email],
.wpforms-container input[type=tel],
.wpforms-container input[type=number],
.wpforms-container input[type=url],
.wpforms-container select,
.wpforms-container textarea {
	width: 100%;
	padding: 12px 14px;
	border: 1.5px solid var(--rtq-border, #E5E1F7);
	border-radius: var(--rtq-radius-sm, 10px);
	font-size: 0.98rem;
	background: #fff;
	transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.wpforms-container input:focus,
.wpforms-container select:focus,
.wpforms-container textarea:focus {
	border-color: var(--rtq-color-primary, #4F46E5);
	box-shadow: 0 0 0 3px rgba(79, 70, 229, 0.15);
	outline: none;
}

/* Dropdowns need extra right padding so text never collides with the arrow icon. */
.wpforms-container select {
	padding-right: 36px;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%234F46E5'%3E%3Cpath d='M5.5 7.5l4.5 4.5 4.5-4.5' stroke='%234F46E5' stroke-width='1.5' fill='none' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
}

/* --- Phone field flag overlap fix ---
   WPForms' Smart Phone field places a country flag icon inside the input's
   left padding area. On many themes the input's own left padding is too
   small, so the first digits get visually hidden behind the flag. We give
   the input generous left padding and pin the flag/dial-code segment so
   they never collide, regardless of screen width. */
.wpforms-container .wpforms-smart-phone-field,
.wpforms-container .iti { width: 100%; }

.wpforms-container .iti input,
.wpforms-container .iti input[type=tel] {
	padding-left: 58px !important;
}

.wpforms-container .iti__flag-container {
	padding: 0;
	inset-inline-start: 6px;
}

.wpforms-container .iti__selected-flag {
	padding: 0 6px 0 8px;
}

@media (max-width: 480px) {
	.wpforms-container .iti input,
	.wpforms-container .iti input[type=tel] {
		padding-left: 52px !important;
	}
}

/* --- Buttons (submit + multi-step Next/Prev) --- */
.wpforms-container button[type=submit],
.wpforms-container .wpforms-submit,
.wpforms-container .wpforms-page-button {
	background: linear-gradient(135deg, var(--rtq-button-bg, #4F46E5), var(--rtq-color-secondary, #7C3AED)) !important;
	color: var(--rtq-button-text, #fff) !important;
	border: none !important;
	border-radius: 999px !important;
	padding: 14px 30px !important;
	font-weight: 700 !important;
	font-size: 1rem !important;
	width: 100%;
	cursor: pointer;
	transition: filter 0.2s ease;
	box-shadow: 0 6px 18px rgba(79, 70, 229, 0.25);
}
.wpforms-container button[type=submit]:hover,
.wpforms-container .wpforms-submit:hover,
.wpforms-container .wpforms-page-button:hover {
	filter: brightness(0.92);
}
.wpforms-container .wpforms-page-prev {
	background: transparent !important;
	color: var(--rtq-color-secondary, #7C3AED) !important;
	border: 2px solid var(--rtq-color-secondary, #7C3AED) !important;
	box-shadow: none;
}
.wpforms-container .wpforms-page-indicator { margin-bottom: 10px; }

/* Guard against duplicate submit buttons if a form config ever double-renders. */
.wpforms-container form .wpforms-submit + .wpforms-submit { display: none !important; }

/* --- Multi-step progress bar --- */
.wpforms-container .wpforms-progress-bar-progress {
	background: linear-gradient(90deg, var(--rtq-color-primary, #4F46E5), var(--rtq-color-secondary, #7C3AED)) !important;
}
.wpforms-container .wpforms-progress-bar-page-title,
.wpforms-container .wpforms-progress-bar-page-title-current {
	color: var(--rtq-color-primary, #4F46E5) !important;
}

/* --- Error states stay legible --- */
.wpforms-container .wpforms-error { color: #DC2626; font-size: 0.85rem; }
.wpforms-container .wpforms-field-container input.wpforms-error,
.wpforms-container .wpforms-field-container select.wpforms-error,
.wpforms-container .wpforms-field-container textarea.wpforms-error {
	border-color: #DC2626;
}

/* --- If a form ID is misconfigured, never show a broken empty box --- */
.rtq-form-missing { padding: 16px; background: var(--rtq-bg-soft, #F7F5FF); border-radius: 8px; text-align: center; }

/* --- Mobile spacing --- */
@media (max-width: 480px) {
	.wpforms-container .wpforms-field { padding: 8px 0; }
	.wpforms-container button[type=submit],
	.wpforms-container .wpforms-submit,
	.wpforms-container .wpforms-page-button { padding: 13px 22px !important; }
}
