body:not(.page-loaded) {
    overflow: hidden !important;
}

body:not(.page-loaded) .content-wrapper,
body:not(.page-loaded) main,
body:not(.page-loaded) header,
body:not(.page-loaded) footer,
body:not(.page-loaded) nav,
body:not(.page-loaded) .alert,
body:not(.page-loaded) .offcanvas,
body:not(.page-loaded) .floating-buttons,
body:not(.page-loaded) .toast-container,
body:not(.page-loaded) .navbar,
body:not(.page-loaded) aside {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
}

body:not(.page-loaded) .offcanvas {
    display: none !important;
}

body:not(.page-loaded) .offcanvas-backdrop {
    display: none !important;
}

body.page-loaded .content-wrapper,
body.page-loaded main,
body.page-loaded header,
body.page-loaded footer,
body.page-loaded nav,
body.page-loaded .alert,
body.page-loaded .offcanvas,
body.page-loaded .floating-buttons,
body.page-loaded .toast-container,
body.page-loaded .navbar,
body.page-loaded aside {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transition: opacity 0.8s cubic-bezier(0.16, 1, 0.3, 1), 
                visibility 0.8s cubic-bezier(0.16, 1, 0.3, 1);
}