.project-ai-chat__rich-result.is-trend-chart {
	background: var(--chat-surface);
}

.project-ai-chat-trend {
	--trend-success: var(--ztm-status-ok);
	--trend-partial: var(--ztm-status-warn);
	--trend-failure: var(--ztm-status-error);
	display: grid;
	gap: .75rem;
	margin: 0;
	padding: .8rem .75rem .85rem;
}

.project-ai-chat-trend__summary {
	display: grid;
	gap: .55rem;
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.project-ai-chat-trend__metric {
	background: color-mix(in srgb, var(--chat-accent-soft) 45%, transparent);
	border: 1px solid var(--chat-soft-line);
	border-radius: .55rem;
	display: grid;
	gap: .1rem;
	min-width: 0;
	padding: .55rem .65rem;
}

.project-ai-chat-trend__metric small,
.project-ai-chat-trend__metric span,
.project-ai-chat-trend__notice {
	color: var(--chat-muted);
	font-size: .65rem;
}

.project-ai-chat-trend__metric strong {
	color: var(--chat-ink);
	font-size: 1.3rem;
	font-variant-numeric: tabular-nums;
	font-weight: 400;
}

.project-ai-chat-trend__legend {
	display: flex;
	flex-wrap: wrap;
	gap: .45rem 1rem;
}

.project-ai-chat-trend__legend span {
	align-items: center;
	display: inline-flex;
	font-size: .67rem;
	gap: .35rem;
}

.project-ai-chat-trend__legend i {
	border-top: 3px solid currentColor;
	display: inline-block;
	width: 1.2rem;
}

.project-ai-chat-trend__legend .is-success { color: var(--trend-success); }
.project-ai-chat-trend__legend .is-partial { color: var(--trend-partial); }
.project-ai-chat-trend__legend .is-failure { color: var(--trend-failure); }
.project-ai-chat-trend__legend .is-partial i { border-top-style: dashed; }
.project-ai-chat-trend__legend .is-failure i { border-top-style: dotted; }

.project-ai-chat-trend__plot {
	display: block;
	height: auto;
	overflow: visible;
	width: 100%;
}

.project-ai-chat-trend__grid {
	stroke: var(--chat-soft-line);
	stroke-width: 1;
}

.project-ai-chat-trend__axis-label,
.project-ai-chat-trend__date-label {
	fill: var(--chat-muted);
	font-size: 10px;
}

.project-ai-chat-trend__line {
	fill: none;
	stroke: currentColor;
	stroke-linecap: round;
	stroke-linejoin: round;
	stroke-width: 3;
}

.project-ai-chat-trend__point {
	fill: var(--chat-surface);
	stroke: currentColor;
	stroke-width: 3;
}

.project-ai-chat-trend__series.is-success { color: var(--trend-success); }
.project-ai-chat-trend__series.is-partial { color: var(--trend-partial); }
.project-ai-chat-trend__series.is-failure { color: var(--trend-failure); }
.project-ai-chat-trend__series.is-partial .project-ai-chat-trend__line { stroke-dasharray: 9 5; }
.project-ai-chat-trend__series.is-failure .project-ai-chat-trend__line { stroke-dasharray: 2 6; }

.project-ai-chat-trend__notice {
	border-top: 1px solid var(--chat-soft-line);
	margin: 0;
	padding-top: .55rem;
}

@media (max-width: 575.98px) {
	.project-ai-chat-trend {
		padding-left: .55rem;
		padding-right: .55rem;
	}

	.project-ai-chat-trend__summary {
		grid-template-columns: 1fr;
	}
}

@media (prefers-contrast: more) {
	.project-ai-chat-trend__line,
	.project-ai-chat-trend__point {
		stroke-width: 4;
	}
}