/**
 * NexaLance Health Trend Graph for Elementor
 */

.elementor-widget-nexalance-health-trend-graph {
	width: 100%;
}

.nlhtg-card,
.nlhtg-card * {
	box-sizing: border-box;
}

.nlhtg-card {
	--nlhtg-surface-highlight: rgba(255, 246, 241, 0.08);
	--nlhtg-surface-shadow: rgba(42, 5, 5, 0.26);
	--nlhtg-line-color: #ff7043;
	--nlhtg-line-width: 4px;
	--nlhtg-line-glow: rgba(255, 112, 67, 0.18);
	--nlhtg-area-top: rgba(255, 241, 235, 0.2);
	--nlhtg-area-bottom: rgba(42, 8, 8, 0.34);
	--nlhtg-area-opacity: 1;
	--nlhtg-grid-color: rgba(255, 247, 243, 0.12);
	--nlhtg-grid-width: 1px;
	--nlhtg-baseline-color: rgba(255, 247, 243, 0.2);
	--nlhtg-baseline-width: 1px;
	--nlhtg-marker-size: 16px;
	--nlhtg-marker-fill: #943232;
	--nlhtg-marker-border: #ff7043;
	--nlhtg-marker-border-width: 3px;
	--nlhtg-marker-glow: rgba(255, 112, 67, 0.22);
	--nlhtg-marker-focus: #fff4ed;
	--nlhtg-marker-hover-scale: 1.18;
	--nlhtg-tooltip-bg: #fff8f4;
	--nlhtg-tooltip-arrow: #fff8f4;
	--nlhtg-line-duration: 1300ms;
	--nlhtg-area-duration: 850ms;
	--nlhtg-point-duration: 420ms;
	--nlhtg-animation-easing: cubic-bezier(0.22, 1, 0.36, 1);

	position: relative;
	isolation: isolate;
	width: 100%;
	max-width: 860px;
	overflow: hidden;
	padding: 28px 32px 24px;
	border: 1px solid rgba(255, 245, 240, 0.12);
	border-radius: 24px;
	background-color: #943232;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
	color: #fff9f6;
	container-name: nlhtg-card;
	container-type: inline-size;
	transform: translateZ(0);
	transition: transform 260ms ease, box-shadow 260ms ease;
}

.nlhtg-direction-ltr .nlhtg-card {
	direction: ltr;
}

.nlhtg-direction-rtl .nlhtg-card {
	direction: rtl;
}

.nlhtg-direction-inherit .nlhtg-card {
	direction: inherit;
}

.nlhtg-overflow-visible {
	overflow: visible;
}

.nlhtg-overflow-hidden {
	overflow: hidden;
}

.nlhtg-surface {
	position: absolute;
	z-index: 0;
	inset: 0;
	border-radius: inherit;
	pointer-events: none;
	background:
		radial-gradient(circle at 18% 8%, var(--nlhtg-surface-highlight) 0%, transparent 38%),
		radial-gradient(circle at 82% 98%, var(--nlhtg-surface-shadow) 0%, transparent 54%),
		linear-gradient(132deg, rgba(255, 255, 255, 0.018), transparent 48%, rgba(0, 0, 0, 0.045));
}

.nlhtg-surface::after {
	position: absolute;
	inset: 0;
	border-radius: inherit;
	background: linear-gradient(108deg, rgba(255, 255, 255, 0.025), transparent 23%, transparent 74%, rgba(0, 0, 0, 0.035));
	content: "";
}

.nlhtg-header,
.nlhtg-legend,
.nlhtg-chart-shell {
	position: relative;
	z-index: 2;
}

.nlhtg-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	column-gap: 24px;
	margin-bottom: 20px;
}

.nlhtg-title {
	min-width: 0;
	margin: 0;
	color: #fff9f6;
	font-family: inherit;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.015em;
}

.nlhtg-period {
	flex: 0 0 auto;
	max-width: 46%;
	padding-top: 1px;
	color: #fff7f2;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.35;
	text-align: end;
	white-space: nowrap;
}

.nlhtg-legend {
	display: flex;
	align-items: center;
	width: fit-content;
	max-width: 100%;
	gap: 8px;
	margin-bottom: 16px;
}

.nlhtg-legend-dot {
	flex: 0 0 auto;
	width: 7px;
	height: 7px;
	border-radius: 999px;
	background-color: #ff7043;
	box-shadow: 0 0 12px rgba(255, 112, 67, 0.18);
}

.nlhtg-legend-text {
	min-width: 0;
	color: rgba(255, 247, 243, 0.72);
	font-family: inherit;
	font-size: 10px;
	font-weight: 500;
	line-height: 1.35;
}

.nlhtg-chart-shell {
	width: 100%;
}

.nlhtg-plot {
	position: relative;
	width: 100%;
	height: 265px;
	overflow: visible;
	border-radius: 0;
	background-color: transparent;
}

.nlhtg-svg,
.nlhtg-point-layer {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
}

.nlhtg-svg {
	display: block;
	overflow: visible;
	pointer-events: none;
}

.nlhtg-grid-line,
.nlhtg-baseline,
.nlhtg-line {
	vector-effect: non-scaling-stroke;
}

