/**
 * Tooltip SSOT — restored from stable 3.05.39 hx-overlays.css
 */
.hx-tooltip {
  position: absolute;
  
  
  padding: var(--hx-space-1) var(--hx-space-2);
  border-radius: var(--hx-radius);
  font-size: inherit;
}
.hx-hover-card {
  position: absolute;
  background: var(--hx-surface);
  border: 0;
  border-radius: var(--hx-radius);
  padding: var(--hx-space-3);
  box-shadow: var(--hx-shadow);
}


/* Migrated from hx-primitives.css — Tooltip (3.04.86) */
/* Tooltip primitive — tokens + light/dark + mobile + WCAG 1.4.13              */
/* -------------------------------------------------------------------------- */
:root,
html[data-theme="light"],
html[data-ds-theme="light"],
.hx-example[data-theme="light"] {
	--hx-tooltip-bg: var(--hx-fg);
	--hx-tooltip-fg: var(--hx-surface);
	--hx-tooltip-link: var(--hx-primary);
	--hx-tooltip-shadow: var(--hx-elev);
}
html[data-theme="dark"],
html[data-ds-theme="dark"],
.hx-example[data-theme="dark"] {
	--hx-tooltip-bg: var(--hx-surface);
	--hx-tooltip-fg: var(--color-charcoal-brand);
	--hx-tooltip-link: var(--hx-primary);
	--hx-tooltip-shadow: var(--hx-elev);
}
html[data-theme="dark"] .hx-tooltip__bubble,
html[data-ds-theme="dark"] .hx-tooltip__bubble,
.hx-example[data-theme="dark"] .hx-tooltip__bubble,
[data-theme="dark"] .hx-tooltip__bubble {
	color: var(--color-charcoal-brand);
	background: var(--hx-surface);
}
.hx-tooltip {
	--hx-tooltip-gap: var(--space-2);
	--hx-tooltip-pad-y: 8px;
	--hx-tooltip-pad-x: 12px;
	--hx-tooltip-radius: 8px;
	--hx-tooltip-max: 280px;
	--hx-tooltip-z: 40;
	--hx-tooltip-delay: 180ms;
	position: relative;
	display: inline-flex;
	align-items: center;
	margin: 0 12px;
	vertical-align: middle;
}
.hx-tooltip--inline {
	margin: 0 4px;
}
.hx-tooltip__anchor {
	display: inline-flex;
	align-items: center;
}
.hx-tooltip__bubble {
	position: absolute;
	left: 50%;
	bottom: calc(100% + var(--hx-tooltip-gap));
	transform: translateX(-50%) translateY(2px);
	z-index: var(--hx-tooltip-z);
	box-sizing: border-box;
	max-width: min(var(--hx-tooltip-max), 80vw);
	padding: var(--hx-tooltip-pad-y) var(--hx-tooltip-pad-x);
	border-radius: var(--hx-tooltip-radius);
	background: var(--hx-tooltip-bg);
	color: var(--hx-tooltip-fg);
	font-size: var(--hx-tooltip-font-size);
	line-height: 1.35;
	font-weight: 500;
	letter-spacing: .01em;
	white-space: normal;
	width: max-content;
	min-width: 0;
	text-align: left;
	box-shadow: var(--hx-tooltip-shadow);
	opacity: 0;
	pointer-events: none;
	visibility: hidden;
	transition: opacity var(--hx-tooltip-delay) ease, transform var(--hx-tooltip-delay) ease, visibility 0s linear var(--hx-tooltip-delay);
}
.hx-tooltip__bubble::after,
.hx-tooltip__caret {
	content: none;
	display: none;
}
.hx-tooltip--up .hx-tooltip__bubble,
.hx-tooltip:not(.hx-tooltip--down):not(.hx-tooltip--left):not(.hx-tooltip--right) .hx-tooltip__bubble {
	bottom: calc(100% + var(--hx-tooltip-gap));
	top: auto;
	left: 50%;
	right: auto;
	transform: translateX(-50%) translateY(2px);
}
.hx-tooltip--down .hx-tooltip__bubble {
	top: calc(100% + var(--hx-tooltip-gap));
	bottom: auto;
	left: 50%;
	transform: translateX(-50%) translateY(-2px);
}
.hx-tooltip--left .hx-tooltip__bubble {
	right: calc(100% + var(--hx-tooltip-gap));
	left: auto;
	top: 50%;
	bottom: auto;
	transform: translateY(-50%) translateX(2px);
}
.hx-tooltip--right .hx-tooltip__bubble {
	left: calc(100% + var(--hx-tooltip-gap));
	right: auto;
	top: 50%;
	bottom: auto;
	transform: translateY(-50%) translateX(-2px);
}
.hx-tooltip.is-open .hx-tooltip__bubble,
.hx-tooltip:hover .hx-tooltip__bubble,
.hx-tooltip:focus-within .hx-tooltip__bubble {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translateX(-50%) translateY(0);
	transition-delay: 0s;
}
.hx-tooltip--left.is-open .hx-tooltip__bubble,
.hx-tooltip--left:hover .hx-tooltip__bubble,
.hx-tooltip--left:focus-within .hx-tooltip__bubble {
	transform: translateY(-50%) translateX(0);
}
.hx-tooltip--right.is-open .hx-tooltip__bubble,
.hx-tooltip--right:hover .hx-tooltip__bubble,
.hx-tooltip--right:focus-within .hx-tooltip__bubble {
	transform: translateY(-50%) translateX(0);
}
.hx-tooltip.is-dismissed .hx-tooltip__bubble {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
.hx-tooltip__link {
	display: block;
	color: var(--hx-tooltip-link);
	margin-top: 4px;
	text-underline-offset: 2px;
}
.hx-tooltip-inline-demo {
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.hx-tooltip--text,
.hx-tooltip:has(.hx-tooltip__trigger-text) {
	margin: 0;
	display: inline;
	vertical-align: baseline;
}
.hx-tooltip--text .hx-tooltip__anchor,
.hx-tooltip:has(.hx-tooltip__trigger-text) .hx-tooltip__anchor {
	display: inline;
}
.hx-tooltip__trigger-text {
	display: inline;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	color: inherit;
	cursor: help;
	text-decoration: underline;
	text-decoration-style: dotted;
	text-underline-offset: 3px;
}
.hx-tooltip__trigger-text:focus-visible {
	outline: 2px solid var(--hx-focus);
	outline-offset: 2px;
	border-radius: 2px;
}
@media (max-width: 640px) {
	.hx-tooltip__bubble {
		white-space: normal;
		max-width: min(240px, 80vw);
	}
}
@media (prefers-reduced-motion: reduce) {
	.hx-tooltip__bubble {
		transition: none;
	}
}


/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-dropdown__link .hx-dropdown__icon svg {
	transform: none;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
button, .ws-button, .hx-link, .hx-dropdown__item, input, select, textarea {
  font-family: var(--font-sans);
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-tooltip {
  border-radius: 8px;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-tooltip__bubble {
  border-radius: 8px;
  overflow: hidden;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-preview-card__stage[data-theme="dark"] .hx-dropdown__menu {
  border-radius: 8px;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-dropdown__menu {
  overflow: hidden;
  border-radius: 8px;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-preview-card__stage[data-theme="light"] .hx-dropdown__menu {
  background: var(--hx-surface);
  color: var(--hx-fg);
  border-color: var(--hx-line);
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
html[data-theme="dark"] .hx-dropdown button:hover svg {
  fill: currentColor;
  stroke: currentColor;
  color: inherit;
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-example[data-theme="dark"] .hx-dropdown button {
  color: var(--hx-fg);
}

/* Auto-migrated from hx-primitives.css (3.04.90) */
/* Auto-migrated from hx-primitives.css (3.04.90) */
.hx-preview-card__stage[data-theme="light"] .hx-tooltip__bubble {
  background: var(--hx-fg);
  color: var(--hx-surface);
}


/* 3.04.94 — 4-variant readiness (light/dark × desktop/mobile)
   Controlled by data-theme + data-hx-vp on <html>.
   All styles token-driven. Composition with other primitives encouraged. */
html[data-theme="light"][data-hx-vp="desktop"],
html[data-theme="light"][data-hx-vp="mobile"],
html[data-theme="dark"][data-hx-vp="desktop"],
html[data-theme="dark"][data-hx-vp="mobile"] {
  /* tokens flip automatically */
}

/* Light bubble — not dark fill. Anchored on ButtonIcon Action Bar. */
.hx-tooltip__bubble {
  background: var(--hx-tooltip-bg);
  color: var(--hx-fg);
  border: 0;
  box-shadow: var(--shadow-low);
}
.hx-tooltip--up .hx-tooltip__bubble,
.hx-tooltip--down .hx-tooltip__bubble,
.hx-tooltip--left .hx-tooltip__bubble,
.hx-tooltip--right .hx-tooltip__bubble {
  background: var(--hx-tooltip-bg);
  color: var(--hx-fg);
}

/* Tooltip bubble matches Action Bar surface — never dark fill */
.hx-tooltip__bubble,
.hx-tooltip--up .hx-tooltip__bubble,
.hx-tooltip--down .hx-tooltip__bubble,
.hx-tooltip--left .hx-tooltip__bubble,
.hx-tooltip--right .hx-tooltip__bubble {
  background: var(--hx-tooltip-bg);
  color: var(--hx-fg);
  border: 0;
  box-shadow: var(--shadow-low);
}

/* Default text is charcoal (was --hx-surface / white, invisible on light bubble) */
.hx-tooltip,
.hx-tooltip__bubble {
  color: var(--hx-fg);
}

/* No border on tooltip bubble */
.hx-tooltip__bubble { border: 0; }

/* Inline text trigger matches surrounding copy */
.hx-tooltip__trigger-text,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit;
}

/* Dark theme */
//
///* Inline text matches surrounding 16px copy */
//.hx-tooltip-inline-copy,
//.hx-tooltip-inline-copy .hx-tooltip,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text,
.hx-tooltip--text .hx-tooltip__trigger-text,
.hx-tooltip--inline.hx-tooltip--text {
  font-size: var(--hx-tooltip-inline-size);
  line-height: 1.5;
}

/* Inline text trigger: no padding */
.hx-tooltip.hx-tooltip--up.hx-tooltip--inline.hx-tooltip--text,
.hx-tooltip--inline.hx-tooltip--text,
.hx-tooltip--text .hx-tooltip__anchor,
.hx-tooltip--text .hx-tooltip__trigger-text {
  padding: 0;
  margin: 0;
}

/* Dark theme bubble readiness */
html[data-theme="dark"] .hx-tooltip__bubble,
html[data-ds-theme="dark"] .hx-tooltip__bubble {
  background: var(--hx-tooltip-bg);
  color: var(--hx-tooltip-fg);
  box-shadow: var(--hx-tooltip-shadow);
}

/* Inline text size alignment */
.hx-tooltip__bubble,
.hx-tooltip__bubble p,
.hx-tooltip__bubble span,
.hx-tooltip-inline {
  font-size: var(--hx-tooltip-font-size);
  line-height: var(--hx-tooltip-line-height);
}

/* Dark: tooltip bubble — charcoal-brand font on light surface (SSOT) */
html[data-theme="dark"] .hx-tooltip__bubble,
html[data-ds-theme="dark"] .hx-tooltip__bubble,
.hx-example[data-theme="dark"] .hx-tooltip__bubble,
html[data-theme="dark"] .hx-app .hx-tooltip__bubble,
html[data-theme="dark"] .hx-tooltip__bubble * {
  background: var(--hx-on-primary);
  color: var(--color-charcoal-brand);
  box-shadow: var(--hx-elev);
}

/* Dark: tooltip trigger icons — hover sets charcoal-brand */
html[data-theme="dark"] .hx-tooltip .hx-icon,
html[data-theme="dark"] .hx-tooltip svg,
html[data-ds-theme="dark"] .hx-tooltip .hx-icon {
  color: var(--hx-fg);
  opacity: 0.9;
}
html[data-theme="dark"] .hx-tooltip:hover .hx-iconbtn,
html[data-theme="dark"] .hx-tooltip:hover .hx-iconbtn svg,
html[data-theme="dark"] .hx-tooltip:hover .hx-iconbtn__glyph,
html[data-theme="dark"] .hx-tooltip:hover .hx-icon,
html[data-theme="dark"] .hx-tooltip:focus-within .hx-iconbtn,
html[data-theme="dark"] .hx-tooltip:focus-within .hx-iconbtn svg {
  color: var(--hx-fg);
  fill: var(--hx-fg);
  opacity: 1;
}

/* Unified inline text size — single source */
.hx-tooltip__trigger-text,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text,
.hx-tooltip--text .hx-tooltip__trigger-text,
.hx-tooltip--inline.hx-tooltip--text {
  font-size: var(--hx-tooltip-inline-size);
  line-height: var(--hx-tooltip-inline-leading);
  font-weight: inherit;
}

.hx-tooltip__bubble {
  font-size: var(--hx-tooltip-font-size);
}

/* Final inline text — single size, visible in dark */
.hx-tooltip__trigger-text,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text,
.hx-tooltip--text .hx-tooltip__trigger-text {
  font-size: var(--hx-tooltip-inline-size);
  line-height: 1.5;
  color: var(--hx-fg);
  text-decoration: underline;
  text-underline-offset: 2px;
}

html[data-theme="dark"] .hx-tooltip__trigger-text,
html[data-ds-theme="dark"] .hx-tooltip__trigger-text,
.hx-example[data-theme="dark"] .hx-tooltip__trigger-text {
  color: var(--hx-fg);
}

/* Inline trigger text — force size independent of wrapper */
.hx-tooltip--inline,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip__trigger-text {
  font-size: var(--hx-tooltip-inline-size);
}

/* Authoritative inline text size */
.hx-tooltip--inline,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip__trigger-text,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text {
  font-size: var(--hx-tooltip-inline-size);
  line-height: 1.5;
}

/* Align inline tooltip with surrounding copy */
.hx-tooltip-inline-copy {
  font-size: var(--hx-tooltip-inline-size);
}
.hx-tooltip--inline,
.hx-tooltip--inline .hx-tooltip__trigger-text,
.hx-tooltip__trigger-text,
.hx-tooltip-inline-copy .hx-tooltip__trigger-text,
.hx-tooltip--inline.hx-tooltip--text {
  font-size: var(--hx-tooltip-inline-size);
}