body.ingite-dashboard .ingite-dashboard-wrapper{
    transition:all .15s;
}

@media screen and (min-width:993px){
    body.ingite-dashboard.ingite-dashboard-nav-active .ingite-dashboard-wrapper,
    body.ingite-dashboard.ingite-dashboard-nav-init-active:not(.ingite-dashboard-mode-focus) .ingite-dashboard-wrapper{
        margin-left:64px;
        width:calc(100% - 64px)
    }

    body.ingite-dashboard:not(.ingite-dashboard-nav-active):not(.ingite-dashboard-nav-init-active) .ingite-dashboard-wrapper{
        margin-left:0px;
        width:100%;
    }
}

@media screen and (max-width:992px){
    body.ingite-dashboard.ingite-dashboard-nav-active,
    body.ingite-dashboard.ingite-dashboard-nav-init-active{
        overflow:hidden;
    }

    body.ingite-dashboard:not(.ingite-dashboard-nav-active) .ingite-dashboard-nav{
        transform:translateX(-100%);
    }
}

@media screen and (min-width:1600px){
    body.ingite-dashboard.ingite-dashboard-nav-active .ingite-dashboard-wrapper,
    body.ingite-dashboard.ingite-dashboard-nav-init-active:not(.ingite-dashboard-mode-focus) .ingite-dashboard-wrapper{
        margin-left:300px;
        width:calc(100% - 300px)
    }
}

.ingite-dashboard-nav{
    position:fixed;
    height:100%;
    max-width:100%;
    background:var(--amoksys-color-primary);
    color:var(--amoksys-color-on-primary);
    left:0;
    transition:all .15s;
    display:flex;
    flex-direction:column;
    z-index:6;
}

@media screen and (min-width:993px){
    body.ingite-dashboard.ingite-dashboard-nav-init-active .ingite-dashboard-nav{
        transform:none;
    }

    body.ingite-dashboard:not(.ingite-dashboard-nav-active):not(.ingite-dashboard-nav-init-active) .ingite-dashboard-nav{
        transform:translateX(-100%);
    }

    .ingite-dashboard-nav{
        width:64px;
    }

    .ingite-dashboard-nav:hover{
        width:300px;
    }
}

@media screen and (max-width:992px){
    .ingite-dashboard-nav{
        top: 64px;
        height:calc(100% - 64px);
        width:100%;
    }
}

@media screen and (max-width:600px){
    .ingite-dashboard-nav{
        top: 56px;
        height:calc(100% - 56px)
    }
}

@media screen and (min-width:1600px){
    .ingite-dashboard-nav{
        width:300px;
    }
}


/* nav-items */
.ingite-dashboard-nav .ingite-dashboard-nav-items{
    flex:1 1 0;
}

/* dashboard nav collapsible */
.ingite-dashboard-nav > .ingite-dashboard-nav-items{
    overflow-x:hidden!important;
}

.ingite-dashboard-nav .ingite-dashboard-nav-items .collapsible + .divider{
    margin-top:.5rem;
}


.ingite-dashboard-nav-header{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    position: sticky;
    top: 0;
    height:calc(40px + 12px + 12px);
    background:var(--amoksys-color-primary);
    border-bottom: 2px solid var(--amoksys-color-primary-variant);
    z-index: 2;
}

.ingite-dashboard-nav-header .ingite-dashboard-collection-item{
    flex:1 1 0;
}

.ingite-dashboard-nav-header .ingite-dashboard-collection-item{
    min-width:40px;
    height: calc(40px + 12px + 12px);
    overflow:hidden;
    padding: 12px;
}

.ingite-dashboard-nav-header .ingite-dashboard-collection-item .ingite-dashboard-collection-item-avatar{
    margin:0;
    width:40px;
    min-width:40px;
    height:40px;
    min-height:40px;
}

