//*****************************************************************************
//*****************************************************************************
// Nav Styles
//*****************************************************************************
//*****************************************************************************

.main-nav {
    background: $nav;

    .q-item {
        //border-bottom: 1px solid #e0e0e0;
        color: #eeeeee;
        //padding: 0 15px;
        min-height: 30px;

        .q-icon {
            &.material-icons {
                font-size: 18px;
            }
        }
    }

    .q-list.q-list-highlight .q-item {
        padding: 4px 16px;

        .q-item {
            border: none;

            &:first-child {
                padding-left: 0px;
            }
        }
    }

    .q-item.q-router-link--active {
        background: #DCE8ED;
        color: #444444;
    }

    i {
        color: #fff !important;
    }

    .q-router-link--active i {
        color: $nav !important;
    }

}

aside {
    background: $nav;
    box-shadow: none;
    //border-right: 1px solid #e5e5e5;
    //border-left: 1px solid #e5e5e5;
    top: 56px !important;
    width: 250px;

    /*
    &.q-drawer{
        &.q-drawer--right {
            &.fixed {
                top: 0px !important;
            }
        }
    }
    */

    &.q-drawer--left,
    &.q-drawer--right {
        background: $primary;
    }

    .nav-header {
        background: $secondary !important;
        color: white;
        padding: 8px 16px;
    }

    //-------------------------------------------------------------------------
    // Recent Activity
    //-------------------------------------------------------------------------
    .recent-activity {
        .nav-header {
            margin-top: 20px;
        }

        i {
            color: #eb7223 !important;
        }

        .q-link {
            background: #C8D2D6;
            color: #444444;
        }

        .q-item {
            min-height: 30px;

            &.q-router-link--active {
                background: #E9EEEF;
            }

            .q-item__section--avatar {
                min-width: auto;
            }
        }

    }

    //-------------------------------------------------------------------------
    // Active Jobs Summary
    //-------------------------------------------------------------------------
    .active-jobs-summary {
        //background: #fbfbfb;
        //margin-top: 10px;
        .q-list {
            .nav-header {
                margin-bottom: 10px;
            }
            .q-item {
                padding: 5px 10px;
                min-height: 24px;
                .item-count {
                    padding-left: 10px;
                    color: white;
                }
            }
        }
    }

    //-------------------------------------------------------------------------
    // Atlas Version (Bottom)
    //-------------------------------------------------------------------------
    .atlas-version {
        position: fixed;
        bottom: 0;
        background: $nav;
        color: white;
        .q-toolbar__title {
            font-size: 13px;
        }
    }
}

//*************************************************************************
//*************************************************************************
// Responsive CSS Styles
//*************************************************************************
//*************************************************************************

//*************************************************************************
// Large desktop
//*************************************************************************
@media (min-width: 1200px) {


}

//*************************************************************************
// Small Desktop
//*************************************************************************
@media (min-width: 980px) {


}

//*************************************************************************
// Portrait tablet to landscape and Desktop
//*************************************************************************
@media (min-width: 768px) and (max-width: 979px) {


}

//*************************************************************************
// Tablet
//*************************************************************************
@media (max-width: 1024px) {


}

//*************************************************************************
// Landscape phone to portrait tablet
//*************************************************************************
@media (max-width: 767px) {


}

//*************************************************************************
// Landscape phones
//*************************************************************************
@media (max-width: 480px) {


}

//*************************************************************************
// Portrait phones and down
//*************************************************************************
@media (max-width: 320px) {


}