/*
 * Companion experience — forms.
 * One field vocabulary for signup, the profile editor and agency forms.
 * Legacy markup (.form-label / .form-input / .input) is styled inside .cx-form;
 * several legacy layers use long :not() chains and !important, so the control
 * visuals below are declared !important on purpose.
 */

.cx-form {
	font-family: var(--cx-font);
	color: var(--cx-ink);
}

.cx-form .formseparator,
.cx-form .clear10,
.cx-form .clear15,
.cx-form .clear20 {
	display: none !important;
}

/* ------------------------------------------------------------------ */
/* Labels, help and field rhythm                                       */
/* ------------------------------------------------------------------ */

.cx-form .form-label,
.cx-form .form-input,
.cx-form .fast-signup-field {
	float: none !important;
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-align: left !important;
}

.cx-form .form-label {
	display: flex !important;
	flex-direction: column;
	gap: 2px;
	margin: 24px 0 8px !important;
}


.cx-form .form-label label,
.cx-form .cx-fieldset__legend,
.cx-form .rate-editor__currency-label,
.cx-field__label {
	display: block;
	margin: 0 !important;
	padding: 0 !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.4 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.cx-form .form-label label i,
.cx-form .cx-fieldset__legend i,
.cx-field__label i {
	margin-left: 2px;
	color: var(--cx-ink-3) !important;
	font-style: normal !important;
	font-weight: 600;
}

.cx-form .form-label small,
.cx-form .cx-fieldset__help,
.cx-form .form-input > small,
.cx-field__help {
	display: block;
	margin: 0 !important;
	color: var(--cx-ink-3) !important;
	font-family: var(--cx-font) !important;
	font-size: 14px !important;
	font-weight: 500 !important;
	line-height: 1.45 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.cx-form .form-input > small {
	margin-top: 8px !important;
}

.cx-form .form-input {
	position: relative;
	display: block !important;
}

/* ------------------------------------------------------------------ */
/* Controls                                                            */
/* ------------------------------------------------------------------ */

.cx-form input[type='text'],
.cx-form input[type='password'],
.cx-form input[type='email'],
.cx-form input[type='tel'],
.cx-form input[type='number'],
.cx-form input[type='url'],
.cx-form input[type='search'],
.cx-form select,
.cx-form textarea,
.cx-input {
	display: block !important;
	box-sizing: border-box !important;
	width: 100% !important;
	max-width: 100% !important;
	min-height: 48px !important;
	height: 48px !important;
	margin: 0 !important;
	padding: 0 14px !important;
	border: 1px solid var(--cx-control) !important;
	border-radius: var(--cx-r-control) !important;
	background-color: var(--cx-raised) !important;
	background-image: none !important;
	box-shadow: none !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 1.4 !important;
	letter-spacing: 0 !important;
	text-align: left !important;
	transition: border-color var(--cx-fast) var(--cx-ease);
	-webkit-appearance: none;
	appearance: none;
}

.cx-form textarea {
	height: auto !important;
	min-height: 168px !important;
	padding: 12px 14px !important;
	line-height: 1.6 !important;
	resize: vertical;
}

.cx-form select,
select.cx-input {
	padding-right: 40px !important;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23B4B4B4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E") !important;
	background-repeat: no-repeat !important;
	background-position: right 12px center !important;
	background-size: 18px 18px !important;
	cursor: pointer;
}

.cx-form input::placeholder,
.cx-form textarea::placeholder {
	color: #8A8A8A !important;
	opacity: 1 !important;
}

.cx-form input:hover:not(:focus),
.cx-form select:hover:not(:focus),
.cx-form textarea:hover:not(:focus) {
	border-color: var(--cx-control-hover) !important;
}

.cx-form input[type='text']:focus,
.cx-form input[type='password']:focus,
.cx-form input[type='email']:focus,
.cx-form input[type='tel']:focus,
.cx-form input[type='number']:focus,
.cx-form input[type='url']:focus,
.cx-form input[type='search']:focus,
.cx-form select:focus,
.cx-form textarea:focus,
.cx-input:focus {
	/* One ring that hugs the border, not a second outline floating 2px outside it. */
	border-color: var(--cx-ink-2) !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12) !important;
}

.cx-form input[aria-invalid='true'],
.cx-form select[aria-invalid='true'],
.cx-form textarea[aria-invalid='true'] {
	border-color: var(--cx-error) !important;
}

.cx-form input[type='number'] {
	-moz-appearance: textfield;
}

.cx-form input[type='number']::-webkit-outer-spin-button,
.cx-form input[type='number']::-webkit-inner-spin-button {
	margin: 0;
	-webkit-appearance: none;
}

/* Select2 renders on desktop; give it the same box as a native select. */
.cx-form .select2-container {
	display: block !important;
	width: 100% !important;
	max-width: 100% !important;
}

.cx-form .select2-container .select2-selection--single {
	display: flex !important;
	align-items: center;
	height: 48px !important;
	min-height: 48px !important;
	border: 1px solid var(--cx-control) !important;
	border-radius: var(--cx-r-control) !important;
	background: var(--cx-raised) !important;
	box-shadow: none !important;
}

.cx-form .select2-container .select2-selection__rendered {
	padding: 0 40px 0 14px !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 16px !important;
	font-weight: 500 !important;
	line-height: 46px !important;
}

.cx-form .select2-container .select2-selection__arrow {
	top: 0 !important;
	right: 10px !important;
	height: 46px !important;
}

.cx-form .select2-container--focus .select2-selection--single,
.cx-form .select2-container--open .select2-selection--single {
	border-color: var(--cx-ink-2) !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12) !important;
	border-radius: var(--cx-r-control) !important;
}

