/* Background image */
.background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Ensure the image is behind the content */
}

/* AppBar styles */
.mud-appbar {
    background-color: #333;
    color: #fff;
}

/* Drawer styles */
.drawer-header {
    background-color: #444;
    color: #fff;
    padding: 16px;
}

.drawer-nav {
    background-color: #555;
}

    .drawer-nav a {
        color: #fff;
        padding: 10px;
        display: block;
        text-decoration: none;
    }

        .drawer-nav a:hover {
            background-color: #666;
        }

/* Main content styles */
/*.main-content {
    padding: 20px;
    flex: 1;
    overflow-y: auto;
    position: relative;*/ /* Ensure positioning context for background image */
/*}*/

/* Custom layout */
.custom-layout {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

/* Padding to prevent content clipping */
.content {
    padding-top: 64px; /* Adjust this value as needed based on the height of your AppBar */
    padding-bottom: 64px; /* Add bottom padding to prevent clipping */
}