:root {
  --lcg-forecast-hc-navy: #02455c;
  --lcg-forecast-hc-blue: #54c0e8;
  --lcg-forecast-hc-pale: #eef8fb;
  --lcg-forecast-hc-orange: #f98509;
  --lcg-forecast-hc-wine: #8a1e41;
  --lcg-forecast-hc-green: #237039;
  --lcg-forecast-hc-purple: #862064;
  --lcg-forecast-hc-dark: #212121;
}

.lcg-aaha-forecast-highcharts-page .lcg-aaha-forecast-highcharts {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  color: var(--lcg-forecast-hc-navy);
}

.lcg-aaha-forecast-highcharts__stage {
  width: 100%;
  min-height: 520px;
}

/* The native Growth landscape intentionally gives its handcrafted SVG a
 * fixed 900:600 aspect and 760px floor. A Highcharts root owns its own exact
 * pixel geometry; inheriting that native-SVG rule scales 44px markers down on
 * desktop and makes the measured plot diverge from the configured square.
 * Reset only the Highcharts root, never the retained native SVG. */
.lcg-aaha-forecast-highcharts__stage .highcharts-root {
  width: 100% !important;
  min-width: 0 !important;
  height: 100% !important;
  min-height: 0 !important;
  aspect-ratio: auto !important;
}

.lcg-aaha-forecast-highcharts__controls {
  display: flex;
  justify-content: flex-end;
  margin-top: 12px;
}

.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button {
  min-width: 44px;
  min-height: 44px;
  padding: 10px 16px;
  border: 2px solid var(--lcg-forecast-hc-navy);
  border-bottom: 5px solid var(--lcg-forecast-hc-orange);
  border-radius: 0;
  background: #ffffff;
  color: var(--lcg-forecast-hc-navy);
  font: 700 16px/1.25 Montserrat, Arial, sans-serif;
}

.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button:hover,
.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button:active,
.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button[aria-pressed="true"] {
  background: var(--lcg-forecast-hc-navy);
  color: #ffffff;
}

.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button:disabled {
  border-color: var(--lcg-forecast-hc-navy);
  border-bottom-color: #66737a;
  background: #ffffff;
  color: var(--lcg-forecast-hc-navy);
  cursor: not-allowed;
  opacity: 1;
}

.lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button:focus-visible,
.lcg-aaha-forecast-highcharts .highcharts-a11y-proxy-element:focus-visible {
  outline: 3px solid var(--lcg-forecast-hc-navy);
  outline-offset: 3px;
  box-shadow: 0 0 0 6px var(--lcg-forecast-hc-orange);
}

.lcg-aaha-forecast-highcharts__status {
  min-height: 1.5em;
  margin: 10px 0 0;
  color: var(--lcg-forecast-hc-navy);
  font: 600 14px/1.5 Montserrat, Arial, sans-serif;
}

.lcg-aaha-forecast-highcharts figcaption,
.lcg-aaha-forecast-highcharts__caption {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 16px;
  margin-top: 12px;
  color: var(--lcg-forecast-hc-navy);
  font: 500 16px/1.5 Montserrat, Arial, sans-serif;
}

.lcg-aaha-forecast-highcharts figcaption strong,
.lcg-aaha-forecast-highcharts__caption strong { color: var(--lcg-forecast-hc-navy); }

.lcg-aaha-forecast-highcharts .highcharts-a11y-proxy-element {
  min-width: 44px !important;
  min-height: 44px !important;
}

/* When the export menu is open, remove the chart proxies behind that modal-like
 * surface from pointer/focus competition. Keep only the context-menu trigger so
 * it can close the menu. */
.lcg-aaha-forecast-highcharts.is-export-menu-open .highcharts-a11y-proxy-element:not([aria-label^="View chart context menu"]) {
  visibility: hidden !important;
  pointer-events: none !important;
}

