/* TrendScore Detailansicht (v2.0.0) – theme-robust, kein transform auf Chart-Vorfahren (Erkenntnis 11). */
.ts-detail { margin: 1em 0; font-size: 15px; }
.ts-detail-nav { margin: 0 0 .75em; }
.ts-back {
	display: inline-block; padding: 5px 12px; border: 1px solid #2e75b6; border-radius: 4px;
	color: #2e75b6; text-decoration: none; background: #fff; cursor: pointer;
}
.ts-back:hover { background: #eaf2fb; }
.ts-detail-status { padding: 1em; color: #777; font-style: italic; }
.ts-detail-title { margin: .2em 0; }
.ts-detail-meta { color: #555; margin-bottom: 1em; }
.ts-detail-meta span { white-space: nowrap; }

.ts-breakdown { display: flex; flex-wrap: wrap; gap: 18px; margin-bottom: 1em; }
.ts-bd-col { flex: 1 1 280px; }
.ts-bd-list { list-style: none; padding: 0; margin: .3em 0; }
.ts-bd-list li { padding: 2px 0; }
.ts-bd-list li.ts-on { color: #2f7d3f; }
.ts-bd-list li.ts-off { color: #999; }

.ts-chart { width: 100%; margin: 0 0 10px; }
.ts-chart-sm { } /* feste Höhe wird per JS gesetzt */

.ts-detail-metrics { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 6px 18px; }
.ts-metric { display: flex; justify-content: space-between; border-bottom: 1px solid #eee; padding: 4px 0; }
.ts-metric-k { color: #555; }
.ts-metric-v { font-weight: 600; }

.ts-empty { color: #777; font-style: italic; padding: 1em; }

@media (max-width: 700px) {
	.ts-breakdown { flex-direction: column; }
}

/* v2.1.0 – Lesehilfe Detailansicht */
.ts-help { margin: 0 0 1em; border: 1px solid #dbe7f2; border-radius: 4px; background: #f7fafd; }
.ts-help > summary { cursor: pointer; padding: 8px 12px; font-weight: 600; color: #2e75b6; list-style: none; }
.ts-help > summary::-webkit-details-marker { display: none; }
.ts-help > summary::before { content: "ℹ "; }
.ts-help-body { padding: 8px 14px 12px; font-size: 14px; }