/* ==========================================================
   NmTooltip — data-nm-tooltip / data-nm-tooltip-pos
   Glass surface, four positions, fade+slide animation.
   JS: public/assets/js/core/tooltip.js
   ========================================================== */
#nm-tooltip {
	position: fixed;
	z-index: 9999;
	max-width: 220px;
	padding: 7px 11px;
	font-size: 0.775rem;
	line-height: 1.55;
	color: var(--nm-text);
	background: var(--glass-bg-strong);
	-webkit-backdrop-filter: var(--glass-blur);
	backdrop-filter: var(--glass-blur);
	border: 1px solid var(--glass-border);
	border-radius: var(--nm-radius-xs);
	box-shadow: var(--glass-shadow);
	pointer-events: none;
	opacity: 0;
	transform: translateY(4px);
	transition: opacity 130ms ease, transform 130ms ease;
	word-break: break-word;
}

#nm-tooltip.nm-tooltip--visible {
	opacity: 1;
	transform: translateY(0);
}

/* Arrow — pure-CSS triangle via collapsed borders */
#nm-tooltip::after {
	content: '';
	position: absolute;
	border: 5px solid transparent;
}

/* top: tooltip above target, arrow points down */
#nm-tooltip[data-pos="top"]::after {
	border-top-color: var(--nm-surface);
	bottom: -10px;
	left: 50%;
	transform: translateX(-50%);
}

/* bottom: tooltip below target, arrow points up */
#nm-tooltip[data-pos="bottom"]::after {
	border-bottom-color: var(--nm-surface);
	top: -10px;
	left: 50%;
	transform: translateX(-50%);
}

/* left: tooltip left of target, arrow points right */
#nm-tooltip[data-pos="left"]::after {
	border-left-color: var(--nm-surface);
	right: -10px;
	top: 50%;
	transform: translateY(-50%);
}

/* right: tooltip right of target, arrow points left */
#nm-tooltip[data-pos="right"]::after {
	border-right-color: var(--nm-surface);
	left: -10px;
	top: 50%;
	transform: translateY(-50%);
}
