.string-form-form {
	--string-form-primary: #203b73;
	--string-form-text: #16213f;
	--string-form-muted: #69738b;
	background: #fff;
	border: 1px solid #e0e4ec;
	border-radius: 10px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	margin: 20px 0;
	max-width: 680px;
	padding: 28px;
}

.string-form-form > h3 {
	color: var(--string-form-text);
	font-size: 24px;
	line-height: 1.3;
	margin: 0 0 24px;
}

.string-form-form-description {
	color: var(--string-form-muted);
	font-size: 14px;
	line-height: 1.55;
	margin: -14px 0 24px;
}

.string-form-field {
	margin-bottom: 18px;
}

.string-form-field-label {
	color: var(--string-form-text);
	display: block;
	font-size: 14px;
	font-weight: 650;
	margin-bottom: 7px;
}

.string-form-field-label span {
	color: #b42318;
}

.string-form-field > input:not([type="checkbox"]):not([type="radio"]),
.string-form-field > textarea,
.string-form-field > select {
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}

.string-form-field > input:focus,
.string-form-field > textarea:focus,
.string-form-field > select:focus {
	border-color: var(--string-form-primary);
	box-shadow: 0 0 0 2px rgba(32, 59, 115, 0.12);
	outline: 0;
}

.string-form-field > textarea {
	min-height: 120px;
	resize: vertical;
}

.string-form-field > small {
	color: var(--string-form-muted);
	display: block;
	font-size: 12px;
	line-height: 1.45;
	margin-top: 6px;
}

.string-form-options {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 22px;
}

.string-form-options label {
	align-items: center;
	color: var(--string-form-text);
	display: inline-flex;
	font-size: 14px;
	gap: 7px;
	margin: 0;
}

.string-form-options input {
	height: 17px;
	margin: 0;
	width: 17px;
}

.string-form-section {
	border-bottom: 1px solid #c3cad8;
	margin: 26px 0 18px;
	padding-bottom: 10px;
}

.string-form-section h4 {
	color: var(--string-form-text);
	font-size: 19px;
	margin: 0;
}

.string-form-section p {
	color: var(--string-form-muted);
	font-size: 13px;
	margin: 5px 0 0;
}

.string-form-html {
	color: var(--string-form-text);
	font-size: 14px;
	line-height: 1.55;
	margin: 18px 0;
}

.string-form-page-actions button {
	background: var(--string-form-primary);
	border: 1px solid var(--string-form-primary);
	border-radius: 6px;
	color: #fff;
	cursor: pointer;
	font: inherit;
	font-weight: 650;
	min-height: 44px;
	padding: 10px 22px;
}

.string-form-page-actions button:hover,
.string-form-page-actions button:focus {
	background: #142d61;
	border-color: #142d61;
}

.string-form-page-actions {
	display: flex;
	gap: 10px;
	justify-content: flex-end;
	margin-top: 22px;
}

.string-form-page-actions .string-form-button-secondary {
	background: #fff;
	border-color: #9ca7bb;
	color: var(--string-form-text);
	margin-right: auto;
}

.string-form-page-actions .string-form-button-secondary:hover,
.string-form-page-actions .string-form-button-secondary:focus {
	background: #f4f6fa;
	border-color: var(--string-form-primary);
}

.string-form-form-page[hidden],
.string-form-field[hidden] {
	display: none;
}

.string-form-page-title {
	font-size: 19px;
	margin: 0 0 20px;
}

.string-form-progress {
	align-items: center;
	display: flex;
	gap: 12px;
	margin: 0 0 24px;
}

.string-form-progress-bar {
	background: #e7eaf0;
	border-radius: 999px;
	display: block;
	flex: 1;
	height: 6px;
	overflow: hidden;
}

.string-form-progress-bar > span {
	background: var(--string-form-primary);
	display: block;
	height: 100%;
	transition: width 180ms ease;
	width: 0;
}

.string-form-progress small {
	color: var(--string-form-muted);
	font-size: 12px;
}

.string-form-compound {
	border: 0;
	margin: 0;
	padding: 0;
}

