@import "globalvar.scss";

.row-offcanvas { margin: 0 0px 30px 0px;
    .btn-primary{padding: 0; font-size: 20px; line-height: 20px; font-weight: bold; outline: none !important;
        background: transparent !important;border-radius: 0; border: 0 !important;width: 100%; box-shadow: none !important; display: flex; justify-content: space-between;align-items: center;
        border: none; background: #216B8E!important; color: #fff!important;  padding: 15px 15px;
        span{color: #fff; font-size: 20px; line-height: 20px; font-weight: 500;}
    }
    .icon-bar{font-size: 20px; color: #fff;}
    &.active .icon-bar::before{content: '\f106';}
    &.active{
        .btn-primary{}
    }
}

.accordion li { font-size: 16px; padding: 5px 10px;
    list-style: none;
    .fa-minus{display: none;}
    &.active{
        a{  
             font-weight: bold;
            .fa-plus{display: none;}
            .fa-minus{display: inline-block;}
        }
    } 
    a{ color:$blackColor;    display: flex;
        justify-content: space-between;
        
    }
}

@media screen and (max-width:1199px){
   
}

@media screen and (min-width:992px) {
    .row-offcanvasTitle{padding: 10px;border: 1px solid #ddd;margin: 0; font-size:22px; font-weight: bold; }
    .pageWrap{border-top:none; }
    .accordion li {
        &:last-child{ border:none;}
    }
    
} 
@media screen and (max-width:991px) { 
    .row-offcanvas {
      .sidebar-offcanvas {display: none;}
      &.active .sidebar-offcanvas{display: block;}
    }
    .pageWrap{    max-height: 200px;overflow-x: auto;}
    .accordion { padding:3px 0; 
        li {  padding: 3px 10px;
        }
    }
}