.nlhtg-grid-line {
	stroke: var(--nlhtg-grid-color);
	stroke-width: var(--nlhtg-grid-width);
	stroke-dasharray: 4 8;
}

.nlhtg-baseline {
	stroke: var(--nlhtg-baseline-color);
	stroke-width: var(--nlhtg-baseline-width);
}

.nlhtg-baseline.is-hidden,
.nlhtg-area.is-hidden,
.nlhtg-axis.is-hidden {
	display: none;
}

.nlhtg-area-stop--top {
	stop-color: var(--nlhtg-area-top);
}

.nlhtg-area-stop--bottom {
	stop-color: var(--nlhtg-area-bottom);
}

.nlhtg-area {
	fill-opacity: var(--nlhtg-area-opacity);
	stroke: none;
	transition: opacity var(--nlhtg-area-duration) var(--nlhtg-animation-easing);
}

.nlhtg-line {
	fill: none;
	stroke: var(--nlhtg-line-color);
	stroke-width: var(--nlhtg-line-width);
	stroke-linecap: round;
	stroke-linejoin: round;
	filter: drop-shadow(0 0 7px var(--nlhtg-line-glow));
	transition: stroke-dashoffset var(--nlhtg-line-duration) var(--nlhtg-animation-easing), opacity 220ms ease;
}

.nlhtg-line-style-solid .nlhtg-line {
	stroke-dasharray: none;
}

.nlhtg-line-style-dashed .nlhtg-line {
	stroke-dasharray: 12 9;
}

.nlhtg-line-style-dotted .nlhtg-line {
	stroke-dasharray: 1 8;
	stroke-linecap: round;
}

.nlhtg-point-layer {
	z-index: 4;
	pointer-events: none;
}

.nlhtg-point-hit {
	position: absolute;
	top: var(--nlhtg-point-y);
	left: var(--nlhtg-point-x);
	display: grid;
	place-items: center;
	width: max(34px, calc(var(--nlhtg-marker-size) + 18px));
	height: max(34px, calc(var(--nlhtg-marker-size) + 18px));
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 999px;
	outline: 0;
	background: transparent;
	box-shadow: none;
	font: inherit;
	appearance: none;
	cursor: help;
	pointer-events: auto;
	transform: translate(-50%, -50%);
	touch-action: manipulation;
}

.nlhtg-point-hit.is-static {
	cursor: default;
	pointer-events: none;
}

.nlhtg-point-marker {
	display: block;
	width: var(--nlhtg-marker-size);
	height: var(--nlhtg-marker-size);
	border: var(--nlhtg-marker-border-width) solid var(--nlhtg-marker-border);
	border-radius: 999px;
	background-color: var(--nlhtg-marker-fill);
	box-shadow: 0 0 0 0 var(--nlhtg-marker-glow), 0 0 14px var(--nlhtg-marker-glow);
	transform: scale(1);
	transform-origin: center;
	transition:
		transform 220ms ease,
		opacity 220ms ease,
		box-shadow 220ms ease;
}

.nlhtg-point-hit:hover .nlhtg-point-marker,
.nlhtg-point-hit:focus-visible .nlhtg-point-marker {
	box-shadow: 0 0 0 6px var(--nlhtg-marker-glow), 0 0 18px var(--nlhtg-marker-glow);
	transform: scale(var(--nlhtg-marker-hover-scale));
}

.nlhtg-point-hit:focus-visible {
	outline: 2px solid var(--nlhtg-marker-focus);
	outline-offset: 2px;
}

.nlhtg-point-hit.is-marker-hidden .nlhtg-point-marker {
	opacity: 0;
	transform: scale(0.35);
}

.nlhtg-point-hit.is-marker-hidden:focus-visible .nlhtg-point-marker {
	opacity: 0.34;
	transform: scale(0.72);
}

.nlhtg-axis {
	position: relative;
	width: 100%;
	min-height: 20px;
	margin-top: 18px;
}

.nlhtg-axis-label {
	position: absolute;
	top: 0;
	left: var(--nlhtg-label-x);
	display: block;
	max-width: min(110px, 21%);
	color: #fff7f3;
	font-family: inherit;
	font-size: 10px;
	font-weight: 600;
	line-height: 1.25;
	text-align: center;
	white-space: normal;
	transform: translateX(-50%);
}

.nlhtg-axis-label.is-first {
	text-align: start;
	transform: translateX(0);
}

.nlhtg-axis-label.is-last {
	text-align: end;
	transform: translateX(-100%);
}

.nlhtg-tooltip {
	--nlhtg-tooltip-shift-x: -50%;
	--nlhtg-tooltip-shift-y: calc(-100% - 12px);

	position: absolute;
	z-index: 20;
	top: var(--nlhtg-tooltip-y, 50%);
	left: var(--nlhtg-tooltip-x, 50%);
	width: max-content;
	max-width: min(230px, calc(100% - 16px));
	padding: 8px 10px;
	border-radius: 8px;
	background: var(--nlhtg-tooltip-bg);
	box-shadow: 0 10px 30px rgba(35, 5, 5, 0.2);
	color: #4b1717;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	line-height: 1.35;
	text-align: center;
	white-space: normal;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate(var(--nlhtg-tooltip-shift-x), var(--nlhtg-tooltip-shift-y)) scale(0.96);
	transform-origin: center bottom;
	transition: opacity 150ms ease, transform 150ms ease, visibility 150ms ease;
}

