/* Layout, typography and field dimensions remain in native Elementor controls. */
.tooto-contact {
	--tooto-contact-focus: var(--theme-palette-color-1, #f33030);
	--tooto-contact-arrow-width: 28px;
	--tooto-contact-arrow-height: 20px;
	--tooto-contact-arrow-gap: 12px;
}

.tooto-contact__details a {
	overflow-wrap: anywhere;
	text-underline-offset: 2px;
}

/* This decorative 1px container is edited through Navigator, not an empty drop zone. */
.tooto-contact__divider > .elementor-empty-view {
	display: none;
}

.tooto-contact__details a:focus-visible,
.tooto-contact__form .ff-btn-submit:focus-visible {
	outline: 2px solid var(--tooto-contact-focus);
	outline-offset: 4px;
}

/* Match Blocksy's Fluent Forms integration selector, scoped to this component. */
.tooto-contact__form .fluentform .ff-el-group button.ff-btn {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	gap: var(--tooto-contact-arrow-gap);
	text-align: left;
}

/* Replace Blocksy's decorative shadow; Fluent Forms keeps ::after for progress. */
.tooto-contact__form .fluentform .ff-el-group button.ff-btn::before {
	content: "";
	display: block;
	position: static;
	inset: auto;
	z-index: auto;
	opacity: 1;
	filter: none;
	border-radius: 0;
	transition: none;
	order: 1;
	flex: 0 0 var(--tooto-contact-arrow-width);
	width: var(--tooto-contact-arrow-width);
	height: var(--tooto-contact-arrow-height);
	background: url("../svg/contact/arrow.svg") center / 100% 100% no-repeat;
}

.tooto-contact__form .ff-btn-submit:active {
	filter: brightness(0.9);
}

.tooto-contact__form .ff-btn-submit:disabled {
	cursor: wait;
}

.tooto-contact__form .ff-message-success {
	overflow-wrap: anywhere;
}

@media (prefers-reduced-motion: reduce) {
	.tooto-contact__form .fluentform .ff-el-group button.ff-btn,
	.tooto-contact__form .ff-el-form-control,
	.tooto-contact__form .ff-btn.ff-working::after {
		animation: none;
		transition: none;
	}
}