/*
 * Consultation popup (opened from the consultation banner CTA). Figma NdcwLxoPTX756JayKGOtUO:
 * 121:57 (1440), 121:55 (390), 121:54 (360), 130:1127 / 130:944 (calendar open), 122:434 (states).
 * Mobile-first: dialog = viewport minus 32px, max 480px from 768px up, inputs 56px, in-field
 * floating labels, date (right) + time (left) row with a 12px gap, calendar as a bottom sheet on
 * mobile and a centred card on desktop. Scoped under .ta-cp so nothing leaks into Elementor.
 */

.ta-cp {
	--ta-cp-accent: #0062fe;
	--ta-cp-accent-hover: #0054d9;
	--ta-cp-ink: #292566;
	--ta-cp-text: #292b43;
	--ta-cp-muted: #53516c;
	--ta-cp-border: #dedfe6;
	--ta-cp-surface: #ffffff;
	--ta-cp-soft: #fafafc;
	--ta-cp-card: #f3f6ff;
	--ta-cp-error: #b82e33;
	--ta-cp-error-text: #b23b3b;
	--ta-cp-error-bg: #fff6f6;
	--ta-cp-backdrop: rgba(23, 20, 48, 0.46);
	--ta-cp-cal-backdrop: rgba(31, 26, 61, 0.25);
	--ta-cp-shadow: 0 16px 24px rgba(13, 10, 41, 0.18);
	--ta-cp-font-head: Alef, sans-serif;
	--ta-cp-font-body: Heebo, sans-serif;
	--ta-cp-radius: 24px;
	--ta-cp-pad-top: 20px;
	--ta-cp-pad-x: 24px;
	--ta-cp-pad-bottom: 24px;
	--ta-cp-gap: 16px;
	--ta-cp-title-size: 28px;
	--ta-cp-title-line: 34px;
	--ta-cp-z: 100000;

	position: fixed;
	inset: 0;
	z-index: var(--ta-cp-z);
	display: none;
	align-items: center;
	justify-content: center;
	padding: 16px;
	background: var(--ta-cp-backdrop);
	direction: rtl;
	text-align: right;
	font-family: var(--ta-cp-font-body);
	color: var(--ta-cp-text);
	-webkit-font-smoothing: antialiased;
}

.ta-cp[data-open="true"] {
	display: flex;
}

.ta-cp *,
.ta-cp *::before,
.ta-cp *::after {
	box-sizing: border-box;
}

/* Page scroll lock while the dialog is open (set by consult-popup.js). */
body.ta-cp-lock {
	overflow: hidden;
}

/* ---------------------------------------------------------------- */
/* Dialog                                                             */
/* ---------------------------------------------------------------- */

.ta-cp__dialog {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--ta-cp-gap);
	width: calc(100vw - 32px);
	max-width: 480px;
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	margin: 0;
	padding: var(--ta-cp-pad-top) var(--ta-cp-pad-x) var(--ta-cp-pad-bottom);
	overflow-y: auto;
	overscroll-behavior: contain;
	-webkit-overflow-scrolling: touch;
	border: 0;
	border-radius: var(--ta-cp-radius);
	background: var(--ta-cp-surface);
	box-shadow: var(--ta-cp-shadow);
	outline: none;
}

.ta-cp__header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}

.ta-cp .ta-cp__logo {
	display: block;
	width: 148px;
	height: auto;
	max-width: 148px;
}

/* Reset first: the parent theme paints plain buttons pink on hover/focus. */
.ta-cp button {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	box-shadow: none;
	color: inherit;
	font: inherit;
	line-height: inherit;
	cursor: pointer;
	-webkit-appearance: none;
	appearance: none;
}

.ta-cp button:hover,
.ta-cp button:focus {
	background: none;
	color: inherit;
}

.ta-cp button:focus {
	outline: none;
}

.ta-cp button:focus-visible,
.ta-cp a:focus-visible,
.ta-cp input:focus-visible {
	outline: 2px solid var(--ta-cp-ink);
	outline-offset: 2px;
}

