/**
 * Footnotes for Avada – front-end styles.
 *
 * Design options are passed as --ffa-* custom properties in the element's style
 * attribute. Optional ones are applied via [style*="--ffa-…:"] so that unset
 * options keep the theme's styling instead of falling back to "inherit".
 */

.ffa-visually-hidden {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	white-space: nowrap;
	width: 1px;
}

/* Footnote marker and tooltip. */

.ffa-footnote__marker {
	font-size: 0.75em;
	line-height: 0;
	position: relative;
	vertical-align: super;
}

.ffa-footnote__link {
	padding: 0 0.1em;
	text-decoration: none;
}

.ffa-footnote__link:focus-visible {
	outline: 2px solid currentcolor;
	outline-offset: 2px;
}

.ffa-footnote__tooltip {
	background: #1d2327;
	border-radius: 4px;
	bottom: calc(100% + 0.6em);
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
	color: #fff;
	font-size: 0.875rem;
	font-style: normal;
	font-weight: 400;
	left: 50%;
	letter-spacing: normal;
	line-height: 1.4;
	max-width: min(20rem, calc(100vw - 2rem));
	opacity: 0;
	overflow-wrap: anywhere;
	padding: 0.5em 0.75em;
	position: absolute;
	text-align: left;
	text-transform: none;
	transform: translateX(calc(-50% + var(--ffa-tooltip-shift, 0px)));
	transition: opacity 0.15s ease, visibility 0.15s;
	visibility: hidden;
	white-space: normal;
	width: max-content;
	z-index: 10000;
}

/* Bridge so the pointer can move onto the tooltip without closing it. */
.ffa-footnote__tooltip::after {
	content: "";
	height: 0.6em;
	left: 0;
	position: absolute;
	right: 0;
	top: 100%;
}

.ffa-footnote__marker:hover .ffa-footnote__tooltip,
.ffa-footnote__marker:focus-within .ffa-footnote__tooltip {
	opacity: 1;
	visibility: visible;
}

.ffa-footnote__marker.ffa-footnote__marker--dismissed .ffa-footnote__tooltip {
	opacity: 0;
	visibility: hidden;
}

.ffa-footnote__tooltip-title,
.ffa-footnote__tooltip-url {
	display: block;
}

.ffa-footnote__tooltip-title {
	font-weight: 600;
}

.ffa-footnote__tooltip-url {
	opacity: 0.85;
}

.ffa-footnote__marker--invalid {
	color: #d63638;
}

/* Reference list. */

.ffa-references {
	background-color: var(--ffa-background-color, transparent);
	border-color: var(--ffa-border-color, currentcolor);
	border-radius: var(--ffa-border-radius-top-left, 0) var(--ffa-border-radius-top-right, 0) var(--ffa-border-radius-bottom-right, 0) var(--ffa-border-radius-bottom-left, 0);
	border-style: var(--ffa-border-style, solid);
	border-width: var(--ffa-border-sizes-top, 0) var(--ffa-border-sizes-right, 0) var(--ffa-border-sizes-bottom, 0) var(--ffa-border-sizes-left, 0);
	color: var(--ffa-list-color, inherit);
	font-family: var(--ffa-list-font-family, inherit);
	font-size: var(--ffa-list-font-size, inherit);
	font-style: var(--ffa-list-font-style, inherit);
	font-weight: var(--ffa-list-font-weight, inherit);
	letter-spacing: var(--ffa-list-letter-spacing, inherit);
	line-height: var(--ffa-list-line-height, inherit);
	margin: var(--ffa-margin-top, 0) var(--ffa-margin-right, 0) var(--ffa-margin-bottom, 0) var(--ffa-margin-left, 0);
	padding: var(--ffa-padding-top, 0) var(--ffa-padding-right, 0) var(--ffa-padding-bottom, 0) var(--ffa-padding-left, 0);
	text-transform: var(--ffa-list-text-transform, inherit);
}

.ffa-references__list {
	margin: 0;
	padding-inline-start: 2em;
}

.ffa-references__item {
	overflow-wrap: anywhere;
	scroll-margin-top: var(--ffa-scroll-offset, 6rem);
}

.ffa-references__item:target {
	background-color: rgba(255, 213, 0, 0.25);
}

.ffa-references__backlinks {
	white-space: nowrap;
}

.ffa-references__backlink {
	text-decoration: none;
}

.ffa-references__empty[hidden] {
	display: none;
}

.ffa-references[style*="--ffa-link-color:"] .ffa-references__link,
.ffa-references[style*="--ffa-link-color:"] .ffa-references__backlink {
	color: var(--ffa-link-color);
}

.ffa-references[style*="--ffa-link-hover-color:"] .ffa-references__link:is(:hover, :focus),
.ffa-references[style*="--ffa-link-hover-color:"] .ffa-references__backlink:is(:hover, :focus) {
	color: var(--ffa-link-hover-color);
}

@media (prefers-reduced-motion: reduce) {

	.ffa-footnote__tooltip {
		transition: none;
	}
}
