/*
 * Raemsha Compendium — auto-link + glossary popover styles.
 * Consumes the child theme's design tokens (with fallbacks) so it matches the
 * illuminated-manuscript palette without depending on the theme being loaded.
 */

/* --- Links ------------------------------------------------------------ */

.rc-link {
	text-decoration: none;
}

/* Entity (Lunel) links: a soft gold underline. */
.rc-link--entry {
	color: var(--lavender-deep, #1353b9);
	background-image: linear-gradient(var(--gold, #b3904c), var(--gold, #b3904c));
	background-repeat: no-repeat;
	background-size: 100% 1px;
	background-position: 0 1.08em;
	transition: color 0.2s ease, background-size 0.2s ease;
}

.rc-link--entry:hover,
.rc-link--entry:focus {
	color: var(--gold-deep, #8c6d34);
	background-size: 100% 2px;
}

/* Lexeme (language) links: dotted underline + a small marker glyph. */
.rc-link--lex {
	color: var(--ink, #16233f);
	border-bottom: 1px dotted var(--gold-deep, #8c6d34);
	cursor: help;
}

.rc-link--lex:hover,
.rc-link--lex:focus {
	color: var(--gold-deep, #8c6d34);
	border-bottom-style: solid;
}

.rc-link--lex::after {
	content: "\2023"; /* triangular bullet */
	margin-left: 0.12em;
	font-size: 0.72em;
	vertical-align: 0.32em;
	color: var(--gold, #b3904c);
	opacity: 0.85;
}

/* --- Popover ---------------------------------------------------------- */

.rc-popover {
	position: absolute;
	z-index: 9999;
	max-width: 320px;
	padding: 0.8rem 0.95rem;
	background: var(--parchment, #eaf3f7);
	color: var(--ink, #16233f);
	border: 1px solid var(--gold, #b3904c);
	border-radius: var(--card-radius, 12px);
	box-shadow: var(--shadow-lift, 0 14px 38px rgba(16, 28, 51, 0.24));
	font-family: var(--font-body, Georgia, "Times New Roman", serif);
	font-size: 0.95rem;
	line-height: 1.45;
	opacity: 0;
	transform: translateY(4px);
	transition: opacity 0.15s ease, transform 0.15s ease;
	pointer-events: none;
}

.rc-popover.is-visible {
	opacity: 1;
	transform: none;
	pointer-events: auto;
}

.rc-popover__arrow {
	position: absolute;
	width: 10px;
	height: 10px;
	background: var(--parchment, #eaf3f7);
	border-left: 1px solid var(--gold, #b3904c);
	border-top: 1px solid var(--gold, #b3904c);
	transform: rotate(45deg);
}

.rc-popover__term {
	margin: 0 0 0.1rem;
	font-family: var(--font-heading, "Almendra", "Cinzel", Georgia, serif);
	font-size: 1.12rem;
	color: var(--navy, #101c33);
}

.rc-popover__ipa {
	margin: 0 0 0.4rem;
	color: var(--ink-soft, #4d6d8c);
	font-style: italic;
}

.rc-popover__def {
	margin: 0 0 0.55rem;
}

.rc-popover__foot {
	display: flex;
	gap: 0.9rem;
	align-items: center;
}

.rc-popover__audio,
.rc-popover__link {
	padding: 0;
	background: none;
	border: 0;
	color: var(--gold-deep, #8c6d34);
	font: inherit;
	text-decoration: underline;
	cursor: pointer;
}

.rc-popover__audio:hover,
.rc-popover__link:hover,
.rc-popover__audio:focus,
.rc-popover__link:focus {
	color: var(--navy, #101c33);
}

@media (prefers-reduced-motion: reduce) {
	.rc-popover {
		transition: none;
	}
}