.ta-cp .ta-cp__close,
.ta-cp .ta-cp__close:hover,
.ta-cp .ta-cp__close:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 44px;
	width: 44px;
	height: 44px;
	border-radius: 22px;
	background: var(--ta-cp-soft);
	color: var(--ta-cp-ink);
}

.ta-cp .ta-cp__close:hover {
	background: var(--ta-cp-card);
}

.ta-cp__close svg {
	display: block;
	width: 20px;
	height: 20px;
}

.ta-cp__intro {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.ta-cp__title {
	margin: 0;
	font-family: var(--ta-cp-font-head);
	font-size: var(--ta-cp-title-size);
	font-weight: 700;
	line-height: var(--ta-cp-title-line);
	color: var(--ta-cp-ink);
}

.ta-cp__desc {
	margin: 0;
	font-size: 15px;
	line-height: 23px;
	color: var(--ta-cp-text);
}

/* ---------------------------------------------------------------- */
/* Form and in-field floating labels                                  */
/* ---------------------------------------------------------------- */

.ta-cp__form {
	display: flex;
	flex-direction: column;
	gap: 14px;
	margin: 0;
}

.ta-cp__field {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: 6px;
	min-width: 0;
}

.ta-cp__control {
	position: relative;
	height: 56px;
	border: 1px solid var(--ta-cp-border);
	border-radius: 8px;
	background: var(--ta-cp-surface);
	transition: border-color 0.15s ease;
}

.ta-cp__control:focus-within {
	border-color: var(--ta-cp-ink);
}

.ta-cp__field.has-error .ta-cp__control {
	border-color: var(--ta-cp-error);
}

.ta-cp .ta-cp__input {
	display: block;
	width: 100%;
	height: 54px;
	margin: 0;
	padding: 22px 15px 6px;
	border: 0;
	border-radius: 8px;
	background: transparent;
	box-shadow: none;
	color: var(--ta-cp-text);
	font-family: var(--ta-cp-font-body);
	font-size: 16px; /* 16px stops iOS from zooming the page on focus */
	font-weight: 400;
	line-height: 26px;
	text-align: right;
	-webkit-appearance: none;
	appearance: none;
}

.ta-cp .ta-cp__input:focus {
	outline: none;
	box-shadow: none;
	border: 0;
	background: transparent;
}

/* Phone numbers, e-mail, date and time stay LTR inside the RTL dialog, still right-aligned. */
.ta-cp .ta-cp__input--ltr {
	direction: ltr;
	text-align: right;
	unicode-bidi: isolate;
}

.ta-cp__label {
	position: absolute;
	top: 50%;
	right: 16px;
	left: 16px;
	margin: 0;
	transform: translateY(-50%);
	transform-origin: right top;
	font-size: 16px;
	line-height: 26px;
	color: var(--ta-cp-muted);
	text-align: right;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
	transition: top 0.15s ease, transform 0.15s ease, font-size 0.15s ease, line-height 0.15s ease;
}

/* Floating position: on focus, with a value (placeholder=" " trick), on autofill, or when JS says so. */
/* type=time has no placeholder, so :placeholder-shown never matches it; its value state comes from JS. */
.ta-cp .ta-cp__input:focus ~ .ta-cp__label,
.ta-cp .ta-cp__input:not([type="time"]):not(:placeholder-shown) ~ .ta-cp__label,
.ta-cp .ta-cp__input:-webkit-autofill ~ .ta-cp__label,
.ta-cp__field.has-value .ta-cp__label,
.ta-cp__field.is-focused .ta-cp__label {
	top: 7px;
	transform: none;
	font-size: 12px;
	line-height: 19px;
}

.ta-cp__field.has-error .ta-cp__label {
	color: var(--ta-cp-error-text);
}

/* Autofill background must not paint over the floating label area. */
.ta-cp .ta-cp__input:-webkit-autofill,
.ta-cp .ta-cp__input:-webkit-autofill:focus {
	-webkit-box-shadow: 0 0 0 100px var(--ta-cp-surface) inset;
	-webkit-text-fill-color: var(--ta-cp-text);
	transition: background-color 9999s ease-out;
}

.ta-cp__error {
	margin: 0;
	font-size: 12px;
	line-height: 19px;
	color: var(--ta-cp-error-text);
}

.ta-cp__error:empty {
	display: none;
}

/* Date + time row: date first in DOM = on the right in RTL, time on the left. */
.ta-cp__pref {
	display: flex;
	flex-direction: column;
	gap: 6px;
}

.ta-cp__row {
	display: flex;
	gap: 12px;
	align-items: flex-start;
}

.ta-cp__row > .ta-cp__field {
	flex: 1 1 0;
}

.ta-cp__control--icon .ta-cp__input {
	padding-left: 42px;
}

.ta-cp__control--icon .ta-cp__label {
	left: 42px;
}

.ta-cp__icon {
	position: absolute;
	top: 17px;
	left: 11px;
	width: 20px;
	height: 20px;
	color: var(--ta-cp-muted);
	pointer-events: none;
}

.ta-cp__icon svg {
	display: block;
	width: 20px;
	height: 20px;
}

/* Clear button replaces the icon once a preference is set (independently clearable). */
.ta-cp .ta-cp__clear,
.ta-cp .ta-cp__clear:hover,
.ta-cp .ta-cp__clear:focus {
	position: absolute;
	top: 12px;
	left: 8px;
	z-index: 2;
	display: none;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
	border-radius: 16px;
	background: transparent;
	color: var(--ta-cp-muted);
	font-size: 20px;
	line-height: 1;
}

.ta-cp .ta-cp__clear:hover {
	background: var(--ta-cp-card);
	color: var(--ta-cp-ink);
}

.ta-cp__field.has-value .ta-cp__clear {
	display: inline-flex;
}

.ta-cp__field.has-value .ta-cp__icon {
	display: none;
}

/* Date field: a read-only input that opens the calendar; the real value lives in a hidden input. */
.ta-cp .ta-cp__input--date {
	cursor: pointer;
	caret-color: transparent;
}

/*
 * Native time input: WebKit always paints the "--:--" mask, which would sit under the centred
 * label. Hide the mask while the field is empty and unfocused; Firefox keeps the label floated
 * instead (see .ta-cp__field--time.is-native-mask below, set by JS when the mask cannot be hidden).
 */
.ta-cp__field--time:not(.has-value) .ta-cp__input:not(:focus)::-webkit-datetime-edit {
	opacity: 0;
}

.ta-cp .ta-cp__input[type="time"]::-webkit-calendar-picker-indicator {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	margin: 0;
	opacity: 0;
	cursor: pointer;
}

.ta-cp .ta-cp__input[type="time"]::-webkit-datetime-edit {
	padding: 0;
}

.ta-cp__field--time.is-native-mask .ta-cp__label {
	top: 7px;
	transform: none;
	font-size: 12px;
	line-height: 19px;
}

.ta-cp__hint {
	margin: 0;
	font-size: 12px;
	line-height: 19px;
	color: var(--ta-cp-muted);
}

/* Visually hidden live region and hidden-but-focusable helpers. */
.ta-cp__sr {
	position: absolute !important;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
}

/* ---------------------------------------------------------------- */
/* Submit, privacy, states                                            */
/* ---------------------------------------------------------------- */

.ta-cp .ta-cp__submit,
.ta-cp .ta-cp__submit:hover,
.ta-cp .ta-cp__submit:focus,
.ta-cp .ta-cp__submit:active {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	min-height: 54px;
	padding: 0 16px;
	border-radius: 27px;
	background: var(--ta-cp-accent);
	color: #fff;
	font-family: var(--ta-cp-font-head);
	font-size: 18px;
	font-weight: 700;
	line-height: 27px;
	text-align: center;
	transition: background-color 0.2s ease, opacity 0.2s ease;
}

.ta-cp .ta-cp__submit:hover:not([disabled]),
.ta-cp .ta-cp__submit:active:not([disabled]) {
	background: var(--ta-cp-accent-hover);
}

.ta-cp .ta-cp__submit[disabled] {
	opacity: 0.75;
	cursor: progress;
}

.ta-cp__privacy {
	display: flex;
	flex-direction: column;
	gap: 3px;
	margin: 0;
	font-size: 12px;
	line-height: 19px;
	text-align: center;
	color: var(--ta-cp-muted);
}

.ta-cp__privacy p {
	margin: 0;
}

.ta-cp .ta-cp__privacy a {
	color: var(--ta-cp-ink);
	text-decoration: underline;
	text-underline-position: from-font;
}

.ta-cp .ta-cp__privacy a:hover {
	color: var(--ta-cp-accent);
}

.ta-cp__send-error {
	margin: 0;
	padding: 10px 12px;
	border-radius: 8px;
	background: var(--ta-cp-error-bg);
	font-size: 13px;
	line-height: 20px;
	color: var(--ta-cp-error-text);
}

.ta-cp__send-error[hidden] {
	display: none;
}

.ta-cp__success {
	display: flex;
	flex-direction: column;
	gap: var(--ta-cp-gap);
}

.ta-cp__success[hidden],
.ta-cp__body[hidden] {
	display: none;
}

.ta-cp__success-inner {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 18px;
	padding: 24px 0;
	text-align: center;
}

.ta-cp__success-mark {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 72px;
	height: 72px;
	border-radius: 36px;
	background: var(--ta-cp-card);
}

.ta-cp__success-mark svg {
	display: block;
	width: 32px;
	height: 32px;
}

.ta-cp__success-title {
	margin: 0;
	font-family: var(--ta-cp-font-head);
	font-size: var(--ta-cp-title-size);
	font-weight: 700;
	line-height: var(--ta-cp-title-line);
	color: var(--ta-cp-ink);
	text-align: center;
}

.ta-cp__success-text {
	margin: 0;
	font-size: 15px;
	line-height: 23px;
	color: var(--ta-cp-text);
	text-align: center;
}

/* ---------------------------------------------------------------- */
/* Calendar (bottom sheet on mobile, centred card from 768px)          */
/* ---------------------------------------------------------------- */

.ta-cp__cal-backdrop {
	position: fixed;
	inset: 0;
	z-index: 1;
	display: none;
	background: var(--ta-cp-cal-backdrop);
}

.ta-cp__cal {
	position: fixed;
	left: 50%;
	bottom: 16px;
	z-index: 2;
	display: none;
	flex-direction: column;
	gap: 12px;
	width: min(312px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	max-height: calc(100dvh - 32px);
	padding: 16px;
	overflow-y: auto;
	border-radius: 24px;
	background: var(--ta-cp-surface);
	box-shadow: var(--ta-cp-shadow);
	transform: translateX(-50%);
	outline: none;
}

.ta-cp[data-calendar="open"] .ta-cp__cal-backdrop,
.ta-cp[data-calendar="open"] .ta-cp__cal {
	display: flex;
}

.ta-cp[data-calendar="open"] .ta-cp__cal-backdrop {
	display: block;
}

.ta-cp__cal-title {
	margin: 0;
	font-size: 16px;
	line-height: 26px;
	color: var(--ta-cp-ink);
	text-align: center;
}

.ta-cp__cal-nav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 44px;
}

.ta-cp .ta-cp__cal-btn,
.ta-cp .ta-cp__cal-btn:hover,
.ta-cp .ta-cp__cal-btn:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	border-radius: 22px;
	font-size: 22px;
	line-height: 22px;
	color: var(--ta-cp-ink);
}

