.prb-chart-emoji-axis-labels tspan[dy="0.355em"]{dy:.955em !important}.MuiAutocomplete-popper,.MuiPopover-root,.MuiPopper-root,.MuiMenu-paper{z-index:2200 !important}.apexcharts-toolbar{gap:4px;padding:2px}.apexcharts-toolbar .apexcharts-zoomin-icon,.apexcharts-toolbar .apexcharts-zoomout-icon,.apexcharts-toolbar .apexcharts-zoom-icon,.apexcharts-toolbar .apexcharts-pan-icon,.apexcharts-toolbar .apexcharts-reset-zoom-icon,.apexcharts-toolbar .apexcharts-selection-icon,.apexcharts-toolbar .apexcharts-menu-icon,.apexcharts-toolbar .apexcharts-download-icon{transform:scale(0.8)}.apexcharts-toolbar svg{width:14px;height:14px}@media(max-width: 1200px){.apexcharts-toolbar .apexcharts-zoomin-icon,.apexcharts-toolbar .apexcharts-zoomout-icon,.apexcharts-toolbar .apexcharts-zoom-icon,.apexcharts-toolbar .apexcharts-pan-icon,.apexcharts-toolbar .apexcharts-reset-zoom-icon,.apexcharts-toolbar .apexcharts-selection-icon,.apexcharts-toolbar .apexcharts-menu-icon,.apexcharts-toolbar .apexcharts-download-icon{transform:scale(0.7)}.apexcharts-toolbar svg{width:12px;height:12px}}
/**
 * Accessibility styles for high contrast mode and enhanced focus indicators.
 * These styles are applied globally when accessibility settings are enabled.
 */

/* High Contrast Mode - Maximum Contrast (WCAG AAA) - Black and White Only */
.high-contrast-mode {
  --high-contrast-bg-primary: #FFFFFF;
  --high-contrast-bg-secondary: #FFFFFF;
  --high-contrast-text-primary: #000000;
  --high-contrast-text-secondary: #000000;
  --high-contrast-interactive-primary: #FFFFFF;
  --high-contrast-interactive-hover: #FFFFFF;
  --high-contrast-focus: #000000;
  --high-contrast-border: #000000;
}