.lcg-aaha-forecast-highcharts .highcharts-menu {
  padding: 0 !important;
  border: 2px solid var(--lcg-forecast-hc-navy) !important;
  background: #ffffff !important;
  opacity: 1 !important;
  filter: none !important;
  box-shadow: 0 4px 12px rgb(2 69 92 / 24%) !important;
}

.lcg-aaha-forecast-highcharts .highcharts-menu-item {
  display: flex !important;
  align-items: center !important;
  min-width: 180px !important;
  min-height: 44px !important;
  padding: 10px 12px !important;
  border-bottom: 1px solid #b6e3ff !important;
  background: #ffffff !important;
  background-image: none !important;
  color: var(--lcg-forecast-hc-navy) !important;
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
  animation: none !important;
  font: 700 14px/1.3 Montserrat, Arial, sans-serif !important;
}

.lcg-aaha-forecast-highcharts .highcharts-menu-item:last-child {
  border-bottom: 0 !important;
}

.lcg-aaha-forecast-highcharts .highcharts-menu-item:hover,
.lcg-aaha-forecast-highcharts .highcharts-menu-item:active,
.lcg-aaha-forecast-highcharts .highcharts-menu-item:focus,
.lcg-aaha-forecast-highcharts .highcharts-menu-item:focus-visible,
.lcg-aaha-forecast-highcharts .highcharts-contextmenu .highcharts-menu-item[aria-current="true"],
.lcg-aaha-forecast-highcharts .highcharts-contextmenu .highcharts-menu-item-active,
.lcg-aaha-forecast-highcharts .highcharts-menu-item[data-lcg-forecast-menu-active="1"] {
  outline: 3px solid var(--lcg-forecast-hc-navy) !important;
  outline-offset: -3px !important;
  box-shadow: inset 0 0 0 3px var(--lcg-forecast-hc-orange) !important;
  background: #b6e3ff !important;
  background-image: none !important;
  color: var(--lcg-forecast-hc-navy) !important;
  opacity: 1 !important;
  filter: none !important;
  transition: none !important;
  animation: none !important;
}

.lcg-aaha-forecast-highcharts .highcharts-tooltip .highcharts-label-box,
.lcg-aaha-forecast-highcharts .highcharts-tooltip-box {
  fill: var(--lcg-forecast-hc-navy) !important;
  stroke: var(--lcg-forecast-hc-orange) !important;
  stroke-width: 3px !important;
}

.lcg-aaha-forecast-highcharts .highcharts-tooltip text,
.lcg-aaha-forecast-highcharts .highcharts-tooltip span {
  color: #ffffff !important;
  fill: #ffffff !important;
  font-family: Montserrat, Arial, sans-serif !important;
}

.lcg-aaha-forecast-highcharts .highcharts-data-table {
  width: 100%;
  overflow-x: auto;
  margin-top: 16px;
}

.lcg-aaha-forecast-highcharts .highcharts-data-table table {
  width: 100%;
  min-width: 720px;
  border-collapse: collapse;
  background: #ffffff;
  color: var(--lcg-forecast-hc-navy);
  font: 500 14px/1.4 Montserrat, Arial, sans-serif;
}

.lcg-aaha-forecast-highcharts .highcharts-data-table th,
.lcg-aaha-forecast-highcharts .highcharts-data-table td {
  padding: 9px;
  border: 1px solid #b6e3ff;
  text-align: right;
}

.lcg-aaha-forecast-highcharts .highcharts-data-table th {
  background: var(--lcg-forecast-hc-navy);
  color: #ffffff;
}

@media (max-width: 760px) {
  .lcg-aaha-forecast-highcharts__stage { min-height: 420px; }
  .lcg-aaha-forecast-highcharts__controls { justify-content: stretch; }
  .lcg-aaha-forecast-highcharts .lcg-aaha-forecast-highcharts__controls button { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .lcg-aaha-forecast-highcharts * { animation: none !important; transition: none !important; }
}