.ta-cp .ta-cp__cal-btn:hover {
	background: var(--ta-cp-card);
}

.ta-cp__cal-month {
	flex: 1 1 auto;
	margin: 0;
	font-size: 16px;
	line-height: 26px;
	color: var(--ta-cp-ink);
	text-align: center;
}

/* Anchored on .ta-cp: the theme and Elementor style plain table cells (borders, striped rows). */
.ta-cp .ta-cp__cal-grid {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: separate;
	border-spacing: 0 2px;
	table-layout: fixed;
	background: transparent;
}

.ta-cp .ta-cp__cal-grid tr,
.ta-cp .ta-cp__cal-grid th,
.ta-cp .ta-cp__cal-grid td {
	border: 0;
	background: transparent;
	box-shadow: none;
}

.ta-cp .ta-cp__cal-grid th {
	height: 40px;
	padding: 0;
	font-size: 12px;
	font-weight: 400;
	line-height: 19px;
	color: var(--ta-cp-muted);
	text-align: center;
	vertical-align: top;
}

.ta-cp .ta-cp__cal-grid td {
	height: 40px;
	padding: 0;
	text-align: center;
	vertical-align: middle;
}

.ta-cp .ta-cp__day,
.ta-cp .ta-cp__day:hover,
.ta-cp .ta-cp__day:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border: 1px solid transparent;
	border-radius: 20px;
	background: transparent;
	font-size: 14px;
	line-height: 22px;
	color: var(--ta-cp-muted);
}

