.single-line-chart-pane{border-radius:8px;background-color:#fff;padding:16px;>.title{font-size:16px;color:#333}>.data-title{font-size:24px;font-weight:600}>.chart-container{height:250px;&.loading{justify-content:center}&.error,&.loading{display:flex;align-items:center}&.error{color:red;word-break:break-all}}}.single-pie-chart-pane{border-radius:8px;background-color:#fff;padding:16px;min-width:290px;>.title{font-size:16px;color:#333}>.data-title{font-size:24px;font-weight:600}>.chart-container{height:210px;display:flex;align-items:center;gap:12px;min-width:0;&.loading{display:flex;align-items:center;justify-content:center}>.chart-legend{width:145px;max-height:168px;overflow-y:auto;padding-right:4px;margin:0;list-style:none;flex-shrink:0;scrollbar-width:thin;>.legend-item{display:flex;align-items:center;gap:4px;min-width:0;height:20px;font-size:11px;line-height:16px;>.legend-color{width:10px;height:10px;border-radius:50%;flex-shrink:0}>.legend-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}}>.pie-chart-area{flex:1;min-width:160px;height:100%}}}.select-with-table{display:flex;flex-direction:column;gap:8px;>.select-ag-grid{height:200px}}.single-table-card{border-radius:8px;background-color:#fff;padding:16px;min-width:350px;>.title{font-size:16px;color:#333}>.data-title{font-size:24px;font-weight:600}>.chart-container{height:200px;&.loading{display:flex;align-items:center;justify-content:center}>.data-table{width:100%;border-collapse:collapse;border:1px solid var(--border-color);margin-top:8px;td,th{border:1px solid var(--border-color);padding:4px}}}}