/* Same chevron as the native selects beside it, instead of select2's triangle. */
.cx-form .select2-container .select2-selection__arrow b { display: none !important; }
.cx-form .select2-container .select2-selection__arrow {
	width: 24px !important;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='m7 10 5 5 5-5' stroke='%239a9a9a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 18px no-repeat !important;
	transition: transform var(--cx-fast) var(--cx-ease);
}
.cx-form .select2-container--open .select2-selection__arrow { transform: rotate(180deg); }

/* Select2 dropdown (rendered at the end of <body>): a detached panel in the
   workspace palette. Hover is a quiet tint; the chosen city gets a check. */
body .select2-container--default .select2-dropdown {
	overflow: hidden;
	border: 1px solid rgba(255, 255, 255, 0.14) !important;
	border-radius: var(--cx-r-control, 8px) !important;
	background: #1b1b1b !important;
	box-shadow: 0 18px 44px rgba(0, 0, 0, 0.5) !important;
	font-family: var(--cx-font, 'Manrope', sans-serif);
}
body .select2-container--default .select2-dropdown--below { margin-top: 6px; }
body .select2-container--default .select2-dropdown--above { margin-top: -6px; }
body .select2-container--default .select2-search--dropdown {
	padding: 8px !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.08) !important;
	background: none !important;
}
body .select2-container--default .select2-search--dropdown .select2-search__field {
	height: 40px !important;
	min-height: 40px !important;
	margin: 0 !important;
	padding: 0 12px 0 36px !important;
	border: 1px solid rgba(255, 255, 255, 0.12) !important;
	border-radius: 6px !important;
	background: #121212 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%239a9a9a' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='m20 20-3.5-3.5'/%3E%3C/svg%3E") 12px center / 16px no-repeat !important;
	box-shadow: none !important;
	color: var(--cx-ink, #ececec) !important;
	font: 500 15px var(--cx-font, 'Manrope', sans-serif) !important;
	outline: none !important;
}
body .select2-container--default .select2-search--dropdown .select2-search__field:focus {
	border-color: rgba(255, 255, 255, 0.36) !important;
	box-shadow: none !important;
}
body .select2-container--default .select2-results > .select2-results__options {
	max-height: 288px !important;
	padding: 4px !important;
	scrollbar-width: thin;
	scrollbar-color: rgba(255, 255, 255, 0.18) transparent;
}
body .select2-container--default .select2-results__option {
	margin: 0 !important;
	padding: 10px 36px 10px 12px !important;
	border-radius: 6px !important;
	background: none !important;
	color: var(--cx-ink-2, #b4b4b4) !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	line-height: 1.35 !important;
}
body .select2-container--default .select2-results__option--highlighted,
body .select2-container--default .select2-results__option--highlighted[aria-selected],
body .select2-container--default .select2-results__option--highlighted[data-selected] {
	background: rgba(255, 255, 255, 0.07) !important;
	color: var(--cx-ink, #ececec) !important;
}
body .select2-container--default .select2-results__option[aria-selected='true'],
body .select2-container--default .select2-results__option[data-selected='true'],
body .select2-container--default .select2-results__option--selected {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23ececec' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") right 12px center / 16px no-repeat !important;
	color: var(--cx-ink, #ececec) !important;
	font-weight: 700 !important;
}
body .select2-container--default .select2-results__option--highlighted[aria-selected='true'],
body .select2-container--default .select2-results__option--highlighted[data-selected='true'],
body .select2-container--default .select2-results__option--highlighted.select2-results__option--selected {
	background-color: rgba(255, 255, 255, 0.07) !important;
}
body .select2-container--default .select2-results__message {
	color: var(--cx-ink-3, #9a9a9a) !important;
	font-size: 14px !important;
}

.cx-form .is-invalid .select2-selection--single {
	border-color: var(--cx-error) !important;
}

/* Linked number: "Use this number for calls too" sits under the number it reuses. */
.cx-form .cx-linked-number {
	margin: 10px 0 0 !important;
	border: 1px solid var(--cx-rule-strong);
	border-radius: var(--cx-r-control);
	background: var(--cx-raised);
}

.cx-form .cx-linked-number[hidden],
.cx-form .cx-linked-number__alt[hidden] {
	display: none !important;
}

.cx-form .cx-linked-number__toggle {
	position: relative;
	display: flex !important;
	align-items: flex-start;
	gap: 12px;
	margin: 0 !important;
	padding: 13px 14px !important;
	cursor: pointer;
	font-family: var(--cx-font) !important;
}

.cx-form .cx-linked-number__input {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	opacity: 0 !important;
	cursor: pointer;
}

.cx-form .cx-linked-number__box {
	flex: 0 0 18px;
	width: 18px;
	height: 18px;
	margin-top: 1px;
	box-sizing: border-box;
	border: 1.5px solid var(--cx-control-hover);
	border-radius: 5px;
	transition: background-color var(--cx-fast) var(--cx-ease), border-color var(--cx-fast) var(--cx-ease);
}

.cx-form .cx-linked-number__input:checked + .cx-linked-number__box {
	border-color: var(--cx-ink);
	background: var(--cx-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230E0E0E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") no-repeat center / 12px;
}

.cx-form .cx-linked-number__toggle:hover .cx-linked-number__box {
	border-color: var(--cx-ink-2);
}

.cx-form .cx-linked-number:has(.cx-linked-number__input:focus-visible) {
	outline: 2px solid var(--cx-gold);
	outline-offset: 2px;
}

.cx-form .cx-linked-number__copy {
	display: grid;
	gap: 2px;
	min-width: 0;
}

.cx-form .cx-linked-number__title {
	color: var(--cx-ink);
	font-size: 15px;
	font-weight: 600;
	line-height: 1.35;
}

.cx-form .cx-linked-number__summary {
	color: var(--cx-ink-3);
	font-size: 13px;
	line-height: 1.45;
	overflow-wrap: anywhere;
}

.cx-form .cx-linked-number__alt {
	padding: 4px 14px 14px;
	border-top: 1px solid var(--cx-rule);
	animation: cx-linked-reveal var(--cx-sheet) var(--cx-ease);
}

.cx-form .cx-linked-number__alt .form-label {
	margin-top: 10px !important;
}

@keyframes cx-linked-reveal {
	from { opacity: 0; transform: translateY(-4px); }
	to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
	.cx-form .cx-linked-number__alt { animation: none; }
	.cx-form .cx-linked-number__box { transition: none; }
}

/* Date of birth: three equal controls on one line. */
.cx-form .cx-dob {
	display: grid !important;
	grid-template-columns: 1fr 1.6fr 1.2fr;
	gap: 8px;
	margin-top: 8px !important;
}

.cx-form .cx-dob select {
	float: none !important;
	width: 100% !important;
}

/* Phone: country code and number read as one control. The code shows as a
   compact flag + dial code; the native list still names every country. */
.cx-form .country-phone {
	display: grid !important;
	grid-template-columns: auto minmax(0, 1fr);
	gap: 0;
	width: 100%;
}

.cx-form .country-phone__picker {
	min-height: 48px;
	border: 1px solid var(--cx-control);
	border-radius: var(--cx-r-control) 0 0 var(--cx-r-control);
	background-color: var(--cx-raised);
}

.cx-form .country-phone__picker:hover { border-color: var(--cx-control-hover); }

.cx-form .country-phone__picker:focus-within {
	position: relative;
	z-index: 1;
	border-color: var(--cx-ink-2);
	box-shadow: 0 0 0 3px rgba(255, 255, 255, 0.12);
}

.cx-form .country-phone__code,
.cx-form .country-phone .select2-container .select2-selection--single {
	border-top-right-radius: 0 !important;
	border-bottom-right-radius: 0 !important;
}

.cx-form .country-phone > input[type='tel'] {
	margin-left: -1px !important;
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

.cx-form .country-phone > input[type='tel']:focus {
	position: relative;
	z-index: 1;
}

/* Prefix affix (@username). */
.cx-affix {
	display: flex;
	align-items: stretch;
}

.cx-affix__text {
	display: inline-flex;
	align-items: center;
	padding: 0 12px;
	border: 1px solid var(--cx-control);
	border-right: 0;
	border-radius: var(--cx-r-control) 0 0 var(--cx-r-control);
	background: var(--cx-surface);
	color: var(--cx-ink-3);
	font-size: 16px;
	font-weight: 600;
}

.cx-affix input {
	border-top-left-radius: 0 !important;
	border-bottom-left-radius: 0 !important;
}

/* Password with Show/Hide. */
.cx-password {
	position: relative;
}

.cx-password input {
	padding-right: 84px !important;
}

.cx-password__toggle,
.fast-signup-pass-toggle {
	position: absolute !important;
	top: 2px !important;
	right: 2px !important;
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	min-width: 72px;
	height: 44px !important;
	margin: 0 !important;
	padding: 0 12px !important;
	border: 0 !important;
	border-radius: 6px !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
	cursor: pointer;
}

.cx-password__toggle:hover,
.fast-signup-pass-toggle:hover {
	background: var(--cx-raised-2) !important;
}

.cx-password__toggle:focus-visible,
.fast-signup-pass-toggle:focus-visible {
	outline: 2px solid var(--cx-gold) !important;
	outline-offset: -2px !important;
}

/* ------------------------------------------------------------------ */
/* Fieldsets, groups and disclosures                                   */
/* ------------------------------------------------------------------ */

.cx-fieldset {
	min-width: 0;
	margin: 24px 0 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.cx-fieldset__legend {
	float: left;
	width: 100%;
	margin: 0 0 2px !important;
}

.cx-fieldset__legend + * {
	clear: both;
}

.cx-fieldset .cx-fieldset__help {
	clear: both;
	margin-bottom: 8px !important;
}

.cx-fieldset > .form-input {
	clear: both;
	padding-top: 8px !important;
}

.cx-group {
	margin-top: 40px;
	padding-top: 24px;
	border-top: 1px solid var(--cx-rule);
}

.cx-group__title {
	margin: 0 0 16px !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.cx-grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr);
	column-gap: 16px;
	align-items: start;
}

@media (min-width: 640px) {
	.cx-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

.cx-form .cx-pair {
	min-width: 0;
}

.cx-form .cx-group .cx-grid > .cx-pair:nth-child(-n + 2) > .form-label {
	margin-top: 0 !important;
}

.cx-form .cx-pair .smallinput {
	display: inline-block !important;
	width: calc(100% - 40px) !important;
}

.cx-disclosure {
	margin: 32px 0 0;
	border-top: 1px solid var(--cx-rule);
	border-bottom: 1px solid var(--cx-rule);
}

.cx-disclosure__summary {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 56px;
	padding: 0 4px;
	color: var(--cx-ink);
	font-family: var(--cx-font);
	font-size: 16px;
	font-weight: 700;
	list-style: none;
	cursor: pointer;
}

.cx-disclosure__summary::-webkit-details-marker {
	display: none;
}

.cx-disclosure__summary::after {
	content: '';
	width: 18px;
	height: 18px;
	margin-left: auto;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23B4B4B4' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E") no-repeat center / contain;
	transition: transform var(--cx-fast) var(--cx-ease);
}

.cx-disclosure[open] > .cx-disclosure__summary::after {
	transform: rotate(180deg);
}

.cx-disclosure__summary:focus-visible {
	outline: 2px solid var(--cx-gold);
	outline-offset: 2px;
}

.cx-disclosure__hint {
	color: var(--cx-ink-3);
	font-size: 14px;
	font-weight: 500;
}

.cx-disclosure__body {
	padding: 0 0 24px;
}

.cx-disclosure__body > .form-label:first-child {
	margin-top: 8px !important;
}

/* ------------------------------------------------------------------ */
/* Choices: radio options, checkbox rows                               */
/* ------------------------------------------------------------------ */

.cx-form .account-choice-grid,
.cx-form .availability-choice-grid,
.cx-form .contact-channel-grid {
	display: flex !important;
	flex-wrap: wrap;
	gap: 8px !important;
}

.cx-form .account-choice,
.cx-form .availability-choice,
.cx-form .editor-choice {
	position: relative;
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	min-height: 48px !important;
	margin: 0 !important;
	padding: 0 16px 0 14px !important;
	border: 1px solid var(--cx-control) !important;
	border-radius: var(--cx-r-control) !important;
	background: var(--cx-raised) !important;
	box-shadow: none !important;
	color: var(--cx-ink-2) !important;
	font-family: var(--cx-font) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
	line-height: 1.3;
	cursor: pointer;
	transition: border-color var(--cx-fast) var(--cx-ease), background-color var(--cx-fast) var(--cx-ease);
}

.cx-form .account-choice:hover,
.cx-form .availability-choice:hover,
.cx-form .editor-choice:hover {
	border-color: var(--cx-control-hover) !important;
}

.cx-form .account-choice:has(input:checked),
.cx-form .availability-choice:has(input:checked),
.cx-form .editor-choice:has(input:checked) {
	border-color: var(--cx-ink) !important;
	background: #262626 !important;
	color: var(--cx-ink) !important;
}

.cx-form .account-choice:has(input:focus-visible),
.cx-form .availability-choice:has(input:focus-visible),
.cx-form .editor-choice:has(input:focus-visible) {
	outline: 2px solid var(--cx-gold);
	outline-offset: 2px;
}

/* The native control stays accessible; a drawn marker shows state. */
.cx-form .account-choice input,
.cx-form .availability-choice input,
.cx-form .editor-choice input {
	position: absolute !important;
	inset: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	opacity: 0 !important;
	cursor: pointer;
}

.cx-form .account-choice::before {
	content: '';
	width: 18px;
	height: 18px;
	flex: 0 0 18px;
	box-sizing: border-box;
	border: 1.5px solid var(--cx-control-hover);
	border-radius: 50%;
	background: transparent;
}

.cx-form .account-choice:has(input:checked)::before {
	border: 5px solid var(--cx-ink);
}

.cx-form .availability-choice__box,
.cx-form .editor-choice__box {
	display: inline-flex !important;
	align-items: center;
	justify-content: center;
	width: 18px !important;
	height: 18px !important;
	flex: 0 0 18px;
	margin: 0 !important;
	border: 1.5px solid var(--cx-control-hover) !important;
	border-radius: 5px !important;
	background: transparent !important;
	box-shadow: none !important;
}

.cx-form .availability-choice:has(input:checked) .availability-choice__box,
.cx-form .editor-choice:has(input:checked) .editor-choice__box {
	border-color: var(--cx-ink) !important;
	background: var(--cx-ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%230E0E0E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") no-repeat center / 12px !important;
}

.cx-form .availability-choice__box::before,
.cx-form .availability-choice__box::after,
.cx-form .editor-choice__box::before,
.cx-form .editor-choice__box::after {
	content: none !important;
}

.cx-form .availability-choice__label,
.cx-form .editor-choice__label,
.cx-form .account-choice__label {
	color: inherit !important;
	font: inherit !important;
}

.cx-form .editor-choice--channel .icon {
	display: none !important;
}

/* Services: a dense list of selectable rows. */
.cx-services__tools {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
	clear: both;
	margin: 4px 0 12px;
}

.cx-services__count {
	color: var(--cx-ink-3);
	font-size: 14px;
	font-weight: 600;
}

.cx-form .cx-services__filter {
	width: min(280px, 100%) !important;
	height: 44px !important;
	min-height: 44px !important;
}

.cx-form .service-choice-grid {
	display: grid !important;
	grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
	gap: 8px !important;
}

.cx-form .service-choice-grid .one-service {
	float: none !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0 !important;
}

.cx-form .service-choice-grid .one-service[hidden] {
	display: none !important;
}

.cx-form .service-choice-grid .editor-choice {
	display: flex !important;
	width: 100%;
}

/* Languages: name + level on one row. */
.cx-form .language-editor__row {
	display: grid !important;
	grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
	gap: 8px;
	margin: 0 0 8px !important;
}

/* Rates: currency first, then an aligned duration table. */
.cx-form .rate-editor {
	display: block !important;
}

.cx-form .rate-editor__currency {
	display: grid !important;
	gap: 8px;
	max-width: 360px;
	margin: 8px 0 20px !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
}

.cx-form .rate-grid {
	display: block !important;
	border-top: 1px solid var(--cx-rule);
}

.cx-form .rate-grid__header,
.cx-form .rate-grid__row {
	display: grid !important;
	grid-template-columns: minmax(96px, 0.9fr) repeat(2, minmax(0, 1fr));
	gap: 12px;
	align-items: center;
	margin: 0 !important;
	padding: 8px 0 !important;
	border: 0 !important;
	border-bottom: 1px solid var(--cx-rule) !important;
	background: none !important;
}

.cx-form .rate-grid__header {
	padding: 10px 0 !important;
}

.cx-form .rate-grid__header span,
.cx-form .rate-grid__service {
	color: var(--cx-ink-3) !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
}

.cx-form .rate-grid__duration {
	color: var(--cx-ink) !important;
	font-size: 15px !important;
	font-weight: 600 !important;
}

.cx-form .rate-grid__field {
	display: block !important;
	margin: 0 !important;
}

.cx-form .rate-grid__input {
	height: 44px !important;
	min-height: 44px !important;
}

.cx-form .rate-grid__input::placeholder {
	color: #7A7A7A !important;
	font-size: 14px;
}

/* Two-level location note and dependent-field placeholder text. */
.cx-form .inputcities,
.cx-form .inputstates {
	color: var(--cx-ink-3);
	font-size: 14px;
	font-weight: 500;
}

.cx-form .location-two-level-note {
	display: block;
	margin-top: 8px;
	color: var(--cx-ink-3);
	font-size: 14px;
}

/* ------------------------------------------------------------------ */
/* Inline errors                                                       */
/* ------------------------------------------------------------------ */

.cx-field-error {
	display: flex;
	align-items: flex-start;
	gap: 6px;
	clear: both;
	margin: 8px 0 0 !important;
	color: var(--cx-error);
	font-family: var(--cx-font);
	font-size: 14px;
	font-weight: 600;
	line-height: 1.4;
}

.cx-field-error .cx-icon {
	margin-top: 1px;
}

.cx-form .is-invalid .account-choice,
.cx-form .is-invalid .availability-choice,
.cx-form .is-invalid .editor-choice,
.cx-form .is-invalid .cx-check__box {
	border-color: rgba(255, 155, 155, 0.7) !important;
}

/* Legacy error decorations are replaced by the messages above. */
.cx-form .wizard-field-error {
	box-shadow: none !important;
}

.cx-form .wizard-error-msg {
	display: none !important;
}

/* ------------------------------------------------------------------ */
/* Steps                                                               */
/* ------------------------------------------------------------------ */

.cx-form .wizard-step {
	animation: none !important;
}

.cx-form .wizard-step__header {
	margin: 0 0 8px !important;
	padding: 0 !important;
	border: 0 !important;
}

.cx-form .wizard-step__title {
	margin: 0 0 6px !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 20px !important;
	font-weight: 700 !important;
	line-height: 1.3 !important;
	letter-spacing: -0.01em !important;
}

.cx-form .wizard-step__title:focus {
	outline: none;
}

.cx-form .wizard-step__title:focus-visible {
	outline: 2px solid var(--cx-gold);
	outline-offset: 4px;
}

.cx-form .wizard-step__desc {
	margin: 0 !important;
	color: var(--cx-ink-3) !important;
	font-size: 15px !important;
	line-height: 1.5 !important;
}

@media (min-width: 900px) {
	.cx-form .wizard-step__title {
		font-size: 22px !important;
	}
}

/* Signup progress: "Step 2 of 4 · About you" with a thin line. */
.cx-progress.wizard-progress {
	margin: 0 0 24px !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

.cx-progress__label {
	display: block;
	margin: 0 0 10px !important;
	color: var(--cx-ink-3);
	font-size: 14px;
	font-weight: 600;
}

.cx-progress__name {
	color: var(--cx-ink);
}

.cx-progress__name::before {
	content: '·';
	margin: 0 8px;
	color: var(--cx-ink-3);
}

.cx-progress .cx-progress__track {
	position: relative;
	height: 2px !important;
	margin: 0 !important;
	overflow: hidden;
	border-radius: 2px;
	background: var(--cx-rule-strong) !important;
}

.cx-progress .cx-progress__fill {
	position: absolute;
	inset: 0 auto 0 0;
	height: 2px !important;
	border-radius: 2px;
	background: #D71936 !important;
	box-shadow: none !important;
	transition: width 220ms var(--cx-ease);
}

.cx-progress .cx-progress__steps {
	display: none !important;
}

@media (min-width: 720px) {
	.cx-progress .cx-progress__steps {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 4px;
		margin: 8px 0 0 !important;
		padding: 0 !important;
		list-style: none !important;
	}

	.cx-progress .cx-progress__steps li {
		margin: 0;
		padding: 0;
		list-style: none;
	}

	.cx-progress .cx-progress__steps li::before {
		content: none !important;
	}

	.cx-progress .wizard-progress__step {
		display: inline-flex !important;
		align-items: center;
		gap: 8px;
		width: 100%;
		min-height: 44px;
		margin: 0 !important;
		padding: 0 !important;
		border: 0 !important;
		background: none !important;
		box-shadow: none !important;
		color: var(--cx-ink-3) !important;
		font-family: var(--cx-font);
		font-size: 14px !important;
		font-weight: 600 !important;
		text-align: left;
		cursor: pointer;
	}

	.cx-progress .wizard-progress__step:disabled {
		color: #767676 !important;
		cursor: default;
		opacity: 1;
	}

	.cx-progress .wizard-progress__step--active,
	.cx-progress .wizard-progress__step--completed {
		color: var(--cx-ink) !important;
	}

	.cx-progress .wizard-progress__step:not(:disabled):hover .wizard-progress__label {
		text-decoration: underline;
		text-underline-offset: 3px;
	}

	.cx-progress .wizard-progress__step:focus-visible {
		outline: 2px solid var(--cx-gold);
		outline-offset: 2px;
	}

	.cx-progress .wizard-progress__dot {
		display: inline-flex !important;
		align-items: center;
		justify-content: center;
		width: 22px !important;
		height: 22px !important;
		flex: 0 0 22px;
		margin: 0 !important;
		border: 1.5px solid currentColor !important;
		border-radius: 50% !important;
		background: none !important;
		box-shadow: none !important;
		color: inherit !important;
		font-size: 12px !important;
		font-weight: 700 !important;
	}

	.cx-progress .wizard-progress__step--active .wizard-progress__dot {
		border-color: var(--cx-ink) !important;
		background: var(--cx-ink) !important;
		color: var(--cx-canvas) !important;
	}

	.cx-progress .wizard-progress__step--completed .wizard-progress__dot {
		font-size: 0 !important;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23ECECEC' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m5 12.5 4.5 4.5L19 7.5'/%3E%3C/svg%3E") no-repeat center / 12px !important;
	}

	.cx-progress .wizard-progress__step--completed .wizard-progress__dot::after,
	.cx-progress .wizard-progress__step--active .wizard-progress__dot::after {
		content: none !important;
	}

	.cx-progress .wizard-progress__step--error .wizard-progress__dot {
		border-color: var(--cx-error) !important;
		color: var(--cx-error) !important;
	}

	.cx-progress .wizard-progress__label {
		overflow: hidden;
		color: inherit !important;
		font-size: 14px !important;
		text-overflow: clip;
		white-space: normal;
	}
}

/* Editor: section tabs sit directly above the form. */
.cx-form__sections {
	position: sticky;
	top: 0;
	z-index: 20;
	margin: 0 0 28px;
	background: var(--cx-canvas);
}

.admin-bar .cx-form__sections {
	top: 32px;
}

.cx-form .cx-tab.wizard-progress__step--error {
	color: var(--cx-error);
}

/* Step navigation for signup. */
.cx-form .cx-stepnav.wizard-nav {
	display: flex !important;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin: 40px 0 0 !important;
	padding: 24px 0 0 !important;
	border: 0 !important;
	border-top: 1px solid var(--cx-rule) !important;
	background: none !important;
	box-shadow: none !important;
}

.cx-form .cx-stepnav .wizard-nav__btn {
	min-width: 120px;
}

.cx-form .cx-stepnav .wizard-nav__btn--next {
	margin-left: auto;
}

.cx-form .cx-stepnav .wizard-nav__btn[hidden] {
	display: none !important;
}

@media (max-width: 559px) {
	.cx-form .cx-stepnav .wizard-nav__btn--next {
		flex: 1 1 auto;
	}
}

/* Final submit inside the last signup step. */
.cx-form .cx-submit {
	margin: 32px 0 0;
}

.cx-form .cx-consents {
	margin: 32px 0 0;
	padding-top: 16px;
	border-top: 1px solid var(--cx-rule);
}

.cx-form .cx-consent {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	background: none !important;
	text-align: left !important;
}

/* Save bar for the editor: rests at the end of the form, and follows the
   viewport (above the phone tab bar) once there is something to save. */
.cx-savebar {
	position: relative;
	z-index: 30;
	margin: 40px 0 0;
	padding: 16px 0 0;
	border-top: 1px solid var(--cx-rule);
	background: var(--cx-canvas);
}

.cx-savebar.is-dirty {
	position: sticky;
	bottom: calc(74px + var(--cx-safe-bottom));
	padding: 12px 0;
	border-top-color: var(--cx-rule-strong);
	background: rgba(14, 14, 14, 0.97);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
}

@media (min-width: 1024px) {
	.cx-savebar.is-dirty {
		bottom: 0;
		padding: 16px 0;
	}
}

.cx-savebar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 8px 16px;
}

.cx-savebar__status {
	margin: 0;
	color: var(--cx-ink-3);
	font-size: 14px;
	font-weight: 600;
}

.cx-savebar.is-dirty .cx-savebar__status {
	color: var(--cx-warning);
}

.cx-savebar.is-dirty .cx-savebar__status::before {
	content: '';
	display: inline-block;
	width: 8px;
	height: 8px;
	margin-right: 8px;
	border-radius: 50%;
	background: var(--cx-warning);
	vertical-align: 1px;
}

.cx-savebar__actions {
	display: flex;
	align-items: center;
	gap: 8px;
	margin-left: auto;
}

.cx-savebar__actions input[type='submit'] {
	min-width: 148px;
}

@media (max-width: 559px) {
	.cx-savebar__inner {
		flex-wrap: nowrap;
	}

	.cx-savebar__status {
		font-size: 13px;
	}

	.cx-savebar:not(.is-dirty) .cx-savebar__status {
		flex: 1 1 auto;
	}

	.cx-savebar__actions input[type='submit'] {
		min-width: 132px;
	}
}

/* Submit inputs pick up the button language. */
.cx-form input.cx-btn[type='submit'] {
	height: 48px !important;
	border-radius: var(--cx-r-control) !important;
	background: var(--cx-accent) !important;
	border: 1px solid var(--cx-accent) !important;
	box-shadow: none !important;
	color: var(--cx-on-accent) !important;
	font-family: var(--cx-font) !important;
	font-size: 15px !important;
	font-weight: 700 !important;
	letter-spacing: 0 !important;
	text-transform: none !important;
	text-shadow: none !important;
	cursor: pointer;
}

.cx-form input.cx-btn[type='submit']:hover {
	background: var(--cx-accent-hover) !important;
	border-color: var(--cx-accent-hover) !important;
}

.cx-form input.cx-btn[type='submit']:focus-visible {
	outline: 2px solid var(--cx-gold) !important;
	outline-offset: 2px !important;
}

.cx-form input.cx-btn.is-busy[type='submit'] {
	opacity: 0.7;
	cursor: progress;
}

/* Generate-bio helper, quieter. */
.cx-form .seo-generate-wrap {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px 12px;
	margin-top: 12px;
}

.cx-form .seo-generate-btn {
	min-height: 44px;
	padding: 0 14px;
	border: 1px solid var(--cx-control) !important;
	border-radius: var(--cx-r-control) !important;
	background: transparent !important;
	box-shadow: none !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 14px !important;
	font-weight: 700 !important;
}

.cx-form .seo-score-chip {
	color: var(--cx-ink-3) !important;
	font-size: 13px !important;
	background: none !important;
	border: 0 !important;
}

@media (prefers-reduced-motion: reduce) {
	.cx-form *,
	.cx-disclosure__summary::after {
		transition: none !important;
	}
}

/* ------------------------------------------------------------------ */
/* Legacy overrides found in rendering                                 */
/* ------------------------------------------------------------------ */

/* The form is not a card; the workspace or signup shell frames it. */
form.cx-form.register-form,
form.cx-form.register-form-ag,
form.cx-form.fast-signup-form {
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

/* Native choice inputs stay invisible over the drawn marker. */
.cx-form .form-input .account-choice input[type='radio'],
.cx-form .form-input .availability-choice input[type='checkbox'],
.cx-form .form-input .editor-choice input[type='checkbox'] {
	position: absolute !important;
	top: 0 !important;
	left: 0 !important;
	width: 100% !important;
	height: 100% !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	opacity: 0 !important;
	-webkit-appearance: none !important;
	appearance: none !important;
}

.cx-form .cx-tab.wizard-progress__step {
	opacity: 1 !important;
	color: var(--cx-ink-2) !important;
}

.cx-form .cx-tab.wizard-progress__step[aria-selected='true'] {
	color: var(--cx-ink) !important;
}

.cx-form .cx-tab.wizard-progress__step.wizard-progress__step--error {
	color: var(--cx-error) !important;
}

/* Date of birth selects are narrow: keep their values readable. */
.cx-form .cx-dob select.birthday {
	padding: 0 30px 0 12px !important;
	margin: 0 !important;
	background-position: right 8px center !important;
}

/* Units sit beside numeric inputs. */
.cx-form .cx-pair .form-input:has(.smallinput) {
	display: flex !important;
	align-items: center;
	gap: 8px;
	color: var(--cx-ink-2);
	font-size: 15px;
	font-weight: 600;
}

.cx-form .cx-pair .form-input .smallinput {
	flex: 1 1 auto;
	width: auto !important;
	min-width: 0;
}

.cx-btn[hidden],
.cx-form [hidden] {
	display: none !important;
}

.cx-notice--compact {
	grid-template-columns: auto 1fr;
	align-items: center;
	margin-bottom: 24px;
}

.cx-notice--compact > .cx-icon {
	grid-row: auto;
	margin-top: 0;
}

.cx-form .language-editor__row {
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
}

/* Overflowing section tabs fade at the edge so the next tab is discoverable. */
@media (max-width: 719px) {
	.cx-form__sections .cx-tabs {
		-webkit-mask-image: linear-gradient(90deg, #000 85%, transparent);
		mask-image: linear-gradient(90deg, #000 85%, transparent);
	}

	.cx-form__sections .cx-tabs.is-scrolled-end {
		-webkit-mask-image: none;
		mask-image: none;
	}
}

/* Honeypot fields stay out of sight and out of the tab order. */
.cx-form input.hide,
.cx-form input[name='emails'] {
	display: none !important;
}

/* Select2: vertically centre the rendered value. */
.cx-form .select2-container .select2-selection--single .select2-selection__rendered {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}

/* Section groups inside forms (agency, tours, blacklist). */
.cx-form .account-form-section {
	margin: 0 0 32px !important;
	padding: 0 !important;
	border: 0 !important;
	border-radius: 0 !important;
	background: none !important;
	box-shadow: none !important;
	text-align: left !important;
}

.cx-form .account-form-section + .account-form-section {
	padding-top: 24px !important;
	border-top: 1px solid var(--cx-rule) !important;
}

.cx-form .account-form-section__eyebrow {
	display: none !important;
}

.cx-form h3.account-form-section__title {
	margin: 24px 0 0 !important;
	padding: 0 !important;
	color: var(--cx-ink) !important;
	font-family: var(--cx-font) !important;
	font-size: 17px !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	letter-spacing: 0 !important;
	text-align: left !important;
	text-transform: none !important;
}

.cx-form .account-form-section__copy {
	margin: 4px 0 0 !important;
	color: var(--cx-ink-3) !important;
	font-size: 14px !important;
	line-height: 1.5 !important;
	text-align: left !important;
}

/* Signup step titles can be h2 or h3 depending on the page's heading outline. */
.cx-form h3.wizard-step__title,
.cx-form h2.wizard-step__title {
	text-align: left !important;
	text-transform: none !important;
}

/* The section title supplies the name; progress only needs the step count. */
.cx-progress__name { display: none; }
.cx-ws .cx-form__sections { background: var(--cx-canvas); }
.cx-ws .cx-form .wizard-step { padding: 24px 0; border-top: 1px solid var(--cx-rule-strong); }
.cx-ws .cx-form .wizard-step__title { font-size: 26px !important; letter-spacing: -.025em !important; }
@media (min-width: 1024px) {
 .cx-ws .cx-form .wizard-step { padding: 32px; background: var(--cx-surface); border: 0; border-radius: 8px; }
 .cx-ws .cx-form .wizard-step__header { padding-bottom: 12px !important; }
}
.cx-ws .select2-container { max-width: 100% !important; width: 100% !important; }
/* The parent styles use id-qualified selectors. Match that scope at the boundary. */
body #register_form.cx-form input:not([type='checkbox']):not([type='radio']):not([type='hidden']):not([type='submit']),
body #register_form.cx-form textarea { background: var(--cx-raised) !important; border-radius: 8px !important; border: 1px solid var(--cx-control) !important; }
body #register_form.cx-form input[aria-invalid='true'],
body #register_form.cx-form textarea[aria-invalid='true'] { border-color: var(--cx-error) !important; }
@media (min-width: 720px) {
 .cx-progress .cx-progress__steps { grid-template-columns: repeat(4,minmax(0,1fr)); }
 .cx-progress .wizard-progress__step { flex-direction: row !important; }
 .cx-progress .wizard-progress__label { max-width: none !important; text-align: left !important; font-size: 12px !important; }
}
@media (min-width: 1024px) {
 .cx-signup__main #register_form.cx-form { padding: 28px !important; background: var(--cx-surface) !important; border-radius: 8px !important; }
}
/* reCAPTCHA's hidden response is a transport field, never an editable textarea. */
.cx-form textarea.g-recaptcha-response { display: none !important; }
body #register_form.cx-form input[type='radio'],
body #register_form.cx-form input[type='checkbox'] { background-image: none !important; }
body #register_form.cx-form .country-phone > input[type='tel'] { border-radius: 0 8px 8px 0 !important; }
.cx-form .inputcities:empty,
.cx-form .inputcities:not(:has(select,input)) { padding: 14px !important; min-height: 48px; border: 1px dashed var(--cx-control) !important; border-radius: 8px; color: var(--cx-ink-3); }
