Specifying multiple fill types does not work when graph contains column plots and line or area plots

[DistractedPhysicist]

Checklist

• [*] I updated the card to the latest version available
• [*] I cleared the cache of my browser
• [*] I verified that I'm really running the latest version in my browser console
• [*] I checked if there is another issue opened with the same problem

Describe the bug
When specifying multiple fill types, the fill type is not applied correctly if the graph contains columns and either lines or areas. However, the fill types are applied correctly if the graph contains no columns or only columns. Based on my testing, it seems like what happens is that for columns, the application of the fill types resets back to the beginning of the list instead of picking up the next type on the list which is the expected behaviour (and the behaviour of all the other plot types).

Version of the card
Version: 2.1.2

To Reproduce
Here is a slightly modified version of the default card to demonstrate the issue. This should produce a line with solid fill and columns with gradient fill.

type: custom:apexcharts-card
header:
  show: true
  title: ApexCharts-Card
  show_states: true
  colorize_states: true
apex_config:
  fill:
    type:
      - solid
      - gradient
    gradient:
      type: vertical
      shadeIntensity: 0
      opacityFrom: 1
      opacityTo: 0.1
      stops:
        - 0
        - 90
        - 100
series:
  - entity: sensor.adguard_home_cpu_percent
    type: line
    data_generator: |
      // REMOVE ME
      const now = new Date();
      const data = [];
      for(let i = 0; i <= 24; i++) {
        data.push([now.getTime() - i * 1000 * 60 * 60, Math.floor((Math.random() * 10) + 1)])
      }
      return data.reverse();
  - entity: sensor.wireguard_cpu_percent
    type: column
    data_generator: |
      // REMOVE ME
      const now = new Date();
      const data = [];
      for(let i = 0; i <= 24; i++) {
        data.push([now.getTime() - i * 1000 * 60 * 60, Math.floor((Math.random() * 10) + 1)])
      }
      return data.reverse();

Screenshots
However, the above code produces a plot with no gradient applied to the columns:

Changing type: column to type: area for the second entity produces exactly the expected result:

Expected behavior
The columns should have gradient applied.

Desktop (please complete the following information):

• Browser: Safari
• Version: 17.6