.ta-cp .ta-cp__day:hover:not([disabled]) {
	background: var(--ta-cp-card);
	color: var(--ta-cp-ink);
}

.ta-cp .ta-cp__day.is-today {
	border-color: var(--ta-cp-accent);
}

.ta-cp .ta-cp__day[aria-selected="true"],
.ta-cp .ta-cp__day[aria-selected="true"]:hover,
.ta-cp .ta-cp__day[aria-selected="true"]:focus {
	background: var(--ta-cp-accent);
	border-color: var(--ta-cp-accent);
	color: #fff;
}

.ta-cp .ta-cp__day[disabled] {
	opacity: 0.35;
	cursor: default;
}

.ta-cp .ta-cp__day:focus-visible {
	outline: 2px solid var(--ta-cp-ink);
	outline-offset: 1px;
}

.ta-cp__cal-actions {
	display: flex;
	align-items: center;
	gap: 12px;
}

.ta-cp .ta-cp__cal-confirm,
.ta-cp .ta-cp__cal-confirm:hover,
.ta-cp .ta-cp__cal-confirm:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 1 1 168px;
	height: 44px;
	border-radius: 22px;
	background: var(--ta-cp-accent);
	color: #fff;
	font-size: 14px;
	line-height: 22px;
}

.ta-cp .ta-cp__cal-confirm:hover {
	background: var(--ta-cp-accent-hover);
}

