/* Die Spaces-Seite bleibt vollständig im Viewport. Der globale Main-Scroller wird
   nur auf dieser Seite abgeschaltet; die einzelnen Panels scrollen selbst. */
.mud-main-content:has(.spaces-page-content) {
    overflow: hidden !important;
}

/* Der globale Container hat durch `p-4` 16 px Innenabstand. Oben wird dieser
   Platz für die Spaces-Seite entfernt; unten bleiben die 16 px zusammen mit
   dem unteren Seitenabstand von 4 px als sichtbare 20-px-Lücke erhalten. */
.mud-main-content:has(.spaces-page-content) > .mud-container {
    padding-top: 0 !important;
}

.spaces-page-content {
    height: calc(100dvh - 40px);
    min-height: 0;
    margin-top: 0;
    margin-bottom: 4px;
    padding-bottom: 2rem;
    box-sizing: border-box;
    justify-content: flex-start;
    overflow: hidden;
}

.spaces-page-grid,
.spaces-details-pool-layout,
.spaces-details-pool-grid {
    height: 100%;
    min-height: 0;
    overflow: hidden;
}

.spaces-tree-column,
.spaces-details-pool-column,
.spaces-details-column,
.spaces-device-pool-column {
    min-height: 0;
    overflow: hidden;
}

.spaces-component-scroll,
.spaces-details-sticky,
.spaces-device-pool-sticky {
    height: 100%;
    max-height: 100%;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}

.spaces-device-pool-sticky > div {
    height: 100%;
}

.spaces-tree-scroll,
.spaces-details-sticky {
    overflow-y: hidden;
}

.spaces-tree-layout,
.spaces-details-panel-layout,
.spaces-details-panel-content {
    height: 100%;
    min-height: 0;
}

.spaces-tree-layout {
    overflow: hidden;
}

.spaces-tree-paper {
    flex: 1 1 0;
    min-height: 0;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}

.spaces-details-paper {
    height: 100%;
    min-height: 0;
    box-sizing: border-box;
    overflow-y: auto;
    overflow-x: hidden;
    overscroll-behavior: contain;
}

@media (min-width: 960px) {
    .spaces-tree-column,
    .spaces-details-pool-column,
    .spaces-details-column,
    .spaces-device-pool-column {
        height: 100%;
    }
}

@media (max-width: 959.98px) {
    .spaces-tree-column {
        height: 40%;
    }

    .spaces-details-pool-column {
        height: 60%;
    }

    .spaces-details-column,
    .spaces-device-pool-column {
        height: 50%;
    }
}