.string-form-compound-grid {
	display: grid;
	gap: 12px;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.string-form-compound-grid--2 {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.string-form-compound-grid label {
	color: var(--string-form-muted);
	font-size: 12px;
}

.string-form-compound-grid label > span {
	display: block;
	margin-bottom: 5px;
}

.string-form-compound-grid input {
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}

.string-form-address-street,
.string-form-address-line2,
.string-form-address-country {
	grid-column: 1 / -1;
}

.string-form-consent {
	align-items: flex-start;
	color: var(--string-form-text);
	display: flex;
	font-size: 14px;
	gap: 9px;
}

.string-form-consent input {
	margin-top: 3px;
}

.string-form-honeypot {
	left: -9999px;
	position: absolute;
}

.string-form-notice {
	border-radius: 6px;
	margin: 16px 0;
	max-width: 680px;
	padding: 12px 16px;
}

.string-form-notice--success {
	background: #edfaef;
	color: #176b2c;
}

.string-form-notice--error {
	background: #fff0f0;
	color: #9b1c1c;
}

@media (max-width: 640px) {
	.string-form-form {
		padding: 20px;
	}

	.string-form-options {
		flex-direction: column;
		gap: 10px;
	}

	.string-form-compound-grid,
	.string-form-compound-grid--2 {
		grid-template-columns: 1fr;
	}

	.string-form-address-street,
	.string-form-address-line2,
	.string-form-address-country {
		grid-column: auto;
	}
}

/* Phone input with country flag/calling-code selector. */
.string-form-phone-control {
	align-items: stretch;
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	display: flex;
	min-height: 44px;
	overflow: hidden;
	transition: border-color 120ms ease, box-shadow 120ms ease;
	width: 100%;
}

.string-form-phone-control:focus-within {
	border-color: var(--string-form-primary);
	box-shadow: 0 0 0 2px rgba(32, 59, 115, 0.12);
}

.string-form-phone-country {
	background: #f4f5f7;
	border-inline-end: 1px solid #d9dde5;
	flex: 0 0 auto;
	min-width: 104px;
	position: relative;
}

.string-form-phone-country-display {
	align-items: center;
	box-sizing: border-box;
	display: flex;
	gap: 6px;
	height: 100%;
	justify-content: center;
	min-height: 44px;
	padding: 0 10px;
	pointer-events: none;
	white-space: nowrap;
}

.string-form-phone-country-display [data-string-form-country-flag] {
	font-size: 18px;
	line-height: 1;
}

.string-form-phone-country-display [data-string-form-country-dial] {
	color: #445069;
	font-size: 13px;
	font-weight: 600;
}

.string-form-phone-chevron {
	color: #778197;
	font-size: 11px;
	line-height: 1;
}

.string-form-phone-country-select {
	cursor: pointer;
	height: 100%;
	inset: 0;
	margin: 0;
	opacity: 0;
	position: absolute;
	width: 100%;
	z-index: 2;
}

.string-form-phone-control > input[type="tel"] {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	box-sizing: border-box;
	color: var(--string-form-text);
	flex: 1 1 auto;
	font: inherit;
	min-height: 44px;
	min-width: 0;
	outline: 0;
	padding: 10px 12px;
	width: auto;
}

.string-form-phone-control > input[type="tel"]:focus {
	border: 0;
	box-shadow: none;
	outline: 0;
}

@media (max-width: 480px) {
	.string-form-phone-country {
		min-width: 92px;
	}

	.string-form-phone-country-display {
		gap: 5px;
		padding-inline: 8px;
	}
}

/* Phase 1 layout widths and new String field types */
.string-form-form-page {
	display: flex;
	flex-wrap: wrap;
	column-gap: 16px;
}
.string-form-form-page > .string-form-field {
	box-sizing: border-box;
	flex: 0 0 calc(var(--string-form-field-width, 100%) - 8px);
	max-width: calc(var(--string-form-field-width, 100%) - 8px);
}
.string-form-form-page > .string-form-page-actions,
.string-form-form-page > .string-form-page-title { flex: 0 0 100%; max-width:100%; }
.string-form-file-drop {
	align-items: center;
	border: 1px dashed #b9c5d5;
	border-radius: 8px;
	cursor: pointer;
	display: flex;
	flex-direction: column;
	gap: 5px;
	justify-content: center;
	min-height: 110px;
	padding: 18px;
	text-align: center;
}
.string-form-file-drop input { max-width: 100%; }
.string-form-file-drop .dashicons { color:#0876ed; font-size:24px; width:24px; height:24px; }
.string-form-file-drop small { color:#7c8798; }
.string-form-boolean-control { display:flex; align-items:center; gap:9px; }
.string-form-switch-control input { appearance:none; width:38px; height:20px; border-radius:20px; background:#cbd3df; position:relative; cursor:pointer; }
.string-form-switch-control input:after { content:""; position:absolute; width:16px; height:16px; border-radius:50%; background:#fff; top:2px; left:2px; transition:.15s ease; }
.string-form-switch-control input:checked { background:#0876ed; }
.string-form-switch-control input:checked:after { transform:translateX(18px); }
.string-form-rating { display:flex; flex-direction:row-reverse; justify-content:flex-end; gap:2px; }
.string-form-rating input { position:absolute; opacity:0; }
.string-form-rating span { color:#cdd4df; cursor:pointer; font-size:28px; }
.string-form-rating label:has(input:checked) span,
.string-form-rating label:has(input:checked) ~ label span { color:#f5a623; }
.string-form-cover { background:#f5f9ff; border:1px solid #dbe9fb; border-radius:10px; padding:20px; }
.string-form-static-text { color:var(--string-form-text); }
.string-form-grid-marker { min-height:1px; }
@media (max-width: 640px) {
	.string-form-form-page > .string-form-field { flex-basis:100%; max-width:100%; }
}

/* 1.7.0 - modern label placement, choice groups and searchable selects */
.string-form-label-placement--hide_label > .string-form-field-label,
.string-form-label-placement--hide_label > fieldset > legend {
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	height: 1px;
	overflow: hidden;
	position: absolute;
	white-space: nowrap;
	width: 1px;
}
.string-form-label-placement--bottom {
	display: flex;
	flex-direction: column;
}
.string-form-label-placement--bottom > .string-form-field-label {
	margin: 7px 0 0;
	order: 2;
}
.string-form-label-placement--bottom > input:not([type="checkbox"]):not([type="radio"]),
.string-form-label-placement--bottom > textarea,
.string-form-label-placement--bottom > select,
.string-form-label-placement--bottom > .string-form-searchable-wrap,
.string-form-label-placement--bottom > .string-form-options,
.string-form-label-placement--bottom > .string-form-phone-control,
.string-form-label-placement--bottom > .string-form-input-icon-wrap,
.string-form-label-placement--bottom > .string-form-compound,
.string-form-label-placement--bottom > .string-form-file-drop,
.string-form-label-placement--bottom > fieldset {
	order: 1;
}
.string-form-label-placement--bottom > small { order: 3; }
.string-form-label-placement--left,
.string-form-label-placement--right {
	align-items: start;
	display: grid;
	gap: 7px 14px;
	grid-template-columns: minmax(110px, 30%) minmax(0, 1fr);
}
.string-form-label-placement--left > .string-form-field-label {
	grid-column: 1;
	margin: 11px 0 0;
}
.string-form-label-placement--left > input:not([type="checkbox"]):not([type="radio"]),
.string-form-label-placement--left > textarea,
.string-form-label-placement--left > select,
.string-form-label-placement--left > .string-form-searchable-wrap,
.string-form-label-placement--left > .string-form-options,
.string-form-label-placement--left > .string-form-phone-control,
.string-form-label-placement--left > .string-form-input-icon-wrap,
.string-form-label-placement--left > .string-form-compound,
.string-form-label-placement--left > .string-form-file-drop,
.string-form-label-placement--left > fieldset {
	grid-column: 2;
}
.string-form-label-placement--left > small { grid-column: 2; }
.string-form-label-placement--right > .string-form-field-label {
	grid-column: 2;
	grid-row: 1;
	margin: 11px 0 0;
}
.string-form-label-placement--right > input:not([type="checkbox"]):not([type="radio"]),
.string-form-label-placement--right > textarea,
.string-form-label-placement--right > select,
.string-form-label-placement--right > .string-form-searchable-wrap,
.string-form-label-placement--right > .string-form-options,
.string-form-label-placement--right > .string-form-phone-control,
.string-form-label-placement--right > .string-form-input-icon-wrap,
.string-form-label-placement--right > .string-form-compound,
.string-form-label-placement--right > .string-form-file-drop,
.string-form-label-placement--right > fieldset {
	grid-column: 1;
	grid-row: 1;
}
.string-form-label-placement--right > small { grid-column: 1; }
.string-form-option-group-label {
	color: var(--string-form-muted);
	display: block;
	flex-basis: 100%;
	font-size: 12px;
	font-weight: 700;
	margin: 4px 0 -3px;
	width: 100%;
}
.string-form-searchable-wrap {
	box-sizing: border-box;
	display: grid;
	gap: 7px;
	width: 100%;
}
.string-form-searchable-input {
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font: inherit;
	min-height: 40px;
	padding: 9px 12px;
	width: 100%;
}
.string-form-searchable-input:focus,
.string-form-searchable-wrap select:focus {
	border-color: var(--string-form-primary);
	box-shadow: 0 0 0 2px rgba(32, 59, 115, 0.12);
	outline: 0;
}
.string-form-searchable-wrap select {
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}
@media (max-width: 640px) {
	.string-form-label-placement--left,
	.string-form-label-placement--right {
		display: block;
	}
	.string-form-label-placement--left > .string-form-field-label,
	.string-form-label-placement--right > .string-form-field-label {
		margin: 0 0 7px;
	}
}
/* Compound Name/Address fields also honor label placement. */
.string-form-label-placement--left > fieldset.string-form-compound,
.string-form-label-placement--right > fieldset.string-form-compound {
	display: grid;
	gap: 7px 14px;
	grid-column: 1 / -1;
	grid-template-columns: minmax(110px, 30%) minmax(0, 1fr);
}
.string-form-label-placement--left > fieldset.string-form-compound > legend {
	grid-column: 1;
	margin: 11px 0 0;
}
.string-form-label-placement--left > fieldset.string-form-compound > .string-form-compound-grid,
.string-form-label-placement--left > fieldset.string-form-compound > small { grid-column: 2; }
.string-form-label-placement--right > fieldset.string-form-compound > legend {
	grid-column: 2;
	grid-row: 1;
	margin: 11px 0 0;
}
.string-form-label-placement--right > fieldset.string-form-compound > .string-form-compound-grid {
	grid-column: 1;
	grid-row: 1;
}
.string-form-label-placement--right > fieldset.string-form-compound > small { grid-column: 1; }
.string-form-label-placement--bottom > fieldset.string-form-compound {
	display: flex;
	flex-direction: column;
}
.string-form-label-placement--bottom > fieldset.string-form-compound > legend {
	margin: 7px 0 0;
	order: 2;
}
.string-form-label-placement--bottom > fieldset.string-form-compound > .string-form-compound-grid { order: 1; }
.string-form-label-placement--bottom > fieldset.string-form-compound > small { order: 3; }
@media (max-width: 640px) {
	.string-form-label-placement--left > fieldset.string-form-compound,
	.string-form-label-placement--right > fieldset.string-form-compound { display: block; }
	.string-form-label-placement--left > fieldset.string-form-compound > legend,
	.string-form-label-placement--right > fieldset.string-form-compound > legend { margin: 0 0 7px; }
}


/* 1.7.7 - Optional icons inside text-like inputs */
.string-form-input-icon-wrap {
	box-sizing: border-box;
	display: block;
	position: relative;
	width: 100%;
}
.string-form-input-icon-wrap > .string-form-input-icon {
	color: #7d8798;
	height: 18px;
	line-height: 18px;
	margin: 0;
	pointer-events: none;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
	z-index: 2;
}
.string-form-input-icon--start > .string-form-input-icon { inset-inline-start: 12px; }
.string-form-input-icon--end > .string-form-input-icon { inset-inline-end: 12px; }
.string-form-input-icon-wrap > input:not([type="checkbox"]):not([type="radio"]),
.string-form-input-icon-wrap > textarea {
	background: #fff;
	border: 1px solid #c8ceda;
	border-radius: 6px;
	box-sizing: border-box;
	color: var(--string-form-text);
	font: inherit;
	min-height: 44px;
	padding: 10px 12px;
	width: 100%;
}
.string-form-input-icon--start > input:not([type="checkbox"]):not([type="radio"]),
.string-form-input-icon--start > textarea { padding-inline-start: 40px; }
.string-form-input-icon--end > input:not([type="checkbox"]):not([type="radio"]),
.string-form-input-icon--end > textarea { padding-inline-end: 40px; }
.string-form-input-icon-wrap > input:focus,
.string-form-input-icon-wrap > textarea:focus {
	border-color: var(--string-form-primary);
	box-shadow: 0 0 0 2px rgba(32, 59, 115, 0.12);
	outline: 0;
}
.string-form-input-icon-wrap:focus-within > .string-form-input-icon { color: var(--string-form-primary); }
.string-form-input-icon-wrap--textarea > .string-form-input-icon {
	top: 14px;
	transform: none;
}
.string-form-input-icon-wrap--textarea > textarea {
	min-height: 120px;
	resize: vertical;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone {
	flex: 1 1 auto;
	min-width: 0;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone > input[type="tel"] {
	background: transparent;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	min-height: 44px;
	outline: 0;
	width: 100%;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone > input[type="tel"]:focus {
	border: 0;
	box-shadow: none;
	outline: 0;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone > .string-form-input-icon { z-index: 3; }


/* 1.7.9 - Outline input icons */
.string-form-input-icon,
.string-form-preview-input-icon {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.string-form-input-icon::before,
.string-form-preview-input-icon::before {
	background-color: currentColor;
	content: "";
	display: block;
	height: 18px;
	width: 18px;
	-webkit-mask: var(--string-form-input-icon-mask) center / contain no-repeat;
	mask: var(--string-form-input-icon-mask) center / contain no-repeat;
}
.string-form-input-icon[data-string-form-icon="user"], .string-form-preview-input-icon[data-string-form-icon="user"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M20%2021a8%208%200%200%200-16%200%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%228%22%20r%3D%224%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="email"], .string-form-preview-input-icon[data-string-form-icon="email"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22m4%207%208%206%208-6%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="phone"], .string-form-preview-input-icon[data-string-form-icon="phone"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M22%2016.92v3a2%202%200%200%201-2.18%202%2019.79%2019.79%200%200%201-8.63-3.07%2019.5%2019.5%200%200%201-6-6A19.79%2019.79%200%200%201%202.12%204.18%202%202%200%200%201%204.11%202h3a2%202%200%200%201%202%201.72c.12.9.33%201.77.63%202.6a2%202%200%200%201-.45%202.11L8%209.89a16%2016%200%200%200%206.11%206.11l1.46-1.29a2%202%200%200%201%202.11-.45c.83.3%201.7.51%202.6.63A2%202%200%200%201%2022%2016.92Z%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="company"], .string-form-preview-input-icon[data-string-form-icon="company"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M3%2021h18%22%2F%3E%3Cpath%20d%3D%22M5%2021V7a2%202%200%200%201%202-2h10a2%202%200%200%201%202%202v14%22%2F%3E%3Cpath%20d%3D%22M9%209h.01M9%2013h.01M9%2017h.01M15%209h.01M15%2013h.01M15%2017h.01%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="calendar"], .string-form-preview-input-icon[data-string-form-icon="calendar"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M16%202v4M8%202v4M3%2010h18%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="clock"], .string-form-preview-input-icon[data-string-form-icon="clock"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2212%22%20r%3D%229%22%2F%3E%3Cpath%20d%3D%22M12%207v5l3%202%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="link"], .string-form-preview-input-icon[data-string-form-icon="link"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M10%2013a5%205%200%200%200%207.07%200l2.83-2.83a5%205%200%201%200-7.07-7.07L11%204%22%2F%3E%3Cpath%20d%3D%22M14%2011a5%205%200%200%200-7.07%200L4.1%2013.83a5%205%200%201%200%207.07%207.07L13%2020%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="lock"], .string-form-preview-input-icon[data-string-form-icon="lock"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%224%22%20y%3D%2211%22%20width%3D%2216%22%20height%3D%2210%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M8%2011V7a4%204%200%201%201%208%200v4%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="location"], .string-form-preview-input-icon[data-string-form-icon="location"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M12%2021s-6-4.35-6-10a6%206%200%201%201%2012%200c0%205.65-6%2010-6%2010Z%22%2F%3E%3Ccircle%20cx%3D%2212%22%20cy%3D%2211%22%20r%3D%222.5%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="search"], .string-form-preview-input-icon[data-string-form-icon="search"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Ccircle%20cx%3D%2211%22%20cy%3D%2211%22%20r%3D%227%22%2F%3E%3Cpath%20d%3D%22m20%2020-3.5-3.5%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="id"], .string-form-preview-input-icon[data-string-form-icon="id"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%225%22%20width%3D%2218%22%20height%3D%2214%22%20rx%3D%222%22%2F%3E%3Ccircle%20cx%3D%228.5%22%20cy%3D%2212%22%20r%3D%222%22%2F%3E%3Cpath%20d%3D%22M14%2010h4M14%2014h4M6%2016.5c.7-1.3%202-2%203.5-2s2.8.7%203.5%202%22%2F%3E%3C%2Fsvg%3E"); }
.string-form-input-icon[data-string-form-icon="briefcase"], .string-form-preview-input-icon[data-string-form-icon="briefcase"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%227%22%20width%3D%2218%22%20height%3D%2213%22%20rx%3D%222%22%2F%3E%3Cpath%20d%3D%22M9%207V5a2%202%200%200%201%202-2h2a2%202%200%200%201%202%202v2%22%2F%3E%3Cpath%20d%3D%22M3%2012h18%22%2F%3E%3C%2Fsvg%3E"); }


/* 1.8.0 - Call time slot picker */
.string-form-slot-picker { position: relative; }
.string-form-slot-trigger {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 58px;
	padding: 12px 52px 12px 14px;
	border: 1.5px solid #d8dde6;
	border-radius: 12px;
	background: #fff;
	cursor: pointer;
	transition: border-color .18s ease, box-shadow .18s ease;
}
.string-form-slot-trigger:focus-within,
.string-form-slot-trigger:hover {
	border-color: var(--string-form-primary);
	box-shadow: 0 0 0 3px rgba(32,59,115,.10);
}
.string-form-slot-trigger-head {
	position: absolute;
	top: -8px;
	inset-inline-start: 12px;
	padding: 0 6px;
	background: #fff;
	color: var(--string-form-primary);
	font-size: 12px;
	font-weight: 600;
	line-height: 1;
}
.string-form-slot-display {
	-webkit-appearance: none !important;
	appearance: none !important;
	width: 100% !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
	color: #1e2430;
	font: inherit;
	line-height: 1.4;
	cursor: pointer;
}
.string-form-slot-display:hover,
.string-form-slot-display:focus,
.string-form-slot-display:focus-visible {
	border: 0 !important;
	box-shadow: none !important;
	outline: 0 !important;
	background: transparent !important;
}
.string-form-slot-display::placeholder { color: #9aa3b1; opacity: 1; }
.string-form-slot-trigger-icon {
	position: absolute;
	inset-inline-end: 14px;
	top: 50%;
	transform: translateY(-50%);
	color: #202632;
	width: 20px;
	height: 20px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.string-form-slot-trigger-icon[data-string-form-icon="calendar"] { --string-form-input-icon-mask: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22black%22%20stroke-width%3D%221.8%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Crect%20x%3D%223%22%20y%3D%224%22%20width%3D%2218%22%20height%3D%2218%22%20rx%3D%222%22/%3E%3Cpath%20d%3D%22M16%202v4M8%202v4M3%2010h18%22/%3E%3C/svg%3E"); }
.string-form-slot-trigger-icon::before {
	content: "";
	display: block;
	width: 18px;
	height: 18px;
	background-color: currentColor;
	-webkit-mask: var(--string-form-input-icon-mask) center / contain no-repeat;
	mask: var(--string-form-input-icon-mask) center / contain no-repeat;
}
.string-form-slot-popover {
	position: absolute;
	inset-inline-start: 0;
	top: calc(100% + 12px);
	z-index: 30;
	width: min(100%, 440px);
	border: 1px solid #e5e7ec;
	border-radius: 16px;
	background: #fff;
	box-shadow: 0 20px 46px rgba(15, 23, 42, .14);
	overflow: hidden;
}
.string-form-slot-popover-inner {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 110px;
	min-height: 320px;
}
.string-form-slot-calendar { padding: 16px 14px 18px; }
.string-form-slot-toolbar {
	display: grid;
	grid-template-columns: 36px minmax(0, 1fr) 36px;
	align-items: center;
	gap: 10px;
	margin-bottom: 16px;
}
.string-form-slot-toolbar-center { display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap; }
.string-form-slot-toolbar-center strong { color: #232938; font-size: 18px; font-weight: 700; }
.string-form-slot-toolbar-center span { color: #4f5563; font-size: 13px; font-weight: 500; }
.string-form-slot-nav {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 36px;
	height: 36px;
	border: 1px solid #dadddf;
	border-radius: 10px;
	background: #fff;
	color: #1f2937;
	font-size: 22px;
	cursor: pointer;
}
.string-form-slot-weekdays, .string-form-slot-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8px; }
.string-form-slot-weekdays { margin-bottom: 10px; }
.string-form-slot-weekdays span { text-align: center; color: #8d94a3; font-size: 12px; font-weight: 600; }
.string-form-slot-day {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	margin-inline: auto;
	border: 1px solid transparent;
	border-radius: 999px;
	background: transparent;
	color: #222938;
	font-size: 15px;
	font-weight: 500;
	cursor: pointer;
}
.string-form-slot-day.is-today { border-color: #cfd6df; }
.string-form-slot-day.is-selected { background: var(--string-form-primary); border-color: var(--string-form-primary); color: #fff; }
.string-form-slot-day.is-disabled { color: #c2c7d0; cursor: not-allowed; }
.string-form-slot-day.is-empty { width: 40px; height: 40px; }
.string-form-slot-times { border-inline-start: 1px solid #eceef2; background: #fbfcfd; padding: 12px; overflow: auto; }
.string-form-slot-times-list { display: flex; flex-direction: column; gap: 10px; max-height: 312px; overflow: auto; padding-inline-end: 2px; }
.string-form-slot-time {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 46px;
	padding: 10px 12px;
	border: 1.5px solid #303541;
	border-radius: 12px;
	background: #fff;
	color: #262d39;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}
.string-form-slot-time.is-selected { background: var(--string-form-primary); border-color: var(--string-form-primary); color: #fff; }
.string-form-slot-time.is-disabled { border-color: #d8dde6; color: #b6bcc7; background: #f8f9fb; cursor: not-allowed; }
.string-form-slot-empty { display: grid; place-items: center; min-height: 100%; color: #8a92a3; font-size: 13px; text-align: center; padding: 20px 12px; }
@media (max-width: 782px) {
	.string-form-slot-popover {
		position: static !important;
		width: 100% !important;
		margin-top: 14px !important;
		border: 0 !important;
		border-radius: 0 !important;
		background: transparent !important;
		box-shadow: none !important;
		overflow: visible !important;
		left: auto !important;
		right: auto !important;
		transform: none !important;
	}
	.string-form-slot-popover-inner {
		display: grid !important;
		grid-template-columns: 1fr !important;
		gap: 14px !important;
		min-height: 0 !important;
	}
	.string-form-slot-calendar {
		width: 100% !important;
		padding: 18px 16px !important;
		border-radius: 24px !important;
		background: #f5f7fb !important;
	}
	.string-form-slot-toolbar {
		grid-template-columns: 40px minmax(0, 1fr) 40px !important;
		gap: 8px !important;
		margin-bottom: 18px !important;
	}
	.string-form-slot-toolbar-center {
		justify-content: center !important;
	}
	.string-form-slot-toolbar-center strong {
		font-size: 18px !important;
	}
	.string-form-slot-toolbar-center span {
		display: none !important;
	}
	.string-form-slot-nav {
		width: 40px !important;
		height: 40px !important;
		border: 0 !important;
		background: transparent !important;
		color: var(--string-form-primary) !important;
		font-size: 30px !important;
		padding: 0 !important;
	}
	.string-form-slot-weekdays {
		margin-bottom: 12px !important;
	}
	.string-form-slot-weekdays span {
		font-size: 13px !important;
		font-weight: 500 !important;
		color: #242938 !important;
	}
	.string-form-slot-days {
		gap: 10px 8px !important;
	}
	.string-form-slot-day,
	.string-form-slot-day.is-empty {
		width: 42px !important;
		height: 42px !important;
	}
	.string-form-slot-day {
		font-size: 15px !important;
	}
	.string-form-slot-day.is-selected {
		box-shadow: 0 8px 18px rgba(50,41,199,.18) !important;
	}
	.string-form-slot-times {
		width: 100% !important;
		border-inline-start: 0 !important;
		border-top: 0 !important;
		background: transparent !important;
		padding: 0 !important;
		overflow: visible !important;
	}
	.string-form-slot-times-list {
		display: grid !important;
		grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
		gap: 12px !important;
		max-height: none !important;
		overflow: visible !important;
		padding-inline-end: 0 !important;
	}
	.string-form-slot-time {
		min-height: 54px !important;
		padding: 12px 8px !important;
		border: 0 !important;
		border-radius: 16px !important;
		background: #f2f4f8 !important;
		color: #2f3850 !important;
		font-size: 15px !important;
		font-weight: 600 !important;
	}
	.string-form-slot-time.is-selected {
		background: var(--string-form-primary) !important;
		color: #fff !important;
	}
	.string-form-slot-time.is-disabled {
		background: #f5f6f8 !important;
		color: #b6bcc7 !important;
	}
	.string-form-slot-empty {
		min-height: 72px !important;
		border-radius: 16px !important;
		background: #f5f7fb !important;
	}
}

.string-form-slot-picker--up .string-form-slot-popover {
	top: auto;
	bottom: calc(100% + 12px);
}


/* 1.8.2 - clean String-blue slot picker */
.string-form-slot-picker .string-form-slot-trigger-head {
	color: var(--string-form-primary) !important;
}
.string-form-slot-picker .string-form-slot-trigger:hover,
.string-form-slot-picker .string-form-slot-trigger:focus-within {
	border-color: var(--string-form-primary) !important;
	box-shadow: 0 0 0 3px rgba(32,59,115,.10) !important;
}
.string-form-slot-picker .string-form-slot-day.is-selected,
.string-form-slot-picker .string-form-slot-time.is-selected {
	background: var(--string-form-primary) !important;
	border-color: var(--string-form-primary) !important;
	color: #fff !important;
}
.string-form-slot-picker .string-form-slot-display,
.string-form-slot-picker .string-form-slot-display:hover,
.string-form-slot-picker .string-form-slot-display:focus,
.string-form-slot-picker .string-form-slot-display:focus-visible {
	-webkit-appearance: none !important;
	appearance: none !important;
	min-height: 0 !important;
	height: auto !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: transparent !important;
	box-shadow: none !important;
	outline: 0 !important;
}


/* 1.8.3 - RTL/LTR popup anchoring */
html[dir="rtl"] .string-form-slot-picker .string-form-slot-popover,
body.rtl .string-form-slot-picker .string-form-slot-popover {
	right: 0;
	left: auto;
	inset-inline-start: auto;
	inset-inline-end: auto;
	transform: none;
}
html[dir="ltr"] .string-form-slot-picker .string-form-slot-popover,
html:not([dir="rtl"]) .string-form-slot-picker .string-form-slot-popover {
	left: 0;
	right: auto;
	inset-inline-start: auto;
	inset-inline-end: auto;
	transform: none;
}
@media (max-width: 782px) {
	html[dir="rtl"] .string-form-slot-picker .string-form-slot-popover,
	body.rtl .string-form-slot-picker .string-form-slot-popover,
	html[dir="ltr"] .string-form-slot-picker .string-form-slot-popover,
	html:not([dir="rtl"]) .string-form-slot-picker .string-form-slot-popover {
		right: auto;
		left: auto;
	}
}


/* 1.8.8 - Force phone/picker icon alignment */
.string-form-phone-control {
	direction: ltr;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone > .string-form-input-icon {
	left: auto !important;
	right: 12px !important;
	inset-inline-start: auto !important;
	inset-inline-end: auto !important;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone > input[type="tel"] {
	padding-left: 12px !important;
	padding-right: 40px !important;
	text-align: left;
}
.string-form-phone-control > .string-form-input-icon-wrap--phone.string-form-input-icon--start > .string-form-input-icon,
.string-form-phone-control > .string-form-input-icon-wrap--phone.string-form-input-icon--end > .string-form-input-icon {
	left: auto !important;
	right: 12px !important;
}
.string-form-slot-trigger-icon {
	left: auto !important;
	right: 14px !important;
	inset-inline-start: auto !important;
	inset-inline-end: auto !important;
}
.string-form-slot-trigger {
	padding-left: 14px !important;
	padding-right: 52px !important;
}
.string-form-slot-display {
	text-align: inherit;
}


/* 1.8.9 - Picker icon positioning polish */
.string-form-slot-trigger {
	position: relative;
	align-items: center !important;
	justify-content: flex-start !important;
}
.string-form-slot-display {
	width: 100% !important;
	padding-inline-end: 34px !important;
	padding-inline-start: 0 !important;
}
html[dir="rtl"] .string-form-slot-display,
body.rtl .string-form-slot-display {
	text-align: right !important;
}
html[dir="ltr"] .string-form-slot-display,
html:not([dir="rtl"]) .string-form-slot-display {
	text-align: left !important;
}
.string-form-slot-trigger-icon {
	position: absolute !important;
	top: 50% !important;
	right: 16px !important;
	left: auto !important;
	transform: translateY(-50%) !important;
	inset-inline-start: auto !important;
	inset-inline-end: auto !important;
	pointer-events: none !important;
	z-index: 2 !important;
}
.string-form-slot-trigger-icon::before {
	display: block;
}
.string-form-slot-trigger-head {
	max-width: calc(100% - 48px);
}


/* 1.9.0 - remove picker floating caption */
.string-form-slot-trigger-head {
	display: none !important;
}


/* 1.9.1 - Match picker icon position with other inputs */
.string-form-slot-trigger {
	min-height: 44px !important;
	padding: 10px 40px 10px 12px !important;
}
.string-form-slot-display {
	padding: 0 !important;
	padding-inline-start: 0 !important;
	padding-inline-end: 0 !important;
	line-height: 1.4 !important;
}
.string-form-slot-trigger-icon {
	width: 18px !important;
	height: 18px !important;
	right: 12px !important;
	left: auto !important;
	color: #7d8798 !important;
}
.string-form-slot-trigger-icon::before {
	width: 18px !important;
	height: 18px !important;
}
.string-form-slot-trigger:focus-within .string-form-slot-trigger-icon,
.string-form-slot-trigger:hover .string-form-slot-trigger-icon {
	color: var(--string-form-primary) !important;
}
html[dir="rtl"] .string-form-slot-trigger,
body.rtl .string-form-slot-trigger {
	padding-right: 40px !important;
	padding-left: 12px !important;
}
html[dir="ltr"] .string-form-slot-trigger,
html:not([dir="rtl"]) .string-form-slot-trigger {
	padding-right: 40px !important;
	padding-left: 12px !important;
}


/* 1.9.2 - Picker toolbar spacing and centered month */
.string-form-slot-toolbar {
	grid-template-columns: 36px minmax(0, 1fr) 36px !important;
	gap: 8px !important;
	padding-inline: 3px !important;
}
.string-form-slot-toolbar-center {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	text-align: center !important;
	gap: 0 !important;
}
.string-form-slot-toolbar-center strong {
	display: block !important;
	width: 100% !important;
	text-align: center !important;
	margin: 0 auto !important;
}
.string-form-slot-toolbar-center span {
	display: none !important;
}
.string-form-slot-nav {
	margin: 0 2px !important;
}
html[dir="rtl"] .string-form-slot-toolbar-center,
body.rtl .string-form-slot-toolbar-center {
	justify-content: center !important;
}


/* 1.9.8 - Stable desktop-above picker + English calendar safety */
@media (min-width: 783px) {
	.string-form-slot-picker .string-form-slot-popover {
		top: auto !important;
		bottom: calc(100% + 12px) !important;
	}
}


/* 1.10.0 - Language-aware labels + submit button controls */
.string-form-form[dir="ltr"] .string-form-field-label,
.string-form-form[dir="ltr"] fieldset > legend {
	direction: ltr !important;
	text-align: left !important;
}
.string-form-form[dir="rtl"] .string-form-field-label,
.string-form-form[dir="rtl"] fieldset > legend {
	direction: rtl !important;
	text-align: right !important;
}
.string-form-page-actions .string-form-submit-button {
	align-items: center;
	background: var(--string-form-submit-bg, var(--string-form-primary)) !important;
	border-color: var(--string-form-submit-bg, var(--string-form-primary)) !important;
	color: var(--string-form-submit-color, #fff) !important;
	display: inline-flex;
	gap: 8px;
	justify-content: center;
	max-width: 100%;
	width: var(--string-form-submit-width, auto);
}
.string-form-page-actions .string-form-submit-button:hover,
.string-form-page-actions .string-form-submit-button:focus {
	background: var(--string-form-submit-bg, var(--string-form-primary)) !important;
	border-color: var(--string-form-submit-bg, var(--string-form-primary)) !important;
	color: var(--string-form-submit-color, #fff) !important;
	filter: brightness(.92);
}
.string-form-submit-icon {
	color: currentColor !important;
	display: inline-flex !important;
	flex: 0 0 18px;
	height: 18px !important;
	position: static !important;
	transform: none !important;
	width: 18px !important;
}
.string-form-submit-icon::before {
	background-color: currentColor !important;
	height: 18px !important;
	width: 18px !important;
}
.string-form-submit-label {
	line-height: 1.2;
}


/* 1.10.5 - Form + input surface controls (solid / transparent / glass) */
.string-form-form {
	background: var(--string-form-form-bg, #fff) !important;
	border: var(--string-form-form-border-width, 1px) solid var(--string-form-form-border-color, #e0e4ec) !important;
	border-radius: var(--string-form-form-radius, 10px) !important;
	box-shadow: var(--string-form-form-shadow, none) !important;
	color: var(--string-form-text, #16213f) !important;
	-webkit-backdrop-filter: blur(var(--string-form-form-blur, 0px));
	backdrop-filter: blur(var(--string-form-form-blur, 0px));
}

.string-form-surface--none {
	--string-form-form-bg: transparent;
	--string-form-form-border-color: transparent;
	--string-form-form-blur: 0px;
	border: 0 !important;
	box-shadow: none !important;
}
.string-form-surface--solid {
	--string-form-form-bg: var(--string-form-form-solid-bg);
	--string-form-form-border-color: var(--string-form-form-solid-border);
	--string-form-form-blur: 0px;
}
.string-form-surface--transparent {
	--string-form-form-bg: var(--string-form-form-transparent-bg);
	--string-form-form-border-color: var(--string-form-form-soft-border);
	--string-form-form-blur: 0px;
}
.string-form-surface--glass {
	--string-form-form-bg: var(--string-form-form-glass-bg);
	--string-form-form-border-color: var(--string-form-form-soft-border);
	--string-form-form-blur: var(--string-form-form-glass-blur);
}

.string-form-input-surface--solid,
.string-form-field-input-surface--solid {
	--string-form-input-bg: var(--string-form-input-solid-bg);
	--string-form-input-border-color-active: var(--string-form-input-solid-border);
	--string-form-input-blur: 0px;
}
.string-form-input-surface--transparent,
.string-form-field-input-surface--transparent {
	--string-form-input-bg: var(--string-form-input-transparent-bg);
	--string-form-input-border-color-active: var(--string-form-input-soft-border);
	--string-form-input-blur: 0px;
}
.string-form-input-surface--glass,
.string-form-field-input-surface--glass {
	--string-form-input-bg: var(--string-form-input-glass-bg);
	--string-form-input-border-color-active: var(--string-form-input-soft-border);
	--string-form-input-blur: var(--string-form-input-glass-blur);
}

.string-form-form > h3,
.string-form-form .string-form-field-label,
.string-form-form .string-form-section h4,
.string-form-form .string-form-html,
.string-form-form .string-form-page-title,
.string-form-form .string-form-options label {
	color: var(--string-form-text, #16213f) !important;
}
.string-form-form-description,
.string-form-form .string-form-field > small,
.string-form-form .string-form-section p,
.string-form-form .string-form-progress small {
	color: var(--string-form-muted, #69738b) !important;
}
.string-form-form .string-form-field-label span {
	color: var(--string-form-required, #b42318) !important;
}

.string-form-form .string-form-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):not([type="submit"]):not([type="button"]),
.string-form-form .string-form-field textarea,
.string-form-form .string-form-field select:not(.string-form-phone-country-select) {
	background: var(--string-form-input-bg, #fff) !important;
	border: var(--string-form-input-border-width, 1px) solid var(--string-form-input-border-color-active, #c8ceda) !important;
	border-radius: var(--string-form-input-radius, 6px) !important;
	color: var(--string-form-input-text, #16213f) !important;
	-webkit-backdrop-filter: blur(var(--string-form-input-blur, 0px));
	backdrop-filter: blur(var(--string-form-input-blur, 0px));
	box-shadow: none;
}
.string-form-form .string-form-field input::placeholder,
.string-form-form .string-form-field textarea::placeholder,
.string-form-form .string-form-slot-display::placeholder {
	color: var(--string-form-input-placeholder, #9aa3b5) !important;
	opacity: 1 !important;
}
.string-form-form .string-form-input-icon,
.string-form-form .string-form-slot-trigger-icon {
	color: var(--string-form-input-icon, #7d8798) !important;
}

.string-form-form .string-form-phone-control {
	background: var(--string-form-input-bg, #fff) !important;
	border: var(--string-form-input-border-width, 1px) solid var(--string-form-input-border-color-active, #c8ceda) !important;
	border-radius: var(--string-form-input-radius, 6px) !important;
	-webkit-backdrop-filter: blur(var(--string-form-input-blur, 0px));
	backdrop-filter: blur(var(--string-form-input-blur, 0px));
	box-shadow: none !important;
}
.string-form-form .string-form-phone-country {
	background: transparent !important;
	border-inline-end: var(--string-form-input-border-width, 1px) solid var(--string-form-input-border-color-active, #c8ceda) !important;
}
.string-form-input-surface--solid .string-form-phone-country,
.string-form-field-input-surface--solid .string-form-phone-country {
	background: #f4f5f7 !important;
}
.string-form-form .string-form-phone-country-display [data-string-form-country-dial],
.string-form-form .string-form-phone-chevron {
	color: var(--string-form-input-text, #16213f) !important;
}
.string-form-form .string-form-phone-control input[type="tel"],
.string-form-form .string-form-phone-control .string-form-input-icon-wrap--phone > input[type="tel"] {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--string-form-input-text, #16213f) !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.string-form-form .string-form-slot-trigger {
	background: var(--string-form-input-bg, #fff) !important;
	border: var(--string-form-input-border-width, 1px) solid var(--string-form-input-border-color-active, #c8ceda) !important;
	border-radius: var(--string-form-input-radius, 6px) !important;
	-webkit-backdrop-filter: blur(var(--string-form-input-blur, 0px));
	backdrop-filter: blur(var(--string-form-input-blur, 0px));
	box-shadow: none !important;
}
.string-form-form .string-form-slot-display {
	background: transparent !important;
	border: 0 !important;
	border-radius: 0 !important;
	box-shadow: none !important;
	color: var(--string-form-input-text, #16213f) !important;
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

.string-form-form .string-form-field input:not([type="checkbox"]):not([type="radio"]):not([type="hidden"]):not([type="file"]):focus,
.string-form-form .string-form-field textarea:focus,
.string-form-form .string-form-field select:not(.string-form-phone-country-select):focus,
.string-form-form .string-form-phone-control:focus-within,
.string-form-form .string-form-slot-trigger:focus-within {
	border-color: var(--string-form-input-focus-border, #203b73) !important;
	box-shadow: 0 0 0 2px var(--string-form-input-focus-ring, rgba(32,59,115,.12)) !important;
	outline: 0 !important;
}
.string-form-form .string-form-input-icon-wrap:focus-within > .string-form-input-icon,
.string-form-form .string-form-slot-trigger:focus-within .string-form-slot-trigger-icon {
	color: var(--string-form-input-focus-border, #203b73) !important;
}

/* 1.11.3 - duplicate-submit protection */
.string-form-page-actions .string-form-submit-button:disabled,
.string-form-page-actions .string-form-submit-button.is-submitting {
	cursor: wait;
	filter: none !important;
	opacity: .72;
	pointer-events: none;
}

/* 1.11.4 - Branch-aware Product filtering uses native option hidden/disabled states. */

/* 1.12.6 - 12-column grid layout */
.string-form-form-page > .string-form-grid-layout {
	box-sizing: border-box;
	display: grid;
	flex: 0 0 100%;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 16px;
	max-width: 100%;
	width: 100%;
}
.string-form-grid-column {
	box-sizing: border-box;
	grid-column: span var(--string-form-grid-span, 12);
	min-width: 0;
}
.string-form-grid-column > .string-form-field {
	max-width: 100%;
	width: 100%;
}
@media (max-width: 640px) {
	.string-form-grid-column {
		grid-column: span 12;
	}
}

/* 1.13.0 regular appointment context + String availability */
.string-form-appointment { display:grid; gap:14px; width:100%; text-align:start; }
.string-form-appointment-context { display:grid; gap:12px; }
.string-form-appointment-context > label { display:grid; gap:6px; text-align:start; }
.string-form-appointment-context > label > span,
.string-form-appointment-services-label > span { color:var(--string-form-text); font-size:13px; font-weight:650; text-align:start; }
.string-form-appointment-context select { -webkit-appearance:none; appearance:none; width:100%; min-height:44px; border:1px solid #c8ceda; border-radius:6px; background-color:#fff; background-image:url("data:image/svg+xml,%3Csvg xmlns=%27http://www.w3.org/2000/svg%27 width=%2712%27 height=%278%27 viewBox=%270 0 12 8%27%3E%3Cpath d=%27M1 1.5 6 6.5 11 1.5%27 fill=%27none%27 stroke=%27%2369738b%27 stroke-width=%271.5%27 stroke-linecap=%27round%27 stroke-linejoin=%27round%27/%3E%3C/svg%3E"); background-repeat:no-repeat; box-sizing:border-box; color:var(--string-form-text); padding:9px 36px 9px 11px; text-align:start; direction:inherit; }
.string-form-form[dir="ltr"] .string-form-appointment-context select { background-position:right 12px center; padding:9px 36px 9px 11px; }
.string-form-form[dir="rtl"] .string-form-appointment-context select { background-position:left 12px center; padding:9px 11px 9px 36px; }
.string-form-appointment-services-label { display:grid; gap:6px; position:relative; }
.string-form-appointment-multiselect { position:relative; width:100%; }
.string-form-appointment-multiselect-trigger { align-items:center; background:#fff; border:1px solid #c8ceda; border-radius:6px; box-sizing:border-box; color:var(--string-form-text); cursor:pointer; display:flex; font:inherit; justify-content:space-between; min-height:44px; padding:9px 11px; text-align:start; width:100%; }
.string-form-appointment-multiselect-trigger:hover,
.string-form-appointment-multiselect-trigger:focus { border-color:var(--string-form-primary); box-shadow:0 0 0 2px rgba(32,59,115,.10); outline:0; }
.string-form-appointment-multiselect-trigger > span:first-child { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.string-form-appointment-multiselect-arrow { color:var(--string-form-muted); flex:0 0 auto; font-size:17px; margin-inline-start:10px; }
.string-form-appointment-multiselect-panel { background:#fff; border:1px solid #d8dde6; border-radius:8px; box-shadow:0 10px 28px rgba(22,33,63,.14); inset-inline:0; margin-top:5px; max-height:240px; overflow:auto; padding:6px; position:absolute; top:100%; z-index:30; }
.string-form-appointment-multiselect-option { align-items:center; border-radius:6px; cursor:pointer; display:flex; gap:8px; margin:0; padding:9px 10px; text-align:start; }
.string-form-appointment-multiselect-option:hover { background:#f5f7fb; }
.string-form-appointment-multiselect-option input { flex:0 0 auto; margin:0; }
.string-form-form[dir="rtl"] .string-form-appointment,
.string-form-form[dir="rtl"] .string-form-appointment-context > label,
.string-form-form[dir="rtl"] .string-form-appointment-services-label > span,
.string-form-form[dir="rtl"] .string-form-appointment-multiselect-trigger,
.string-form-form[dir="rtl"] .string-form-appointment-multiselect-option,
.string-form-form[dir="rtl"] .string-form-appointment-context select { text-align:right; }
.string-form-form[dir="ltr"] .string-form-appointment,
.string-form-form[dir="ltr"] .string-form-appointment-context > label,
.string-form-form[dir="ltr"] .string-form-appointment-services-label > span,
.string-form-form[dir="ltr"] .string-form-appointment-multiselect-trigger,
.string-form-form[dir="ltr"] .string-form-appointment-multiselect-option,
.string-form-form[dir="ltr"] .string-form-appointment-context select { text-align:left; }
.string-form-appointment-slot-picker { margin-top:2px; }
