/* Chart.js graph container layout */
.cjs-graph-container { position: relative; height: 525px; width: 100%; }
.cjs-root        { display: flex; flex-direction: column; }
.cjs-toolbar     { display: flex; gap: 4px; padding: 4px 0; flex-shrink: 0; }
.cjs-row         { display: flex; flex: 1; min-height: 0; }
.cjs-canvas-wrap { position: relative; flex: 1; min-width: 0; }
.cjs-legend      { overflow-y: auto; max-width: 200px; min-width: 100px; padding: 4px 8px; font-size: 12px; flex-shrink: 0; }
.cjs-legend-item { display: flex; align-items: center; cursor: pointer; padding: 2px 0; user-select: none; }
.cjs-legend-item.cjs-hidden { opacity: 0.4; }
.cjs-legend-dot  { display: inline-block; width: 8px; height: 8px; border-radius: 50%; margin-right: 6px; flex-shrink: 0; }
.cjs-legend-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* Dark mode: lighter canvas background so axes and points are readable */
[data-bs-theme="dark"] .cjs-canvas-wrap canvas {
    background-color: #3a3d42;
}