/*
 * Footer styles owned by the theme (the footer body itself is Elementor and
 * carries its own per-page CSS). This is only the clipboard tooltip, ported from
 * the compiled CSS (index-CTd4ANgl.css), shared site wide because the footer, and
 * so the .save_to_clipboard items, render on every template.
 */

.clipboard-tooltip {
	position: absolute;
	padding: 4px 8px;
	background: #000;
	color: #fff;
	font-size: 12px;
	border-radius: 4px;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.2s ease;
	white-space: nowrap;
	z-index: 9999;
}

.clipboard-tooltip.visible {
	opacity: 1;
}

/*
 * Tap confirmation for the mobile contact affordance (divergence 11, A6).
 *
 * Deliberately anchored to the element rather than following a cursor, because
 * the whole point is that it must be visible with no hover state. It sits above
 * the address, is inert to pointer events, and fades out on its own.
 */
.save_to_clipboard {
	position: relative;
}

.clipboard-tapped {
	position: absolute;
	left: 0;
	bottom: 100%;
	margin-bottom: 6px;
	padding: 4px 8px;
	background: #000;
	color: #fff;
	font-size: 12px;
	line-height: 1.4;
	border-radius: 4px;
	white-space: nowrap;
	pointer-events: none;
	opacity: 0;
	transition: opacity 0.25s ease;
	z-index: 9999;
}

.clipboard-tapped.visible {
	opacity: 1;
}

/*
 * Reduced motion: the confirmation still appears and still goes away, it just
 * does not animate. The capability is preserved, only the transition is dropped.
 */
@media ( prefers-reduced-motion: reduce ) {
	.clipboard-tapped {
		transition: none;
	}
}

/*
 * Book a meeting link in the contact block.
 *
 * The heading widgets in the footer are styled by Elementor, but an anchor
 * inside one picks up the global link colour instead, which rendered the CTA in
 * default blue against the surrounding ink. Inheriting from the heading keeps
 * the block reading as one piece of type rather than a stray link.
 */
.elementor-element-amberbk01 .elementor-heading-title a,
.save_to_clipboard .elementor-heading-title a {
	color: inherit;
	font-weight: inherit;
	text-decoration: none;
	transition: opacity 0.2s ease;
}

.elementor-element-amberbk01 .elementor-heading-title a:hover,
.elementor-element-amberbk01 .elementor-heading-title a:focus-visible,
.save_to_clipboard .elementor-heading-title a:hover,
.save_to_clipboard .elementor-heading-title a:focus-visible {
	opacity: 0.6;
}

/*
 * Sizing and spacing for "Book a meeting" are not set here. It is an Elementor
 * widget, so its own settings carry the typography and padding (matched to
 * info@ambercomm.ae), which keeps the styling where an editor can see it and
 * avoids a specificity fight with Elementor's generated per-widget CSS.
 *
 * The widget stays an h5 deliberately: the clipboard handler copies the first
 * h4 inside a copy block, so an h4 here could take the address's place if the
 * markup were ever moved back inside one.
 */

@media ( prefers-reduced-motion: reduce ) {
	.elementor-element-amberbk01 .elementor-heading-title a,
	.save_to_clipboard .elementor-heading-title a {
		transition: none;
	}
}