/* Shared chart: fixed-size type, separate axes, exact values outside the plot. */
.bi-trend { min-width:0; width:100%; color:#27272a; font-size:12px; line-height:1.5; }
.bi-trend-scroll { max-width:100%; overflow-x:auto; overscroll-behavior-x:contain; scrollbar-width:thin; scrollbar-color:#cbd5e1 transparent; }
.bi-trend-scroll > svg { display:block; max-width:none; overflow:hidden; }
.bi-trend-gridline { stroke:#e2e8f0; stroke-width:1; }
.bi-trend-tick,.bi-trend-month { fill:#64748b; font:11px system-ui,sans-serif; font-variant-numeric:tabular-nums; }
.bi-trend-value { font:11px system-ui,sans-serif; font-variant-numeric:tabular-nums; paint-order:stroke; stroke:#fff; stroke-width:3px; stroke-linejoin:round; pointer-events:none; }
.bi-trend-guide { stroke:#cbd5e1; stroke-dasharray:4 4; }
.bi-trend-target { fill:transparent; cursor:pointer; outline:none; }
.bi-trend-target:hover { fill:#1e40af06; }
.bi-trend-target:focus-visible { fill:#1e40af09; stroke:#1e40af; stroke-width:1.5; }
.bi-trend-detail { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 24px; min-height:52px; padding:14px 0 10px; border-top:1px solid #e2e8f0; font-size:12px; }
.bi-trend-detail > strong { color:#27272a; font-size:12px; font-weight:500; }
.bi-trend-detail span { display:inline-flex; align-items:baseline; gap:7px; flex-wrap:wrap; }
.bi-trend-detail i { width:6px; height:6px; border-radius:50%; flex-shrink:0; align-self:center; }
.bi-trend-detail b { color:#27272a; font-size:16px; font-weight:650; font-variant-numeric:tabular-nums; }
.bi-trend-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px 20px; color:#27272a; font-size:11px; }
.bi-trend-data { margin-top:12px; font-size:12px; }
.bi-trend-data summary { width:fit-content; cursor:pointer; color:#27272a; padding:5px 0; }
.bi-trend-table-wrap { max-width:100%; overflow:auto; max-height:340px; }
.bi-trend-data table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; }
.bi-trend-data caption { text-align:left; padding:8px 0; }
.bi-trend-data th,.bi-trend-data td { white-space:nowrap; padding:9px 12px; border-bottom:1px solid #e2e8f0; text-align:right; }
.bi-trend-data th:first-child { text-align:left; }
.bi-trend-data thead th { background:#f1f5f9; color:#27272a; }
.chart:has(.bi-trend) { min-width:0; display:block; padding:20px 24px; }
.trend-layout { min-width:0; }
@media(max-width:600px) {
  .chart:has(.bi-trend) { padding:14px 12px; }
  .bi-trend-detail { gap:8px 14px; }
  .bi-trend-detail > strong { flex-basis:100%; }
}
