//@import "../../../abstracts/abstracts";

.generic-folder-document-class-list-container {
    height: 100%;//calc(100% - $navbar-height);

    #associated-folder-document-control-container {
        background: $modal-body-background;
        max-height: calc(100% - $margin-vertical-default);
        margin-top: $margin-default;
        overflow-y: auto;
        border-radius: $border-radius-default;
        @include scrollbar;

        .dbq-form section {
            padding: $padding-default;
        }
    }

    #content-wrapper {
        .dbq-right-column {
            nav.navbar {
                display: flex;
                flex-wrap: nowrap;

                .dbq-navbar-left {
                    display: flex;
                    align-items: center;
                    //margin-left: 30px;

                    // Hide the logo in the right column by default.
                    // It may only be visible when there is no sidemenu.
                    .navbar-brand {
                        display: none;
                    }

                    // The menu button may only be visible in smaller resolutions (mobile)
                    .dbq-navbar-menu-button {
                        display: none;
                    }
                    
                    .dbq-navbar-brand-container {
                        display: flex;
                        align-items: center;

                        .dbq-navbar-menu-button {
                            padding: 0 15px 0 15px;
                            display: none;

                            svg {
                                fill: $text-color-default;
                            }

                            &:hover {
                                svg {
                                    fill: $color-primary;
                                }
                            }
                        }
                    }

                    .dbq-navbar-breadcrumbs {
                        max-width: 100% !important;
                    }
                }
                
                .dbq-navbar-right {
                    display: flex;
                
                    #main-menu {
                        float: left;
                        height: $navbar-height;
                        display: flex;
                        align-items: center;
                    }
                }
            }

            .document-class-list-control-container {
                .dbqdcl-nav-tab-options-container {
                    display: none !important;
                }
            }
        }

        &[data-has-sidemenu="false"] {
            .dbq-left-column {
                display: none;
            }

            .dbq-right-column {
                width: 100%;
                
                // There is no sidemenu, show the logo next to the breadcrumbs.
                nav.navbar {
                    .dbq-navbar-left {
                        .navbar-brand {
                            display: block;

                            // Set the customer Logo
                            @if ($navbar-logo-img != false) {
                                background: $navbar-logo-img no-repeat center center;
                                background-size: contain;
                                background-position-x: left;
                                width: 220px;
                    
                                svg {
                                    display: none !important;
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    #classlist-dynamic-folder-documents {
        margin-left: auto;
        margin-right: auto;
        background: color(wrapper-background);

        .dbqgfdclc-loading-view {
            position: relative;
            height: 200px;
        }
    }

    // Container is displayed when the user is going to a page which doesn't exist.
    .dbqgfdclc-invalid-container {
        background-color: $global-background-color-default;
        border-radius: $border-radius-default;
        padding: $padding-default;
        margin-top: $margin-default;
    }

    // The maintenance container is displayed when the SystemState is set to disabled.
    .dbq-maintenance-container {
        z-index: 1;
        
        .dbq-maintenance-container-center {
            left: 50%;
            -ms-transform: translateX(-50%) translateY(-50%);
            transform: translateX(-50%) translateY(-50%);

            .dbq-maintenance-container-text {
                border-bottom: 0;
            }
        }
    }

    #classlist-search-list {
        #classlist-dbq-tree-grid {
            overflow-y: auto;
        }
    }
}

// Public portal mobile styling (hamburger menu, breadcrumbs, header)
@media only screen and (max-width: 720px) {
    .generic-folder-document-class-list-container {
        #content-wrapper {

            // Breadcrumb changes for mobile
            .dbqkbbs-breadcrumbs,
            #dbq-document-class-list-breadcrumbs {
                a {
                    &:first-child {
                        padding-left: 15px;

                        &::after {
                            display: none;
                        }
                    }

                    &:not(:first-child) {
                        display: none;
                    }
                }
            }

            .dbq-left-column {
                display: none;
                position: absolute;
                top: $navbar-height;
                right: 0;
                left: 0;
                bottom: 0;
                width: 100%;
                height: calc(100% - $navbar-height);

                // Hide the logo for mobile
                .navbar-brand {
                    display: none !important;
                }

                #navigator.dbq-folder-tree-container {
                    .dbqft-list-header {
                        height:0;
                    }
                }
            }

            &.dbq-mobile-menu-visible {
                .dbq-left-column {
                    display: block;

                    #navigator.dbq-folder-tree-container {
                        .dbqft-list-header {
                            margin: 0;

                            .dbqft-list-collapse-button {
                                display: none;
                            }
                        }
                    }
                }
            }
            
            .dbq-right-column {
                nav.navbar {
                    .dbq-navbar-left {
                        margin-left: $margin-default !important;
                    }

                    .dbq-navbar-right {
                        margin-right: $margin-default !important;
                    }
                }

                // Opened notification center
                &.dbqnc-expanded {

                    // By increasing the z-index of the right column, we ensure that the notification center is visible.
                    // Otherwise it's possible for the hamburger menu to be displayed on top, causing only the header of
                    // the notification center to be visible.
                    z-index: 3; 

                    #dbq-notification-center {
                        width: 100%;
                        z-index: 15;
                    }            
                }
            }

            // Show the mobile hamburger menu button if a sidemenu is available.
            &[data-has-sidemenu="true"] {                
                .dbq-right-column {
                    nav.navbar {
                        .dbq-navbar-left {
                            .dbq-navbar-menu-button {
                                display: block !important;
                            }
                        }
                    }
                }
            }
        }
    }
}