/**
 * Global Fixes for Common Issues
 */

/* Fix for MUI Modal aria-hidden blink issue */
/* CRITICAL: Prevent the #app div from being visually hidden when modals open */
/* This fixes the "invisible page" issue */
#app {
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  transform: none !important;
  will-change: auto !important;
  contain: none !important;
}

#app[aria-hidden="true"] {
  visibility: visible !important;
  opacity: 1 !important;
  display: block !important;
  transform: none !important;
  will-change: auto !important;
  contain: none !important;
  /* Don't disable pointer-events on the entire app! */
}

/* Ensure all children of #app remain visible */
#app[aria-hidden="true"] > *,
#app[aria-hidden="true"] > * > *,
#app > *,
#app > * > * {
  visibility: visible !important;
  opacity: 1 !important;
}

/* Force repaint on page load */
#app::before {
  content: '';
  display: block;
  height: 0;
  width: 0;
}

/* When modal is open, only the modal should receive pointer events */
body:has(#modal-root > *) #app[aria-hidden="true"] > * {
  pointer-events: none !important;
}

/* Ensure modal root is always above app and interactive */
#modal-root {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1300; /* Same as MUI modal */
  pointer-events: none; /* Container doesn't block clicks */
}

#modal-root > * {
  pointer-events: auto; /* But modals inside do receive clicks */
}

/* Prevent layout shift when scroll is locked */
body.MuiModal-root-open {
  overflow: hidden !important;
  padding-right: 0 !important; /* Prevent scrollbar width compensation */
}