.ta-cp .ta-cp__cal-cancel,
.ta-cp .ta-cp__cal-cancel:hover,
.ta-cp .ta-cp__cal-cancel:focus {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 100px;
	height: 44px;
	border-radius: 22px;
	font-size: 14px;
	line-height: 22px;
	color: var(--ta-cp-muted);
}

.ta-cp .ta-cp__cal-cancel:hover {
	background: var(--ta-cp-card);
	color: var(--ta-cp-ink);
}

/* ---------------------------------------------------------------- */
/* Tablet and desktop                                                 */
/* ---------------------------------------------------------------- */

@media (min-width: 768px) {
	.ta-cp {
		--ta-cp-radius: 32px;
		--ta-cp-pad-top: 24px;
		--ta-cp-pad-x: 32px;
		--ta-cp-pad-bottom: 32px;
		--ta-cp-gap: 20px;
		--ta-cp-title-size: 32px;
		--ta-cp-title-line: 38px;
	}

	.ta-cp__cal {
		top: 50%;
		bottom: auto;
		transform: translate(-50%, -50%);
	}
}

/* ---------------------------------------------------------------- */
/* Motion                                                             */
/* ---------------------------------------------------------------- */

@media (prefers-reduced-motion: no-preference) {
	.ta-cp[data-open="true"] {
		animation: ta-cp-fade 0.18s ease-out;
	}

	.ta-cp[data-open="true"] .ta-cp__dialog {
		animation: ta-cp-rise 0.22s ease-out;
	}

	.ta-cp[data-calendar="open"] .ta-cp__cal {
		animation: ta-cp-rise 0.2s ease-out;
	}
}

@keyframes ta-cp-fade {
	from { opacity: 0; }
	to   { opacity: 1; }
}

@keyframes ta-cp-rise {
	from { opacity: 0; translate: 0 12px; }
	to   { opacity: 1; translate: 0 0; }
}

@media (prefers-reduced-motion: reduce) {
	.ta-cp *,
	.ta-cp *::before,
	.ta-cp *::after {
		transition: none !important;
		animation: none !important;
	}
}