.apexcharts-text,
.apexcharts-datalabel-value,
.apexcharts-xaxis-label,
.apexcharts-yaxis-label,
.apexcharts-legend-text {
  @apply font-sans font-semibold !text-muted-500 dark:!text-muted-400 !uppercase fill-current;
}

.apexcharts-gridline {
  @apply text-muted-200 dark:text-muted-900 stroke-current;
}

.apexcharts-bar-area {
  @apply text-white dark:text-muted-900 stroke-current fill-current;
}

.apexcharts-xaxis line,
.apexcharts-yaxis line {
  @apply text-muted-300 dark:text-muted-700 stroke-current;
}

.apexcharts-xaxis-tick,
.apexcharts-yaxis-tick {
  @apply text-muted-300 dark:text-muted-600 stroke-current;
}

.apexcharts-series-markers .apexcharts-marker,
.apexcharts-series-bubble .apexcharts-marker {
  @apply text-white dark:text-muted-900 stroke-current;
}

.apexcharts-pie-area,
.apexcharts-pie-slice-0 {
  @apply text-white dark:text-muted-900 stroke-current;
}

.apexcharts-slices .apexcharts-pie-label {
  @apply text-muted-50 fill-current;
}

.apexcharts-radialbar-track .apexcharts-radialbar-area,
.apexcharts-track .apexcharts-radialbar-area {
  @apply text-white dark:text-muted-900 stroke-current;
}

.apexcharts-radar-series > polygon,
.apexcharts-plot-series > polygon,
.apexcharts-radar-series > line,
.apexcharts-plot-series > line {
  @apply fill-transparent text-white dark:text-muted-900 stroke-current;
}

.apexcharts-tooltip {
  @apply shadow-xl shadow-muted-400/10 dark:shadow-none;
}

.apexcharts-tooltip.apexcharts-theme-light {
  @apply border border-muted-200 dark:border-muted-700 bg-white dark:bg-muted-800 text-muted-700 dark:text-muted-100;
}

.apexcharts-tooltip.apexcharts-theme-light .apexcharts-tooltip-title {
  @apply border-b border-muted-200 dark:border-muted-700 bg-white dark:bg-muted-800 text-muted-700 dark:text-muted-100;
}

.dark .apexcharts-xaxistooltip {
  @apply border border-muted-700 bg-muted-800 text-muted-100;
}

.dark .apexcharts-xaxistooltip.apexcharts-xaxistooltip-bottom::before {
  border-bottom-color: var(--color-muted-700);
}

.dark .apexcharts-xaxistooltip.apexcharts-xaxistooltip-bottom::after {
  border-bottom-color: var(--color-muted-800);
}

.dark .apexcharts-xaxistooltip.apexcharts-xaxistooltip-top::before {
  border-top-color: var(--color-muted-700);
}

.dark .apexcharts-xaxistooltip.apexcharts-xaxistooltip-top::after {
  border-top-color: var(--color-muted-800);
}