/* State Loading Overlay Component Styles */
/* A loading overlay for state changes (not routing changes) */
/* Breaks out of Container constraints to cover viewport */

/* Base state loading overlay - fixed positioning to cover viewport */
.state-loading-overlay.mantine-LoadingOverlay-root,
[id$="-state-loading-overlay"].mantine-LoadingOverlay-root,
#state-loading-overlay.mantine-LoadingOverlay-root {
  position: fixed !important;
  top: 70px !important; /* Below navbar */
  left: 0 !important;
  width: 100% !important;
  height: calc(100vh - 70px) !important;
  z-index: 1000 !important;
  /* Center the loader */
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
  /* Smooth transition when sidebar opens/closes */
  transition: left 0.3s ease-in-out, width 0.3s ease-in-out;
}

/* Adjust position when sidebar is open */
#page-content-wrapper.page-content--shifted .state-loading-overlay.mantine-LoadingOverlay-root,
#page-content-wrapper.page-content--shifted [id$="-state-loading-overlay"].mantine-LoadingOverlay-root,
#page-content-wrapper.page-content--shifted #state-loading-overlay.mantine-LoadingOverlay-root {
  left: 250px !important;
  width: calc(100% - 250px) !important;
}

/* When sidebar is closed */
#page-content-wrapper:not(.page-content--shifted) .state-loading-overlay.mantine-LoadingOverlay-root,
#page-content-wrapper:not(.page-content--shifted) [id$="-state-loading-overlay"].mantine-LoadingOverlay-root,
#page-content-wrapper:not(.page-content--shifted) #state-loading-overlay.mantine-LoadingOverlay-root {
  left: 0 !important;
  width: 100% !important;
}