html, body {
    width: 100%;
    height: 100%;
    overscroll-behavior-y: none;
}

body {
  overflow-x: hidden;
}


@include media-breakpoint-up(xl) {
    .aside {
        min-width: $app-aside-min-width;
        max-width: $app-aside-width;
        min-height: 100vh;

        nav {
            height: 100%;
        }
    }
}

@include media-breakpoint-down(xl) {

    .aside-collapse {
        min-height: calc(100vh - 4rem);
        visibility: hidden;
        opacity: 0;
        transition: all 1ms ease!important;
    }

    .aside {
        height: 60px;
        transition: all 300ms ease;
    }

    body.menu-open {
        .aside-collapse {
            display: flex !important;
            visibility: visible;
            opacity: 1;
        }

        .aside {
            height: auto!important;
            min-height: 100vh;
        }

        .workspace {
            display: none !important;
        }
    }

    body:not(.menu-open) {
        .aside-collapse{
            .sub-menu {
                visibility: hidden !important;
            }
        }
    }
}


.full-height {
  height: 100vh;
  overflow: auto;
}


.command-bar {
    --#{$prefix}dropdown-item-padding-x: 1rem;
    --#{$prefix}dropdown-item-padding-y: .25rem;
}

.table td {
    --#{$prefix}dropdown-item-padding-x: 0.5rem;
    --#{$prefix}dropdown-item-padding-y: .25rem;
}

.command-bar, .table td, {
    --#{$prefix}dropdown-spacer: #{$dropdown-spacer};
    --#{$prefix}dropdown-color: #{$dropdown-color};
    --#{$prefix}dropdown-bg: #{$dropdown-bg};
    --#{$prefix}dropdown-border-color: #{$dropdown-border-color};
    --#{$prefix}dropdown-border-radius: #{$dropdown-border-radius};
    --#{$prefix}dropdown-border-width: #{$dropdown-border-width};
    --#{$prefix}dropdown-inner-border-radius: #{$btn-border-radius};

    --#{$prefix}dropdown-link-color: #{$dropdown-link-color};
    --#{$prefix}dropdown-link-hover-color: #{$dropdown-link-hover-color};
    --#{$prefix}dropdown-link-hover-bg: #{$dropdown-link-hover-bg};
    --#{$prefix}dropdown-link-active-color: #{$dropdown-link-active-color};
    --#{$prefix}dropdown-link-active-bg: #{$dropdown-link-active-bg};
    --#{$prefix}dropdown-link-disabled-color: #{$dropdown-link-disabled-color};

    .btn {
        @extend .dropdown-item;
    }
}

.dropdown-menu{
    .btn {
        @extend .dropdown-item;
    }
}


@include media-breakpoint-down(md) {
    // Styles

    .app:before {
        display: none;
    }

    .command-bar {
        display: inline-block !important;
        list-style: none;
        margin: 0;
        padding: 0;
        overflow-x: auto;
        white-space: nowrap;
        width: 100%;
        position: initial;
        vertical-align: middle;
        text-align: center;

        li {
            display: inline-block;

            /*
            &:last-child{
                .btn-link {
                    margin-right: 0;
                    padding-right: 0;
                }
            }
            &:first-child{
                .btn-link {
                    margin-left: 0;
                    padding-left: 0;
                }
            }
             */

        }
    }
}


.layout {
    @extend .bg-white;
    @extend .shadow-sm;
    @extend .rounded;
    @extend .p-4;
    @extend .mb-3;
}

.layout-wrapper-no-padder {
    > .p-4 {
        padding: 0 !important;
    }
}

.layout-wrapper {
    .shadow-sm {
        box-shadow: none !important;
    }

    > .mb-3:last-child{
        @extend .mb-0
    }
}

.iframe-error {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 2050;
    width: 100vw;
    height: 100vh;
    overflow: hidden;
    outline: 0;
    border: none;
}


.workspace-limit {
    max-width: calc(1120px + #{$spacer});
    overscroll-behavior-y: none;
}


.command-bar-wrapper {
    position: sticky;
    bottom: 0;
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
    z-index: 5;
    left: 0;
    right: 0;
}


@include media-breakpoint-down(md) {
    .command-bar-wrapper {
        .layout {
            //background-color: $dark !important;
            padding: 1.5em 0 !important;
            margin-top: 0.3em;
            border-top: 1px solid $border-color;
        }

        /*
        .command-bar {
            .btn {
                //color: $white!important;
                display: flex !important;
                flex-direction: column !important;
                //font-size: 0.875rem;
                //padding-top: 0.8em;
                padding: 0.7em;
                border-radius: 0.5rem;

                svg {
                    height: 1.5em;
                    width: 1.5em;
                    margin: 0 !important;
                    //margin: 0 0 0.3rem 0 !important;
                }

                span {
                    display: none;
                }
            }
        }

         */
    }
}