.ingite-dashboard-nav-header .ingite-dashboard-collection-item .ingite-dashboard-collection-item-content{
    line-height:20px;
    transition: all .15s;
    max-width: calc(100% - 40px);
}

@media screen and (min-width:993px) and (max-width:1599px){
    .ingite-dashboard-nav:not(:hover)  .ingite-dashboard-nav-header .ingite-dashboard-collection-item ~ *{
        display:none;
    }

    .ingite-dashboard-nav:not(:hover) .ingite-dashboard-nav-items .ingite-dashboard-collection-item .ingite-dashboard-collection-item-content{
        font-size:0;
    }
}

/* nav dashboard-collection-item*/

.ingite-dashboard-nav-item,
.ingite-dashboard-nav-item.collapsible-header{
    display:block;
    border-radius:20px;
    min-width:40px;
    height:40px;
    font-size:24px;
    line-height:40px;
    background:transparent;
    color:inherit;
    cursor:pointer;
    text-align:center;
    overflow:hidden;
    width:calc(100% - 24px);
    margin:0.5rem 12px;
    transition: all .15s, margin 0s, width 0s;
}

.ingite-dashboard-nav-item:not(.active):hover{
    background:rgba(0,0,0,.1);
}

.ingite-dashboard-nav-item.active{
    background:rgba(0,0,0,.25);
}

.ingite-dashboard-nav-item i,
.ingite-dashboard-nav-item.collapsible-header i{
    display: block;
    float: left;
    width: 40px;
    height: inherit;
    line-height: inherit;
}

.ingite-dashboard-nav-item-title{
    font-size:15px;
    transition:all .15s;
    float:left;
    max-width:calc(100% - 40px);
    width:100%;
    overflow:hidden;
    text-overflow: ellipsis;
    text-align: left;
    white-space: nowrap;
    padding-right: 0;
}

.ingite-dashboard-nav-item:not(.collapsible-header) .ingite-dashboard-nav-item-title{
    padding-right:1rem;
}

.ingite-dashboard-nav-item-title i{
    font-size:15px;
}

.ingite-dashboard-nav-item-title span.badge {
    margin-left: 0.5rem;
    line-height: 22px;
    height: 22px;
    margin-top: 9px;
    float: right;
}

@media (min-width:993px) and (max-width:1599px){
    .ingite-dashboard-nav:not(:hover) .ingite-dashboard-nav-item-title,
    .ingite-dashboard-nav:not(:hover) .ingite-dashboard-nav-item-title{
        font-size:0px;
        padding:0;
    }
}

/* collapsible: nav item  */

@media (min-width:993px) and (max-width:1599px){
    .ingite-dashboard-nav:not(:hover) .collapsible-header-indicator{
        font-size:0px
    }
}
.ingite-dashboard-nav-collapsible,
.ingite-dashboard-nav-collapsible .collapsible-body{
    color:inherit!important;
}

.ingite-dashboard-nav-collapsible.collapsible,
.ingite-dashboard-nav-collapsible.collapsible:not(.popout){
    background:transparent;
    border:none;
}

.ingite-dashboard-nav-collapsible.collapsible:not(.sub-collapsible){
    border:none;
    min-width: 40px;
    width:calc(100% - 24px);
    margin:0.5rem 12px;
    transition: all .15s, margin 0s, width 0s;
}

.ingite-dashboard-nav-collapsible.collapsible:not(:only-child){
    margin-top:0.5rem;
    margin-bottom:0.5rem;
}

@media screen and (max-width:992px){
    .ingite-dashboard-nav-collapsible:not(.sub-collapsible){
        width:calc(100% - 16px);
        margin:0.5rem 8px;
    }
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item{
    background:transparent;
    color:inherit;
    margin:0;
    padding:0;
    border:none!important;
    width:100%;
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item .collapsible-header-indicator-wrapper{
    float:right;
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item .collapsible-header-indicator-wrapper i.mdi{
    margin:0;
}

.ingite-dashboard-nav-collapsible > li.active > .collapsible-header.ingite-dashboard-nav-item{
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item.active{
    background:rgba(0,0,0,.32);
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item:not(.active):hover{
    background: rgba(0,0,0,.1);
}

.ingite-dashboard-nav-collapsible > li.active > .collapsible-header.ingite-dashboard-nav-item:not(.active){
    background: rgba(0,0,0,.1);
}

.ingite-dashboard-nav-collapsible > li.active > .collapsible-header.ingite-dashboard-nav-item:not(.active):hover{
    background: rgba(0,0,0,.2);
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item .ingite-dashboard-nav-item-header{
    width: calc(100% - 40px);
    display: block;
    float: left;
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item .ingite-dashboard-nav-item-header i{
    margin:0;
}

.ingite-dashboard-nav-collapsible .collapsible-body {
    background: rgba(0, 0, 0, .1);
    padding: 0;
    min-width: 40px;
}

.ingite-dashboard-nav-collapsible > li:not(.active) > .collapsible-body{
    border-top-left-radius:20px;
    border-top-right-radius:20px;
}

.ingite-dashboard-nav-collapsible > li.active > .collapsible-body{
    display:block;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item{
    width:100%;
    margin-left:0;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item:first-child{
    margin-top:0;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item.warning:not(.active){
    margin-top:0.5rem;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item:not(.active){
    background: transparent;
}

.ingite-dashboard-nav-collapsible .collapsible-body > .ingite-dashboard-nav-item.active:first-child{
    margin-top:0;
    border-top-left-radius:0px;
    border-top-right-radius:0px;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item:not(.active):hover{
    background: rgba(0,0,0,.1);
}

.ingite-dashboard-nav .ingite-dashboard-nav-collapsible .collapsible-body{
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
    border-bottom:none;
}

/** divider */

.ingite-dashboard-nav-item.divider{
    width:100%;
    margin:.5rem 0;
    height:2px;
    border-radius:10px;
    cursor:default;
    background: rgba(0,0,0,.1) !important;
    background: var(--amoksys-color-primary-variant) !important;
    transition:all .15s;
}

.ingite-dashboard-nav-header + .ingite-dashboard-nav-item.divider{
    display:none;
}

.ingite-dashboard-nav-item.divider:first-child,
.ingite-dashboard-nav-item.divider:last-child,
.ingite-dashboard-nav-item.divider + .ingite-dashboard-nav-item.divider{
    display:none;
}

.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item.divider{
    height: 1.1px;
    background: rgba(255,255,255,.1) !important;
    background: var(--amoksys-color-on-primary) !important;
}

/** footer */

.ingite-dashboard-nav-footer{
    border-top:2px solid var(--amoksys-color-primary-variant);
    height:66px;
    display:flex;
    max-width: 100%;
    overflow: hidden;
}

@media (max-width:600px){
    .ingite-dashboard-nav-footer{
        height:58px;
    }
}

.ingite-dashboard-nav-footer > .ingite-dashboard-nav-items{
    padding:11px 12px 12px 12px;
}

@media screen and (max-width:600px){
    .ingite-dashboard-nav-footer > .ingite-dashboard-nav-items{
        padding:7px 8px 8px 8px;
    }
}

.ingite-dashboard-nav-footer .ingite-dashboard-nav-item{
    margin:0;
    flex:0;
}

.ingite-dashboard-nav-footer .ingite-dashboard-nav-item:not(:first-child){
    margin-left: .5rem;
}

.ingite-dashboard-nav-item.warning{
    background:#ff9800;
    color:white;
}

.ingite-dashboard-nav-collapsible > li > .collapsible-header.ingite-dashboard-nav-item.warning{
    background:rgba(255,152,0,.9);
    color:white;
}
.ingite-dashboard-nav-collapsible .collapsible-body .ingite-dashboard-nav-item.warning{
    background:#ff9800;
    color:white;
}