/* Container Page Grid Layout Fix */
.page {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Transform vertical black column into a premium, responsive top navbar wrapper */
.sidebar {
    background-color: #1a1d20 !important; /* Premium Dark Theme */
    min-height: auto !important;
    padding: 0.75rem 1.5rem;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.15);
    z-index: 1030; /* Keeps it locked above scrolling elements */
}

/* Ensure the inner nav container spans full width cleanly */
.nav-scrollable {
    display: flex !important;
    align-items: center;
    width: 100%;
}

/* REMOVED: nav.flex-column wrapper logic.
   Your modern NavMenu.razor style block now controls the flex direction 
   and handles the clean right alignment!
*/

/* Smooth out the main layout spacing */
main {
    flex: 1;
    background-color: #f8f9fa; /* Soft off-white dashboard canvas background */
}

/* Add a clean breathing room container rule for the main body content */
.content {
    padding-top: 2rem !important;
    padding-bottom: 3rem !important;
}

/* Ensure the Blazor error UI bar is hidden by default */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 10px rgba(0, 0, 0, 0.2);
    display: none; /* <-- This is the missing link keeping it hidden */
    left: 0;
    fixed: bottom;
    padding: 0.6rem 1.2rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    /* Blazor automatically targets and displays it only when this class is appended during a crash */
    #blazor-error-ui.show {
        display: block;
    }