    /* =========   Layout styles (aus MainLayout)   ========= */
    html,
    body {
        margin: 0;
        padding: 0;
        height: 100%;
    }

    .mud-layout,
    .layout-root {
        height: 100vh;
    }

    .mud-main-content {
        height: 100vh;
        overflow: auto;
    }

    /* ===================== css override needed to use Text.Primary and Text.Secondary styles ===================== */
    .mud-typography.mud-primary-text {
        color: var(--mud-palette-text-primary) !important;
    }

    .mud-typography.mud-secondary-text {
        color: var(--mud-palette-text-secondary) !important;
    }

    .app-dark .mud-drawer-content {
        /* background-image: url('/img/bg_drawer_452.png'); */
        background-size: cover;
        background-repeat: no-repeat;
        background-position: center;
    }

    .nav-menu {
        display: flex;
        flex-direction: column;
        height: 95vh;
    }

    .nav-grow {
        flex: 1 1 auto;
    }

    .logout-btn .mud-icon-root {
        margin-left: 10px;
    }

    .logout-btn .nav-text {
        margin-left: 15px;
    }

    /* bg Grundfläche DARKMODE */
    .app-dark .app-content {
        min-height: 100vh;
        /* background-image: url("/img/full_bg_2418x1360.png"); */
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
    }

    /* bg sicherstellen das nichts „überläuft“ */
    .app-dark .mud-main-content {
        height: 100vh;
        overflow: auto;
    }