/* Force maximum contrast on root and body */
.high-contrast-mode,
.high-contrast-mode body {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* Force all text elements to black */
.high-contrast-mode * {
  color: #000000 !important;
}

/* Override MUI theme colors aggressively */
.high-contrast-mode .MuiTypography-root,
.high-contrast-mode p,
.high-contrast-mode span,
.high-contrast-mode div,
.high-contrast-mode h1,
.high-contrast-mode h2,
.high-contrast-mode h3,
.high-contrast-mode h4,
.high-contrast-mode h5,
.high-contrast-mode h6,
.high-contrast-mode li,
.high-contrast-mode td,
.high-contrast-mode th,
.high-contrast-mode label {
  color: #000000 !important;
}

/* InputLabel - CRITICAL: White opaque background behind text to break border line */
/* Keep label in original position but ensure text has white background to prevent strikethrough */
.high-contrast-mode .MuiInputLabel-root,
.high-contrast-mode .MuiFormLabel-root {
  color: #000000 !important;
  /* Don't override Material-UI's positioning - let it stay in default position */
  background-color: transparent !important;
  /* CRITICAL: Ensure InputLabel root renders above fieldset border */
  position: relative !important;
  z-index: 10 !important;
}

/* Ensure InputLabel text container ALWAYS has white opaque background */
/* This applies to labels in all states (normal, focused, shrunk) */
/* CRITICAL: Must render above fieldset border (z-index) */
.high-contrast-mode .MuiInputLabel-root > span,
.high-contrast-mode .MuiFormLabel-root > span,
.high-contrast-mode .MuiTextField-root .MuiInputLabel-root > span,
.high-contrast-mode .MuiFormControl-root .MuiInputLabel-root > span {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  /* Increased padding to fully cover 2px border line */
  padding-left: 6px !important;
  padding-right: 6px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  /* Ensure background is opaque and extends fully */
  opacity: 1 !important;
  display: inline-block !important;
  /* CRITICAL: Render above fieldset border */
  position: relative !important;
  z-index: 10 !important;
}

/* CRITICAL: InputLabel shrink state must have white background */
/* This ensures labels break the border line when shrunk (floating above field) */
.high-contrast-mode .MuiInputLabel-root.MuiInputLabel-shrink {
  background-color: #FFFFFF !important;
}

/* The notchedOutline legend (which creates the notch) needs white background */
/* The legend creates the gap in the border - it should be transparent/hidden */
/* Only the InputLabel above it should be visible with white background */
.high-contrast-mode .MuiOutlinedInput-notchedOutline legend {
  background-color: #FFFFFF !important;
  /* Make legend text transparent since InputLabel is the visible label */
  color: transparent !important;
  /* Ensure legend doesn't interfere with InputLabel */
  pointer-events: none;
  /* CRITICAL: Legend must render above fieldset border but below label */
  position: relative !important;
  z-index: 5 !important;
}

/* Legend span should be transparent - InputLabel is what's visible */
.high-contrast-mode .MuiOutlinedInput-notchedOutline legend span {
  color: transparent !important;
  background-color: transparent !important;
}

/* Force all backgrounds to white (except backdrops) */
.high-contrast-mode main,
.high-contrast-mode [role="main"],
.high-contrast-mode .MuiCard-root,
.high-contrast-mode .MuiPaper-root:not(.MuiBackdrop-root):not(.MuiModal-root):not([class*="MuiDrawer"]),
.high-contrast-mode .MuiBox-root:not(.MuiBackdrop-root),
.high-contrast-mode .MuiContainer-root,
.high-contrast-mode .MuiStack-root {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* Force all borders to black and thick */
.high-contrast-mode * {
  border-color: #000000 !important;
}

.high-contrast-mode .MuiOutlinedInput-notchedOutline,
.high-contrast-mode .MuiOutlinedInput-root,
.high-contrast-mode .MuiInputBase-root:not(.MuiBackdrop-root),
.high-contrast-mode .MuiTextField-root,
.high-contrast-mode .MuiCard-root,
.high-contrast-mode .MuiPaper-root:not(.MuiBackdrop-root) {
  border-color: #000000 !important;
  border-width: 2px !important;
}

/* CRITICAL: Create stacking context for InputBase so z-index works */
.high-contrast-mode .MuiOutlinedInput-root,
.high-contrast-mode .MuiInputBase-root {
  position: relative !important;
}

/* Form inputs - white background, black text, black border */
.high-contrast-mode .MuiTextField-root .MuiOutlinedInput-root,
.high-contrast-mode .MuiInputBase-root:not(.MuiBackdrop-root),
.high-contrast-mode input:not([type="hidden"]):not(.MuiBackdrop-root),
.high-contrast-mode textarea:not(.MuiBackdrop-root),
.high-contrast-mode select:not(.MuiBackdrop-root) {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
}

/* FormControl - white background so labels inherit it */
/* CRITICAL: Create stacking context so InputLabel z-index works relative to fieldset */
.high-contrast-mode .MuiFormControl-root {
  background-color: #FFFFFF !important;
  position: relative !important;
}

.high-contrast-mode .MuiOutlinedInput-notchedOutline {
  border-color: #000000 !important;
  border-width: 2px !important;
  /* CRITICAL: Fieldset border must render below label */
  position: relative !important;
  z-index: 1 !important;
}

/* CRITICAL: Ensure notched outline creates proper gap for label */
/* Material-UI's notchedOutline automatically creates a notch where the label sits */
/* The label's white background breaks the border line */
.high-contrast-mode .MuiOutlinedInput-notchedOutline legend {
  /* Ensure legend (notch) is properly sized for label */
  max-width: 100%;
  /* White background for the notch area to break border */
  background-color: #FFFFFF !important;
}

/* Ensure InputLabel text always has white opaque background regardless of state */
/* This prevents border line from appearing to strike through the text */
.high-contrast-mode .MuiTextField-root .MuiInputLabel-root > span,
.high-contrast-mode .MuiFormControl-root .MuiInputLabel-root > span {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  padding-left: 4px !important;
  padding-right: 4px !important;
  position: relative;
  z-index: 1;
  opacity: 1 !important;
}

/* Buttons - white background, black text, black border */
/* CRITICAL: Must override inline sx styles with !important */
.high-contrast-mode .MuiButton-root:not(.Mui-disabled),
.high-contrast-mode button:not(.MuiBackdrop-root):not(.Mui-disabled),
.high-contrast-mode [role="button"]:not(.MuiBackdrop-root):not(.Mui-disabled) {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  font-weight: 600 !important;
}

.high-contrast-mode .MuiButton-root:hover:not(.Mui-disabled),
.high-contrast-mode button:hover:not(.MuiBackdrop-root):not(.Mui-disabled),
.high-contrast-mode .MuiButton-root.MuiButton-contained:hover:not(.Mui-disabled) {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* Override any inline color styles on buttons in high contrast mode */
.high-contrast-mode .MuiButton-root[style*="color"],
.high-contrast-mode button[style*="color"] {
  color: #000000 !important;
}

/* Ensure button text is always black in high contrast mode */
.high-contrast-mode .MuiButton-root .MuiButton-label,
.high-contrast-mode button span {
  color: #000000 !important;
}

/* Links - black, underlined */
.high-contrast-mode a:not(.MuiButton-root) {
  color: #000000 !important;
  text-decoration: underline !important;
  font-weight: 600 !important;
}

.high-contrast-mode a:hover:not(.MuiButton-root) {
  color: #000000 !important;
}

/* Icons - default to black for text/icons on white backgrounds */
.high-contrast-mode svg:not([fill="none"]):not(.MuiButton-root svg):not(.MuiIconButton-root svg),
.high-contrast-mode .MuiSvgIcon-root:not(.MuiButton-root .MuiSvgIcon-root):not(.MuiIconButton-root .MuiSvgIcon-root) {
  color: #000000 !important;
  fill: #000000 !important;
}

/* Buttons with icons - keep black icons */
.high-contrast-mode .MuiButton-root svg,
.high-contrast-mode button svg,
.high-contrast-mode .MuiButton-root .MuiSvgIcon-root,
.high-contrast-mode button .MuiSvgIcon-root {
  color: #000000 !important;
  fill: #000000 !important;
}

/* IconButtons - black icons on white background */
.high-contrast-mode .MuiIconButton-root {
  color: #000000 !important;
  background-color: #FFFFFF !important;
  border: 2px solid #000000 !important;
}

.high-contrast-mode .MuiIconButton-root svg,
.high-contrast-mode .MuiIconButton-root .MuiSvgIcon-root {
  color: #000000 !important;
  fill: #000000 !important;
}

.high-contrast-mode .MuiIconButton-root:hover {
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

.high-contrast-mode .MuiIconButton-root:hover svg,
.high-contrast-mode .MuiIconButton-root:hover .MuiSvgIcon-root {
  color: #000000 !important;
  fill: #000000 !important;
}

/* Icons in headers/drawers - black */
.high-contrast-mode [style*="headerBackground"] svg,
.high-contrast-mode [style*="headerBackground"] .MuiSvgIcon-root,
.high-contrast-mode .MuiDrawer-paper[style*="headerBackground"] svg,
.high-contrast-mode .MuiDrawer-paper[style*="headerBackground"] .MuiSvgIcon-root {
  color: #000000 !important;
  fill: #000000 !important;
}

/* Chips and badges - white background, black text */
.high-contrast-mode .MuiChip-root {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
}

/* Tables - black borders, white background */
.high-contrast-mode .MuiTable-root,
.high-contrast-mode .MuiTableContainer-root {
  border: 2px solid #000000 !important;
}

.high-contrast-mode .MuiTableCell-root {
  border-color: #000000 !important;
  border-width: 1px !important;
  background-color: #FFFFFF !important;
  color: #000000 !important;
}

/* Dividers - black and thick */
.high-contrast-mode .MuiDivider-root {
  background-color: #000000 !important;
  border-color: #000000 !important;
  border-width: 2px !important;
}

/* Chart Colors - Preserve Carbon Design System colors in high contrast mode */
/* CRITICAL: Chart colors must remain visible for data visualization */
/* These exceptions allow chart colors to display properly while maintaining accessibility */

/* Chart color elements marked with data attribute */
.high-contrast-mode [data-chart-color="true"] {
  /* Preserve original chart colors - do not override */
  background-color: inherit !important;
  background: inherit !important;
  color: inherit !important;
}

/* Recharts SVG elements - preserve fill colors */
.high-contrast-mode [data-chart-color="true"] path,
.high-contrast-mode [data-chart-color="true"] circle,
.high-contrast-mode [data-chart-color="true"] rect,
.high-contrast-mode [data-chart-color="true"] polygon {
  fill: inherit !important;
  stroke: inherit !important;
}

/* Chart legend items - preserve colors */
.high-contrast-mode [class*="chart-legend"] [data-chart-color="true"],
.high-contrast-mode [class*="ChartLegend"] [data-chart-color="true"] {
  background-color: inherit !important;
}

/* Tab colors for paths - preserve chart colors when using Carbon palette */
.high-contrast-mode .MuiTab-root[data-chart-color="true"] {
  background: inherit !important;
  background-color: inherit !important;
  color: inherit !important;
}

/* Tooltips - Opaque white background with black text in high contrast mode */
/* CRITICAL: Tooltips must be readable in high contrast mode */
/* MUI Tooltip uses .MuiTooltip-tooltip class for the tooltip content */
.high-contrast-mode .MuiTooltip-tooltip,
.high-contrast-mode [class*="MuiTooltip-tooltip"],
.high-contrast-mode [role="tooltip"] {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 2px solid #000000 !important;
  opacity: 1 !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

/* Tooltip arrow - white background with black border to match tooltip */
.high-contrast-mode .MuiTooltip-arrow,
.high-contrast-mode .MuiTooltip-arrow::before {
  color: #FFFFFF !important;
  background-color: #FFFFFF !important;
  border-color: #000000 !important;
}

/* Tooltip arrow pseudo-element (MUI uses ::before for arrow) */
.high-contrast-mode .MuiTooltip-arrow::before {
  background-color: #FFFFFF !important;
  border: 2px solid #000000 !important;
  box-shadow: none !important;
}

/* Tooltip text and all child elements - ensure black text */
.high-contrast-mode .MuiTooltip-tooltip *,
.high-contrast-mode .MuiTooltip-tooltip span,
.high-contrast-mode .MuiTooltip-tooltip div,
.high-contrast-mode .MuiTooltip-tooltip p,
.high-contrast-mode [class*="MuiTooltip-tooltip"] *,
.high-contrast-mode [role="tooltip"] * {
  color: #000000 !important;
}

/* Preserve Carbon Design System extended categorical colors in high contrast mode */
/* Extended palette: 14 official colors + 16 from sequential palettes (30 total) */
.high-contrast-mode [style*="background-color: #6929c4"],
.high-contrast-mode [style*="background-color: #1192e8"],
.high-contrast-mode [style*="background-color: #005d5d"],
.high-contrast-mode [style*="background-color: #9f1853"],
.high-contrast-mode [style*="background-color: #fa4d56"],
.high-contrast-mode [style*="background-color: #570408"],
.high-contrast-mode [style*="background-color: #198038"],
.high-contrast-mode [style*="background-color: #002d9c"],
.high-contrast-mode [style*="background-color: #ee538b"],
.high-contrast-mode [style*="background-color: #b28600"],
.high-contrast-mode [style*="background-color: #009d9a"],
.high-contrast-mode [style*="background-color: #012749"],
.high-contrast-mode [style*="background-color: #8a3800"],
.high-contrast-mode [style*="background-color: #a56eff"],
/* Extended palette colors (15-30) from sequential palettes */
.high-contrast-mode [style*="background-color: #0f62fe"],
.high-contrast-mode [style*="background-color: #8a3ffc"],
.high-contrast-mode [style*="background-color: #0072c3"],
.high-contrast-mode [style*="background-color: #007d79"],
.high-contrast-mode [style*="background-color: #0043ce"],
.high-contrast-mode [style*="background-color: #491d8b"],
.high-contrast-mode [style*="background-color: #00539a"],
.high-contrast-mode [style*="background-color: #004144"],
.high-contrast-mode [style*="background-color: #001d6c"],
.high-contrast-mode [style*="background-color: #31135e"],
.high-contrast-mode [style*="background-color: #003a6d"],
.high-contrast-mode [style*="background-color: #022b30"],
.high-contrast-mode [style*="background-color: #4589ff"],
.high-contrast-mode [style*="background-color: #be95ff"],
.high-contrast-mode [style*="background-color: #33b1ff"],
.high-contrast-mode [style*="background-color: #08bdba"],
.high-contrast-mode [style*="background: #6929c4"],
.high-contrast-mode [style*="background: #1192e8"],
.high-contrast-mode [style*="background: #005d5d"],
.high-contrast-mode [style*="background: #9f1853"],
.high-contrast-mode [style*="background: #fa4d56"],
.high-contrast-mode [style*="background: #570408"],
.high-contrast-mode [style*="background: #198038"],
.high-contrast-mode [style*="background: #002d9c"],
.high-contrast-mode [style*="background: #ee538b"],
.high-contrast-mode [style*="background: #b28600"],
.high-contrast-mode [style*="background: #009d9a"],
.high-contrast-mode [style*="background: #012749"],
.high-contrast-mode [style*="background: #8a3800"],
.high-contrast-mode [style*="background: #a56eff"],
/* Extended palette colors (15-30) from sequential palettes */
.high-contrast-mode [style*="background: #0f62fe"],
.high-contrast-mode [style*="background: #8a3ffc"],
.high-contrast-mode [style*="background: #0072c3"],
.high-contrast-mode [style*="background: #007d79"],
.high-contrast-mode [style*="background: #0043ce"],
.high-contrast-mode [style*="background: #491d8b"],
.high-contrast-mode [style*="background: #00539a"],
.high-contrast-mode [style*="background: #004144"],
.high-contrast-mode [style*="background: #001d6c"],
.high-contrast-mode [style*="background: #31135e"],
.high-contrast-mode [style*="background: #003a6d"],
.high-contrast-mode [style*="background: #022b30"],
.high-contrast-mode [style*="background: #4589ff"],
.high-contrast-mode [style*="background: #be95ff"],
.high-contrast-mode [style*="background: #33b1ff"],
.high-contrast-mode [style*="background: #08bdba"] {
  /* Preserve original chart colors - do not override */
  background-color: inherit !important;
  background: inherit !important;
  color: inherit !important;
}

/* Explicitly preserve backdrop styling - CRITICAL to prevent white overlay */
.high-contrast-mode .MuiBackdrop-root {
  background-color: rgba(0, 0, 0, 0.7) !important;
}

/* Preserve modal and drawer styling - but ensure high contrast inside */
.high-contrast-mode .MuiModal-root .MuiPaper-root,
.high-contrast-mode .MuiDrawer-root .MuiPaper-root,
.high-contrast-mode [class*="MuiDrawer"] .MuiPaper-root {
  background-color: #FFFFFF !important;
  color: #000000 !important;
  border: 3px solid #000000 !important;
}

/* Enhanced Focus Indicators - black outline */
.enhanced-focus-mode *:focus {
  outline: 3px solid #000000 !important;
  outline-offset: 2px !important;
  border-radius: 2px !important;
  box-shadow: 0 0 0 1px #FFFFFF, 0 0 0 4px #000000 !important;
}

.enhanced-focus-mode button:focus,
.enhanced-focus-mode a:focus,
.enhanced-focus-mode [role="button"]:focus {
  outline: 3px solid #000000 !important;
  outline-offset: 2px !important;
}

/* WCAG AAA Interactive Element Size - 44x44px minimum */
.wcag-interactive-size-aaa button,
.wcag-interactive-size-aaa .MuiButton-root,
.wcag-interactive-size-aaa .MuiIconButton-root,
.wcag-interactive-size-aaa a[href],
.wcag-interactive-size-aaa input[type="button"],
.wcag-interactive-size-aaa input[type="submit"],
.wcag-interactive-size-aaa input[type="checkbox"],
.wcag-interactive-size-aaa input[type="radio"],
.wcag-interactive-size-aaa [role="button"],
.wcag-interactive-size-aaa [role="link"] {
  min-width: 44px !important;
  min-height: 44px !important;
}

/* Font Size Adjustments */
:root {
  --accessibility-font-size: 1rem;
}

/* Skip Links Styles */
.skip-link {
  position: absolute;
  top: -100px;
  left: 0;
  background-color: #000;
  color: #fff;
  padding: 8px 16px;
  text-decoration: none;
  font-size: 1rem;
  font-weight: 600;
  z-index: 1301;
}

.skip-link:focus {
  top: 0;
  outline: 3px solid #000000;
  outline-offset: 2px;
}

/* Snackbar: Position below AppBar so it doesn't hide the top bar/logo */
.snackbarContainerBelowAppBar {
  top: 56px !important;
}