/**
 * Anti-flickering optimization styles
 * These styles help prevent visual flickering in the application
 */

/* Force GPU rendering on all elements */
* {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Force hardware acceleration for page transitions */
#root {
  transform: translateZ(0);
  will-change: transform;
  isolation: isolate;
}

/* Improve rendering of all cards and containers */
.card,
.container,
.panel,
.box,
.modal,
.sidebar,
.form-panel {
  transform: translateZ(0);
  will-change: transform;
}

/* Avoid flickering during animations */
.transition-element,
.nav-item,
.btn,
button {
  transform: translateZ(0);
  transition: all 0.2s ease !important;
  will-change: transform, opacity;
}

/* Prevent layout shifts */
img, svg {
  transform: translateZ(0);
  will-change: transform;
}

/* Smoother scrolling */
.scrollable,
.overflow-auto,
div[style*="overflow"] {
  -webkit-overflow-scrolling: touch;
}

/* Prevent paint flashing */
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  pointer-events: none;
}