.aw-page-aside {
    &__buttons {
        margin-top: 1.5rem;

        position: sticky;
        bottom: calc(1rem + env(safe-area-inset-bottom, 0px) + var(--page-aside-buttons-bottom, 0px));
    }
}

@screen lg {
    .aw-page-aside-page-body {
        .aw-layout {
            .aw-layout__aw-layout-menu.aw-layout-menu--hide-submenu ~ .aw-page-aside,
            .aw-layout__aw-layout-menu.aw-layout-menu--no-submenu ~ .aw-page-aside {
                .aw-page-header__breadcrumbs {
                    left: calc(6rem + 1.5rem);
                }
            }
        }
    }

    .aw-page-aside {
        display: flex;

        &__content {
            margin-bottom: auto;
        }

        &__buttons {
            bottom: 1.5rem;
            margin-bottom: env(safe-area-inset-bottom, 0px);
        }

        &__aside {
            @apply p-6;
            background-color: var(--c-surface);
            color: var(--c-on-surface);
            flex-shrink: 0;
            width: var(--aside-width);

            display: flex;
            flex-direction: column;

            &--line {
                background-color: transparent;
                border-left: 1px solid var(--c-mono-800);
            }
        }

        &__wrapper {
            width: calc(100% - var(--aside-width));
        }
    }
}