/* Loading Overlay - Global Styles (Not Scoped) */
/* This ensures the loading overlay covers EVERYTHING including sidebar */

.loading-overlay {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100vw !important;
    height: 100vh !important;
    background-color: rgba(240, 240, 240, 0.5) !important;  /* 50% opacity - more background shows through */
    backdrop-filter: blur(3px) !important;
    z-index: 9999999 !important;  /* Higher than everything else */
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: all !important;
}

.loading-overlay .spinner-border {
    width: 5rem !important;
    height: 5rem !important;
    border-width: 0.4rem !important;
    /* Let Bootstrap's default spinning animation work - don't override */
}