.th-chart{
	background:color-mix(in srgb,var(--th-card-bg-hover) 64%,var(--th-color-transparent));
	border:1px solid var(--th-border-soft);
	border-radius:.65rem;
	display:grid;
	gap:.75rem;
	margin:.75rem 0 0;
	min-width:0;
	padding:.75rem;
}

.th-chart-caption{
	align-items:center;
	border-bottom:1px solid var(--th-border-soft);
	display:flex;
	gap:.6rem;
	justify-content:space-between;
	min-width:0;
	padding-bottom:.6rem;
}

.th-chart-caption strong{
	font-size:.8rem;
	line-height:1.3;
	min-width:0;
}

.th-chart-caption small{
	background:var(--th-badge-bg);
	border-radius:999px;
	color:var(--th-color-text-muted);
	flex:0 0 auto;
	font-size:.66rem;
	font-weight:700;
	line-height:1.3;
	max-width:45%;
	padding:.22rem .42rem;
	text-align:right;
}

.th-chart-rows{
	display:grid;
	gap:.65rem;
}

.th-chart-row{
	display:grid;
	gap:.3rem;
	min-width:0;
}

.th-chart-row-header{
	align-items:baseline;
	display:grid;
	font-size:.7rem;
	gap:.75rem;
	grid-template-columns:minmax(0,1fr) auto;
	line-height:1.25;
	min-width:0;
}

.th-chart-row-header span{
	font-weight:700;
	min-width:0;
	overflow-wrap:anywhere;
}

.th-chart-row-header strong{
	font-size:.68rem;
	font-variant-numeric:tabular-nums;
	justify-self:end;
	white-space:nowrap;
}

.th-chart-bar{
	appearance:none;
	background:var(--th-badge-bg);
	border:0;
	border-radius:999px;
	display:block;
	height:.56rem;
	overflow:hidden;
	width:100%;
}

.th-chart-bar::-webkit-progress-bar{
	background:var(--th-badge-bg);
	border-radius:999px;
}

.th-chart-bar::-webkit-progress-value{
	background:var(--th-gradient-cta);
	border-radius:999px;
}

.th-chart-bar::-moz-progress-bar{
	background:var(--th-gradient-cta);
	border-radius:999px;
}

.th-chart-row.is-forecast{
	border-top:1px dashed var(--th-border-soft);
	padding-top:.5rem;
}

.th-chart-row.is-forecast .th-chart-row-header{
	color:var(--th-color-info);
}

.th-chart-row.is-forecast .th-chart-bar::-webkit-progress-value{
	background:var(--th-color-info);
}

.th-chart-row.is-forecast .th-chart-bar::-moz-progress-bar{
	background:var(--th-color-info);
}

.th-chart-line-svg{
	background:linear-gradient(to bottom,var(--th-border-soft) 1px,var(--th-color-transparent) 1px);
	background-size:100% 25%;
	display:block;
	height:auto;
	max-height:13rem;
	overflow:visible;
	width:100%;
}

.th-chart-line-path{
	fill:none;
	stroke:var(--th-color-success);
	stroke-linecap:round;
	stroke-linejoin:round;
	stroke-width:5;
}

.th-chart-line-point{
	fill:var(--th-color-success);
	stroke:var(--th-card-bg);
	stroke-width:3;
}

.th-chart-line-labels{
	display:grid;
	font-size:.62rem;
	font-weight:700;
	gap:.25rem;
	grid-template-columns:repeat(auto-fit,minmax(3.5rem,1fr));
}

.th-chart-line-labels span{
	overflow:hidden;
	text-align:center;
	text-overflow:ellipsis;
	white-space:nowrap;
}

.th-chart-pie-body{
	align-items:center;
	display:grid;
	gap:1rem;
	grid-template-columns:minmax(7rem,10rem) minmax(0,1fr);
}

.th-chart-pie-disk{
	aspect-ratio:1;
	border:1px solid var(--th-border-soft);
	border-radius:50%;
	box-shadow:inset 0 0 0 .8rem color-mix(in srgb,var(--th-card-bg) 20%,var(--th-color-transparent));
	width:100%;
}

.th-chart-pie-legend{
	display:grid;
	gap:.42rem;
	min-width:0;
}

.th-chart-pie-legend > div{
	align-items:center;
	display:grid;
	font-size:.68rem;
	gap:.45rem;
	grid-template-columns:.65rem minmax(0,1fr) auto;
	min-width:0;
}

.th-chart-pie-legend > div > span:nth-child(2){
	overflow-wrap:anywhere;
}

.th-chart-pie-swatch{
	border-radius:50%;
	height:.65rem;
	width:.65rem;
}

@media (max-width:575.98px){
	.th-chart-pie-body{
		grid-template-columns:1fr;
	}

	.th-chart-pie-disk{
		justify-self:center;
		max-width:9rem;
	}
}