.nlhtg-tooltip::after {
	position: absolute;
	top: 100%;
	left: 50%;
	width: 0;
	height: 0;
	border: 6px solid transparent;
	border-top-color: var(--nlhtg-tooltip-arrow);
	content: "";
	transform: translateX(-50%);
}

.nlhtg-tooltip.is-below {
	--nlhtg-tooltip-shift-y: 12px;
	transform-origin: center top;
}

.nlhtg-tooltip.is-below::after {
	top: auto;
	bottom: 100%;
	border-top-color: transparent;
	border-bottom-color: var(--nlhtg-tooltip-arrow);
}

.nlhtg-tooltip.is-visible {
	opacity: 1;
	visibility: visible;
	transform: translate(var(--nlhtg-tooltip-shift-x), var(--nlhtg-tooltip-shift-y)) scale(1);
}

.nlhtg-card.is-js.nlhtg-animation-enabled:not(.is-animated) .nlhtg-area {
	opacity: 0;
}

.nlhtg-card.is-js.nlhtg-animation-enabled:not(.is-animated) .nlhtg-point-marker {
	opacity: 0;
	transform: scale(0.2);
}

.nlhtg-card.is-js.nlhtg-animation-enabled.is-animated .nlhtg-point-marker {
	animation: nlhtg-point-enter var(--nlhtg-point-duration) var(--nlhtg-animation-easing) var(--nlhtg-point-delay) both;
}

.nlhtg-card.is-js.nlhtg-animation-enabled.is-animated .nlhtg-point-hit.is-marker-hidden .nlhtg-point-marker {
	animation: none;
	opacity: 0;
	transform: scale(0.35);
}

.nlhtg-card.is-js.nlhtg-animation-enabled.is-animated .nlhtg-area {
	opacity: var(--nlhtg-area-opacity);
}

@keyframes nlhtg-point-enter {
	0% {
		opacity: 0;
		transform: scale(0.2);
	}
	72% {
		opacity: 1;
		transform: scale(1.14);
	}
	100% {
		opacity: 1;
		transform: scale(1);
	}
}

.nlhtg-sr-only {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

@container nlhtg-card (max-width: 620px) {
	.nlhtg-card {
		padding: 24px 24px 21px;
		border-radius: 21px;
	}

	.nlhtg-title {
		font-size: 16px;
	}

	.nlhtg-period {
		font-size: 11px;
	}

	.nlhtg-plot {
		height: 225px;
	}

	.nlhtg-axis-label {
		font-size: 9.5px;
	}
}

@container nlhtg-card (max-width: 440px) {
	.nlhtg-card {
		padding: 20px 18px 18px;
		border-radius: 18px;
	}

	.nlhtg-header {
		column-gap: 12px;
		margin-bottom: 16px;
	}

	.nlhtg-title {
		font-size: 15px;
	}

	.nlhtg-period {
		max-width: 44%;
		font-size: 9.5px;
	}

	.nlhtg-legend {
		margin-bottom: 12px;
	}

	.nlhtg-legend-text {
		font-size: 9px;
	}

	.nlhtg-plot {
		height: 185px;
	}

	.nlhtg-axis {
		margin-top: 14px;
	}

	.nlhtg-axis-label {
		max-width: 22%;
		font-size: 8.5px;
	}

	.nlhtg-tooltip {
		max-width: min(190px, calc(100% - 12px));
		font-size: 11px;
	}
}

@container nlhtg-card (max-width: 340px) {
	.nlhtg-header {
		flex-wrap: wrap;
		row-gap: 5px;
	}

	.nlhtg-title {
		flex-basis: 100%;
	}

	.nlhtg-period {
		max-width: 100%;
		margin-inline-start: auto;
	}

	.nlhtg-plot {
		height: 165px;
	}

	.nlhtg-axis-label {
		font-size: 8px;
	}
}

@container nlhtg-card (max-width: 420px) {
	.nlhtg-hide-period-mobile-yes .nlhtg-period {
		display: none;
	}
}

@media (max-width: 767px) {
	/* Fallback for browsers without container queries. */
	.nlhtg-card {
		padding: 20px 18px 18px;
		border-radius: 18px;
	}

	.nlhtg-plot {
		height: 185px;
	}
}

@media (prefers-reduced-motion: reduce) {
	.nlhtg-card,
	.nlhtg-line,
	.nlhtg-area,
	.nlhtg-point-marker,
	.nlhtg-tooltip {
		animation: none !important;
		transition-duration: 0.001ms !important;
	}
}

@media print {
	.nlhtg-card {
		break-inside: avoid;
		box-shadow: none;
		print-color-adjust: exact;
		-webkit-print-color-adjust: exact;
	}

	.nlhtg-tooltip {
		display: none !important;
	}
}
