.basePane {
    background: var(--surface);
    background-clip: padding-box;
    border: 1px solid var(--surface-stroke-out);
    border-radius: var(--radius);
}

.basePaneLoader {
    position: absolute;
    display: flex;
    inset: 0;
    align-items: center;
    justify-content: center;
    backdrop-filter: blur(3px) saturate(180%);
    background: var(--surface-loader);
    border-radius: inherit;
    z-index: 100;
}

.basePaneStructure {
    composes: basePane;

    position: relative;
    display: block;
}

.basePaneStructure:not(.layerPane) > .basePaneStructure {
    background: unset;
    border: 0;
    box-shadow: none;
}

.basePane > .basePaneElement,
.basePane > :local(.form) > .basePaneElement {
    &:first-child {
        border-top-left-radius: calc(var(--radius) - 1px);
        border-top-right-radius: calc(var(--radius) - 1px);
    }

    &:last-child,
    &:not(.paneHeader):nth-last-child(1 of .basePaneElement) {
        border-bottom-left-radius: calc(var(--radius) - 1px);
        border-bottom-right-radius: calc(var(--radius) - 1px);
    }

    &:only-child {
        border: 0;
    }
}
