Как в react-chartjs-2 задать отступ между круговой диаграммой и лейблами?

Question

[tattami]

Как в react-chartjs-2 задать отступ между круговой диаграммой и лейблами?
Диаграмма не встает по центру блока из-за лейблов. Как это можно исправить? Уже все перепробовал, если задавать margin-left, то при изменении лейблов она все равно сдвигается влево..

const DEFAULT_CHART_OPTIONS = {
    responsive: true,
    maintainAspectRatio: false,
    layout: {
        padding: {
            top: 0,
            bottom: 0,
            left: 0,
            right: 0
        }
    },
    plugins: {
        legend: {
            position: 'right',
            align: 'start',
            display: true,
            labels: {
                usePointStyle: true,
                pointStyle: 'circle',
                padding: 10,
                font: { size: 12 }
            }
        },
        tooltip: {
            displayColors: false,
            backgroundColor: 'rgba(0,0,0,0.8)',
            titleFont: { size: 14, weight: 'bold' },
            bodyFont: { size: 12 }
        }
    },
};

<div className="pie-chart-wrapper">
                                    {loading.clients ? (
                                        <div className="chart-loading-overlay">
                                            <ClipLoader color="#3b82f6" size={30} />
                                        </div>
                                    ) : (
                                        <Pie
                                            data={clientsChartData} 
                                            options={{ ...clientsChartOptions, layout: { padding: 15 } }}
                                        />
                                    )}
                                </div>

/* Стили для круговой диаграммы */
.chart-container {
    background: white;
    border-radius: 16px;
    margin: 20px 0;
    max-height: 20vh;
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0.05);
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    transition: box-shadow 0.3s ease;
}

.chart-container:hover {
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.15);
}

.chart-header {
    position: absolute;
    top: 10px;
    left: 10px;
    z-index: 10;
}

.pie-chart-wrapper {
    width: 100%;
    height: 100%;
    position: relative;
    margin-left: 11%;
    margin-right: 0;
}