/*
 * baruschke Glossar – Aussehen.
 * Farben und Schriften kommen aus dem Elementor-Kit (globale Variablen),
 * die Werte dahinter sind nur Rückfallwerte.
 */
.bg-begriff {
	color: inherit;
	text-decoration: none;
	border-bottom: 1px dashed var(--e-global-color-primary, #C17039);
	cursor: help;
	transition: color 0.15s ease;
}

/* Begriffe ohne Link: Schriftfarbe des umgebenden Textes, kein Farbwechsel.
   !important, weil Elementor Farben je Widget sehr spezifisch setzt. */
span.bg-begriff,
span.bg-begriff:hover,
span.bg-begriff:focus,
span.bg-begriff[aria-expanded="true"] {
	color: inherit !important;
}

/* Begriffe mit Link: überall in der Primärfarbe, auch in Überschriften und Listen.
   Beim Darüberfahren dunkler (Akzent), damit der Link als Link erkennbar bleibt. */
a.bg-begriff {
	cursor: pointer;
	color: var(--e-global-color-primary, #C17039) !important;
}

a.bg-begriff:hover,
a.bg-begriff:focus,
a.bg-begriff[aria-expanded="true"] {
	color: var(--e-global-color-accent, #9E5A2A) !important;
}

/* Elementor setzt Links in Symbollisten auf display:flex – Begriffe bleiben im Textfluss. */
.elementor-widget .elementor-icon-list-item a.bg-begriff {
	display: inline;
}

.bg-begriff:focus-visible {
	outline: 2px solid var(--e-global-color-primary, #C17039);
	outline-offset: 3px;
	border-radius: 2px;
}

.bg-tooltip {
	position: fixed;
	z-index: 9999;
	max-width: 330px;
	padding: 13px 15px;
	background: var(--e-global-color-grund01, #FFFDFC);
	color: var(--e-global-color-text, #241B16);
	border: 1px solid var(--e-global-color-primary, #C17039);
	box-shadow: 0 14px 38px rgba(24, 19, 16, 0.18);
	font-family: var(--e-global-typography-klein01-font-family, "IBM Plex Sans"), sans-serif;
	font-size: 14px;
	font-weight: 400;
	font-style: normal;
	line-height: 1.52;
	letter-spacing: normal;
	text-transform: none;
	text-align: left;
	opacity: 0;
	transition: opacity 0.11s ease;
}

.bg-tooltip.ist-sichtbar {
	opacity: 1;
}

.bg-tooltip[hidden] {
	display: none;
}

.bg-tooltip__titel {
	display: block;
	margin-bottom: 6px;
	font-family: var(--e-global-typography-secondary-font-family, "IBM Plex Mono"), monospace;
	font-size: 11px;
	letter-spacing: 0.09em;
	text-transform: uppercase;
	color: var(--e-global-color-accent, #9E5A2A);
}

.bg-tooltip__text {
	display: block;
}

@media (prefers-reduced-motion: reduce) {
	.bg-begriff,
	.bg-tooltip {
		transition: none;
	}
}

@media print {
	.bg-tooltip {
		display: none;
	}
	.bg-begriff {
		border-bottom: 0;
	}
}