@import "theme/vars.less";

.sidedrawers-wrapper {
    position: relative;
    top: 0;
    right: 0;

    display: flex;
    flex-direction: row;

    padding: @sidebar_padding;

    height: 100dvh;
    height: 100vh;

    .sidedrawer {
        position: absolute;

        z-index: 100;

        top: 0;
        left: 0;
        bottom: 0;

        margin-top: @sidebar_padding;
        height: calc(100% - @sidebar_padding * 2);

        width: auto;

        min-width: 400px;
        max-width: 15vw;

        background-color: var(--sidedrawer-background-color);
        border-radius: @sidebar_borderRadius;

        padding: 20px;

        overflow-x: hidden;
        overflow-y: overlay;

        box-shadow: @card-shadow;
    }

    &.hidden{
        width: 0;
        padding: 0;
    }
}