/* Hide exporting UI for all Highcharts by default */
.highcharts-container .highcharts-exporting-group,
.highcharts-container .highcharts-contextbutton {
  opacity: 0;
  pointer-events: none;
  transition: opacity 150ms;
}

/* Show when hovering the chart */
.highcharts-container:hover .highcharts-exporting-group,
.highcharts-container:hover .highcharts-contextbutton {
  opacity: 1;
  pointer-events: auto;
}

/* Optional: keyboard accessibility (show when focused via tab) */
.highcharts-container:focus-within .highcharts-exporting-group,
.highcharts-container:focus-within .highcharts-contextbutton {
  opacity: 1;
  pointer-events: auto;
}

/* Custom export/context button theme binding */
.highcharts-container .highcharts-contextbutton .highcharts-button-box {
  fill: var(--mud-palette-surface) !important;
  stroke: var(--mud-palette-table-lines) !important;
}

.highcharts-container .highcharts-contextbutton .highcharts-button-symbol {
  fill: var(--mud-palette-text-primary) !important;
  stroke: var(--mud-palette-text-primary) !important;
}

.highcharts-container .highcharts-contextbutton.highcharts-button-hover .highcharts-button-box,
.highcharts-container .highcharts-contextbutton.highcharts-button-pressed .highcharts-button-box,
.highcharts-container .highcharts-contextbutton:hover .highcharts-button-box {
  fill: var(--mud-palette-table-hover) !important;
  stroke: var(--mud-palette-table-lines) !important;
}