/* Fusion — Intent widget (floating WhatsApp button + capture modal) */

/* Floating WhatsApp button */
.fr-intent-fab {
	position: fixed;
	right: clamp(0.85rem, 2.5vw, 1.5rem);
	bottom: clamp(0.85rem, 2.5vw, 1.5rem);
	z-index: 9000;
	display: inline-flex;
	align-items: center;
	gap: 0.45rem;
	padding: 0.7rem 1.05rem 0.7rem 0.85rem;
	background: #25d366;
	color: #fff;
	border: none;
	border-radius: 999px;
	font-family: var(--fr-font-display, system-ui);
	font-weight: 700;
	font-size: 0.9375rem;
	box-shadow: 0 10px 24px rgba(0, 0, 0, 0.18);
	cursor: pointer;
	transition: transform 180ms ease, box-shadow 180ms ease;
}
.fr-intent-fab:hover {
	transform: translateY(-2px);
	box-shadow: 0 14px 30px rgba(0, 0, 0, 0.22);
}
.fr-intent-fab svg {
	flex-shrink: 0;
}
/* Collapsed by default — a circular bubble, not a labelled pill.
   The design system's overlay policy is explicit that chat widgets stay
   collapsed until tapped, and the reference homepage renders exactly that. The
   label is kept in the DOM for screen readers and revealed on hover/focus on
   pointer devices, so the affordance is still discoverable without the widget
   sitting over the content. */
.fr-intent-fab {
	padding: 0.85rem;
	gap: 0;
}
.fr-intent-fab__label {
	display: inline-block;
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	opacity: 0;
	transition: max-width 200ms ease, opacity 160ms ease, margin-left 200ms ease;
}
@media (hover: hover) and (pointer: fine) {
	.fr-intent-fab:hover .fr-intent-fab__label,
	.fr-intent-fab:focus-visible .fr-intent-fab__label {
		max-width: 7rem;
		opacity: 1;
		margin-left: 0.45rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	.fr-intent-fab__label { transition: none; }
}

/* Modal */
.fr-intent-modal[hidden] { display: none; }
.fr-intent-modal {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
}
.fr-intent-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(11, 12, 35, 0.55);
	backdrop-filter: blur(3px);
}
.fr-intent-modal__panel {
	position: relative;
	background: #fff;
	border-radius: 14px;
	padding: clamp(1.5rem, 4vw, 2rem);
	max-width: 26rem;
	width: 100%;
	box-shadow: 0 30px 60px rgba(0, 0, 0, 0.3);
}
.fr-intent-modal__close {
	position: absolute;
	top: 0.65rem;
	right: 0.65rem;
	width: 2.25rem;
	height: 2.25rem;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: transparent;
	border: none;
	border-radius: 50%;
	color: var(--fr-navy, #2B3B59);
	cursor: pointer;
}
.fr-intent-modal__close:hover {
	background: var(--fr-cream, #EFE8DA);
}
.fr-intent-modal__title {
	margin: 0 0 0.3rem;
	color: var(--fr-navy-deep, #1a2740);
	font: 600 21px/1.25 var(--fr-font-display, system-ui);
}
.fr-intent-modal__intro {
	margin: 0 0 1.25rem;
	color: var(--fr-body-text, #6b7280);
	font: 400 14px/1.55 var(--fr-font-body, system-ui);
}

.fr-intent-form {
	display: grid;
	gap: 0.85rem;
}
.fr-intent-field {
	display: grid;
	gap: 0.3rem;
}
.fr-intent-field label {
	font: 500 12.5px/1.3 var(--fr-font-body, system-ui);
	color: var(--fr-navy, #2B3B59);
}
.fr-intent-field input {
	width: 100%;
	box-sizing: border-box;
	padding: 11px 13px;
	border: 1px solid var(--fr-border, rgba(43,59,89,0.22));
	border-radius: var(--fr-radius-md, 8px);
	background: var(--fr-white, #fff);
	color: var(--fr-navy-deep, #1a2740);
	font: 400 14px var(--fr-font-body, system-ui);
}
.fr-intent-field input:focus {
	outline: none;
	border-color: var(--fr-gold, #B88A48);
	box-shadow: 0 0 0 3px rgba(184, 138, 72, 0.22);
}
.fr-intent-consent {
	display: flex;
	gap: 0.6rem;
	align-items: flex-start;
	font: 400 12.5px/1.5 var(--fr-font-body, system-ui);
	color: var(--fr-body-text, #6b7280);
}
.fr-intent-consent input[type=checkbox] {
	margin-top: 0.2rem;
}
.fr-intent-consent a {
	color: var(--fr-gold-dark, #996338);
	text-decoration: underline;
}
.fr-intent-error {
	margin: 0;
	color: #B30000;
	font: 500 13px/1.4 var(--fr-font-body, system-ui);
}
.fr-intent-submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	background: linear-gradient(135deg, var(--fr-gold-light, #D9B37C), var(--fr-gold, #B88A48));
	color: var(--fr-navy-deep, #1a2740);
	border: none;
	border-radius: var(--fr-radius-md, 8px);
	padding: 14px 24px;
	font: 600 13px/1 var(--fr-font-body, system-ui);
	letter-spacing: .1em;
	text-transform: uppercase;
	cursor: pointer;
	transition: transform 180ms ease, box-shadow 180ms ease;
	box-shadow: var(--fr-shadow-gold, 0 6px 14px rgba(184, 138, 72, 0.35));
}
.fr-intent-submit:hover {
	transform: translateY(-1px);
	filter: brightness(1.04);
}
.fr-intent-submit.is-loading {
	opacity: 0.7;
	pointer-events: none;
}

/* When modal is open, prevent body scroll */
body.fr-intent-open {
	overflow: hidden;
}
