Legend style css bug

[ekiankim92]

I'm currently using apexcharts in Next.js project with tanstack/react-query. I found a issue or a bug where when charts are rendered, legends in those charts are broken (css wise). This is occurring sporadically so it's difficult to find a way to approach this issue. Is there any idea or an approach how to fix this issue?

I used itemMargin.horizontal to give space between the legends. 

    legend: {
      position: 'bottom',
      markers: {
        width: 16,
        height: 4,
      },
      onItemHover: {
        highlightDataSeries: true,
      },
      itemMargin: {
        horizontal: 10,
      },
      labels: {
        colors: '#FFFFFF',
      },
    },