.metric-header-container{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;margin-bottom:24px}.metric-header-container .icon-total-container{display:flex;align-items:flex-end;gap:12px}.metric-header-container .metric-icon{width:36px;height:36px;-o-object-fit:contain;object-fit:contain;margin-bottom:8px}.metric-header-container .metric-total{font-weight:500;color:#fff;font-size:1rem;margin-bottom:12px}.metric-header-container .static-metrics{display:flex;flex-direction:column;gap:20px;width:100%}.metric-header-container .static-metric-item{display:flex;flex-direction:column;gap:6px}.metric-header-container .static-bar-container{width:100%;height:48px;background-color:#1f293b;border-radius:12px;overflow:hidden;position:relative}.metric-header-container .static-bar{height:100%;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;color:#fff;font-size:14px;font-weight:600}.metric-header-container .label-value-container{display:flex;width:100%;justify-content:space-between;align-items:center}.metric-header-container .metric-label{text-align:left}.metric-header-container .metric-value{text-align:right}.metric-header-container .percentage-text{text-shadow:0 1px 2px rgba(0,0,0,.3)}.donut-chart-container{background-color:#1e293b;color:#fff;border-radius:10px;padding:16px;max-width:600px}.donut-chart-container .legend-item{margin:8px 0}.donut-chart-container .static-bar-container{width:100%;height:48px;background-color:#1f293b;border-radius:12px;overflow:hidden;position:relative}.donut-chart-container .static-bar{height:100%;border-radius:12px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;color:#fff;font-size:14px;font-weight:600;transition:all .3s ease}.donut-chart-container .static-bar:hover{filter:brightness(1.1);transform:translateY(-1px)}.donut-chart-container .label-value-container{display:flex;width:100%;justify-content:space-between;align-items:center}.donut-chart-container .metric-label{text-align:left}.donut-chart-container .metric-value{text-align:right}.donut-chart-container .icon-wrapper{display:inline-block;width:28px;height:28px;margin-right:6px;vertical-align:middle;transition:transform .2s ease}.chart-container{display:flex;flex-direction:row;gap:10px;align-items:flex-start;background:transparent;flex-wrap:wrap}.chart-container .graph-title{font-weight:500;color:#fff;font-size:1rem;margin-bottom:12px;padding-bottom:12px}.chart-container .left-section{display:flex;flex-direction:row;gap:10px}.chart-container .custom-legend-box{max-height:280px;max-width:250px;width:250px;overflow-y:auto;overflow-x:auto;white-space:nowrap;border-radius:8px;scrollbar-width:thin;scrollbar-color:#999 transparent;border:.5px solid;border-color:rgba(211,194,194,.78);padding:10px}.chart-container .legend-item{display:flex;align-items:center;margin-bottom:6px;min-width:-moz-max-content;min-width:max-content}.chart-container .legend-color{width:14px;height:14px;border-radius:50%;margin-right:10px}.chart-container .legend-label{color:#fff;font-size:14px}.chart-container .right-section{flex-grow:1}.chart-container .pagination-buttons{display:flex;justify-content:center;margin-top:10px}.chart-container .title-dropdown-row{position:relative;margin-bottom:12px;padding-bottom:12px;min-height:40px}.chart-container .chart-title-container{position:absolute;left:50%;transform:translateX(-50%);text-align:center}.chart-container .chart-title{font-weight:500;color:#fff;font-size:1rem}.chart-container .dropdown-wrapper{margin-left:auto}.chart-container .chart-wrapper{position:relative}.chart-container .arrow-btn{top:50%;transform:translateY(-50%);z-index:2}.chart-container .left-arrow{left:0}.chart-container .right-arrow{right:0}.chart-container .apexcharts-xaxis text{display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;overflow:hidden;white-space:normal;word-break:break-word}.graph-col[data-v-4a991b12]{flex:0 0 47%!important;max-width:47%!important}.graph-col[data-v-003d88a3],.graph-col[data-v-40917ade]{flex:0 0 48%!important;max-width:48%!important}.graph-col[data-v-59cf002e],.graph-col[data-v-114e5e8e],.graph-col[data-v-19003604],.graph-col[data-v-cb21aea4]{flex:0 0 47%!important;max-width:47%!important}