/*--------------------------------------------------
    [PAGE SIDEBAR]
----------------------------------------------------*/

.page-content-container {
    overflow: hidden;
}

.page-content-row {
    width: 100%;
    display: table;
    table-layout: fixed;
    height: 100%;
    position: relative;
    margin: 0;
    padding: 0;

    /* Page Siderbar */
    .page-sidebar {
        display: table-cell;
        vertical-align: top;
        width: 225px;
        min-width: 225px;
        margin: 0px;
        padding: 0;

        /* Navbar Collapse */
        h3 {
            font-size: 18px;
            font-weight: 500;
            line-height: 1.4;
            margin: 0 0 15px;
            text-transform: uppercase;
            color: $text-dark-blue-color;
            font-family: 'Oswald', sans-serif;    
        }

        /* Navbar Nav */
        .navbar-nav {
            float: none;
            padding: 0;
            margin: 0 0 30px 0;

            > li {
                    float: none;
                    display: block;
                    margin-top: 2px;

                    &:first-child {
                        margin-top: 0;
                    }

                    > a {
                        display: block;
                        color: #6c7b88;
                        font-size: 14px;
                        font-weight: 600;
                        padding: 10px 20px;
                        background: #f4f7f8;
                        text-transform: uppercase;
                        @include border-radius(2px);

                        > i {
                            color: #5c7b88;
                            margin-right: 7px;
                        }

                        .label {
                            font-size: 11px;
                            margin: 1px 0 0;
                            float: right !important;
                        }

                        .badge {
                            margin-top: 1px;
                            float: right !important;
                        }

                        &:hover {
                            color: $text-white-color;
                            background: $bg-blue-color;

                            > i {
                                color: $text-white-color;
                            }
                        }
                    }
            }

            li.active {
                    > a {
                        color: $text-white-color;
                        background: $bg-blue-color;

                        > i {
                            color: $text-white-color;
                        }
                    }
            }
        }
    }

    .page-content-col {
        vertical-align: top;
        display: table-cell;
        padding-left: 20px;
    }
}

/* Material Design */
.page-md {
    .page-sidebar {
        .navbar-nav {
            box-shadow: 0px 2px 5px 2px rgba(0,0,0,.1);
        }
    }
}

@media (max-width: $screen-sm-max) { /* 991px */

    /* Navbar Toggle */
    .navbar-toggle {
        display: inline-block;
        border: none;
        padding-right: 0;
        margin: 8px 0 7px 20px;

        .icon-bar {
            width: 25px;
            background: #606d78;

            + .icon-bar {
                margin-top: 5px;
            }
        }
    }

   .page-content-row {
        width: 100%;
        display: block;
        
        /* Page Siderbar */
        .page-sidebar {
            overflow-y: hidden;
            display: block;
            height: 0;
            margin-bottom: 20px;
            width: 100%;
            min-width: 100%;
        }

        .page-sidebar.in {
            height: auto;
            display: block;
        }

        .page-content-col {
            padding-left:0px;
            display: block;

            .page-content { 
                padding-top: 0;
            }
        }
    }   
}