How can I set up the className to a google chart in React to define the style in the CSS?

Question

I'm trying to create with React a square with round corner and inside a donuts chart, then I have to put inside the hole the label. I'm not able to set the CSS style for the chart and I cannot find online any information regarding all the options that are possible to set for a chart in google chart, so I don't know how to proceed.

This is what I have done:

const options = {
  title: '',
  pieHole: 0.7,
  pieSliceText: 'none',
  slices: [
    {
      color: '#ee7d7d',
    },
    {
      color: '#F5F2F2',
    },
  ],
  legend: { position: 'none' },
  style: {
    height: '10px',
  },
};

<div className='info-data donut-chart'>
        <Chart chartType='PieChart' data={data} options={options} />
        <div className='center-label'>{data[1][1]}%</div>
      </div>

The CSS associated to this part is:

.donut-chart{
    text-align:center;
    position: relative;
    border-radius: 1.3rem;

}

.center-label{
    font-size: 26px;
    color: #100a0a;
    margin: 0;
    position: absolute;
    top: 50%;
    left: 50%;
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
}

The result is that I don't have round corners: