﻿.wrapper {
    display: block;
    width: 100%;
    align-items: stretch;
}

#nav{
    position: fixed;
    left: 0px;
    top: 0px;
    margin: 0px 0px 0px 0px;
    width: 100%;
    height: 48px;
    /*box-shadow: 2px 2px 1px 0px rgba(100,100,100,0.1);*/
    box-shadow: 0 1px 5px rgba(100,100,100,0.1);
    padding: 0px 30px;
    background-color: white;
    z-index: 5;
 }



 #nav #div_{
    position: absolute;
    right: 0px;
 }

 body{
    padding-top: 48px !important;
 }

 #sidebar ul li a {
    padding: 12px;
    font-size: 14px;
    display: block;
    color:  rgba(0,0,0,0.7);
}
 

 #div_menu_bots_c .div_menu_bots p{
    color: rgba(0, 0, 0, 0.7);
    font-size: 14px !important;    
 }



 #div_menu_bots_c .div_menu_bots .plan, #current_bot .plan{
    color: white !important;
    background-color: var(--primary-color) ;
    font-size: 11px !important;
    padding: 0px 4px !important;
    border-radius: 4px;
    position: absolute;
    bottom: 11px;
    left: 20px;
 }

 #current_bot .plan{
    bottom: -4px;
 }

 #sidebarCollapse{
    z-index: 1;
 }
 
 .nav_item_1{
     padding-left: 18px;
     color: rgba(0, 0, 0, 0.7);
     font-size: 14px;
 }
 
 .nav_item_1 i{
     color: rgba(0, 0, 0, 0.5);
     padding-right: 25px;
     font-size: 1.4em;
 }
 
 .nav_item_2{
     padding-left: 4.2rem !important;
     color: rgba(54, 52, 52, 0.7);
     font-size: 14px !important;
 }
 
 .nav_item_2 i{
     color: rgba(0, 0, 0, 0.5);
     padding-right: 25px;
     font-size: 1.4em;
 }

 .nav_item_3{
    padding-left: 54px !important;
    color: rgba(0, 0, 0, 0.7);
    font-size: 14px !important;
}

.nav_item_3 i{
    color: rgba(0, 0, 0, 0.5);
    padding-right: 25px;
    font-size: 1.4em;
}
 
 
 #p_nome{
     color: rgba(0, 0, 0, 0.8);
 }
 
 
 #a_sair{
     display: inline;
     padding:5px 0px 5px 25px;
 }

 #btt_logout{
    text-decoration: none !important;
 }
 
 #a_sair:hover{
     opacity: 0.7;      
 }

 #img_perfil{
     width: 32px;
     height: 32px;
     /*display:inline;*/
     border-radius: 16px;
     margin-right: 4px;
     vertical-align: middle;
     box-shadow: 0 0 1px 0px white inset, 0 0 1px 0px white;
 }

 #sidebar a, #sidebar a:hover, #sidebar a:focus{
    text-decoration: none;
    transition: all 0.3s;
}
 
 #p_nav_info{
     text-align: center;
 }
 
 
 .navbar {
     padding: 15px 10px;
     background: #fff;
     border: none;
     border-radius: 0;
     margin-bottom: 40px;
     box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
 }

 
 .line {
     width: 100%;
     height: 1px;
     border-bottom: 1px dashed #ddd;
     margin: 40px 0;
 }
 
 /* ---------------------------------------------------
     SIDEBAR STYLE
 ----------------------------------------------------- */
 #sidebar {
     max-width: 250px;
     width: calc(100% - 30px);
     position: fixed;
     top: 0;
     left: -250px;
     min-height: 100vh;
     z-index: 9999;
     color: #fff;
     transition: all 0.3s;
     overflow-y: scroll;
     overflow-x: hidden !important;
 }
 
 #sidebar.active {
     left: 0;
 }

 .div_menu_bots *{     
    display: inline;
    vertical-align: middle;
}

/*.div_menu_bots p{
    margin-left: 10px;    
}*/

.div_menu_bots{   
    user-select: none;  
    cursor: pointer;
    display: block;
    width: 250px;
    padding: 8px 6px 8px 25px;  
    position: relative; 
}
 
 #dismiss {
     width: 35px;
     height: 35px;
     line-height: 35px;
     text-align: center;
     background: #7386D5;
     position: absolute;
     top: 10px;
     right: 10px;
     cursor: pointer;
     -webkit-transition: all 0.3s;
     -o-transition: all 0.3s;
     transition: all 0.3s;
 }
 #dismiss:hover {
     background: #fff;
     color: #7386D5;
 }
 
 .overlay {
     top: 0px;
     left: 0px;
     position: fixed;
     width: 100vw;
     height: 100vh;
     background: rgba(0, 0, 0, 0.7);
     z-index: 988;  
     display: none;
 }

.overlay.active {
    display: block;
}
 
 #sidebar .sidebar-header {
     padding: 20px;
     background: #6d7fcc;
 }
 
 #sidebar ul.components {
     padding: 0px 0px;
 }
 
 #sidebar ul p {
     color: #000;
     padding: 10px;
 }
 

 
 
 .nav_item_1:hover i, .nav_item_1:hover, .nav_item_2:hover i, .nav_item_2:hover, .nav_item_3:hover i, .nav_item_3:hover, .div_menu_bots:hover p{
    color: var(--primary-color)  !important;
 }
 
 #sidebar ul li.active > a, a[aria-expanded="true"], .div_menu_bots[aria-expanded="true"]:hover {
     color: #fff;
     background: #fff;
 }


 
 
 a[data-toggle="collapse"] {
     position: relative;
 }

 
.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
    color: #999;
}
 
/*a[aria-expanded="false"]::before, a[aria-expanded="true"]::before {
     content: '\e259';
     display: block;
     position: absolute;
     right: 20px;
     font-family: 'Glyphicons Halflings';
     font-size: 0.6em;
 }
 a[aria-expanded="true"]::before {
     content: '\e260';
 }*/
 

 
 ul ul a {
     font-size: 0.9em !important;
     padding-left: 30px !important;
     background: #fff;
 }
 
 #current_bot{
    background-color: rgba(0, 0, 0, 0.1);
    background-color: white
 }

#current_bot[aria-expanded="true"]{
    background-color: white;
}

.div_menu_bots img{
    width: 40px;
    height: 40px;
    border-radius: 20px;    
}



#current_bot{
    user-select: text !important;
}



#current_bot span{
    font-size: 0.8em;
    color: #aaa !important;
    user-select: text !important;
    cursor: text;
}


@media only screen and (max-width: 355px) {
    #img_perfil{
        display: none;
    }
}

 
@media only screen and (max-width: 300px) {
    #p_nome{
        display: none;
    }
}
