/*
 * Sidebar
 */

.sidebar {
  position: fixed;
  top: 44px;
  bottom: 0;
  left: 0;
  display: block;
  padding: 0;
  overflow-x: hidden;
  overflow-y: auto; /* Scrollable contents if viewport is shorter than content. */
  background-color: $nav-sidebar-background-color;
  border-right: 1px solid $navbar-rule-color;
  @media (max-width: $screen-sm-min) {
    .nav-sidebar a.accordion-toggle.collapsed span {
      display:none;
    }
    .nav-sidebar a.accordion-toggle {
      padding-right: 0;
    }
    .nav-sidebar a.accordion-toggle .fa {
      margin-right: 0;
      border-right: 0;
    }
    
    .nav-sidebar .accordion-body .active .caret {
      display: none;
    }
  }
}

.sidebar .accordion-toggle {
  border-bottom: 1px solid $navbar-rule-color;
  color: $nav-sidebar-link-color;
}

/* Sidebar navigation */
.nav-sidebar {
  margin-left: -20px;
}
.nav-sidebar > li > a {
  padding: 0 0 0 20px;
}

.nav-sidebar > .active > a,
.nav-sidebar > .active > a:hover,
.nav-sidebar > .active > a:focus {
  color:  $nav-sidebar-link-color-active;
  background: white;
  padding-left: 40px;
}

.nav-sidebar .accordion-body {
  list-style: none;
  background-color: $nav-sidebar-accordion-background-color;
  padding-bottom: 0px;
  padding-left: 0px;
}

.nav-sidebar .accordion-body li {
  margin: 0;
  padding: 11px 0 11px 38px;
  border-bottom: 1px solid $navbar-rule-color;
  &.active{
    background-color: white;
  }
}
.nav-sidebar .accordion-body li > a { 
  color: $nav-sidebar-link-color; 
  display: block; 
}
.nav-sidebar .accordion-body li:hover,
.nav-sidebar .accordion-body li:hover > a,
.nav-sidebar .accordion-body li.active,
.nav-sidebar .accordion-body li.active > a {
  color: $nav-sidebar-link-color-active;
  background-color: white;
}
.nav-sidebar .accordion-body li > a:hover,
.nav-sidebar .accordion-body li > a:focus,
.nav-sidebar .accordion-body .active > a,
.nav-sidebar .accordion-body .active > a:hover,
.nav-sidebar .accordion-body .active > a:focus {
  color: $nav-sidebar-link-color;
  background-color: white;
}
.nav-sidebar .accordion-body li > a > .caret {
  border-top: 4px solid transparent;
  border-right: 4px solid transparent;
  border-left: 4px solid;
  border-bottom: 4px solid transparent;
  padding-right: 14px;
}

.nav-sidebar i.fa {
  font-size: 24px;
  padding: 7px 14px 7px 7px;
  vertical-align: middle;
}
.nav-sidebar .accordion-toggle i.fa.fa-minus-square,
.nav-sidebar .accordion-toggle i.fa.fa-plus-square {
  font-size: 14px;
  padding: 11px 8px 11px 0;
}
.nav-sidebar .accordion-toggle.open-close-btn { text-align: right; }
.nav-sidebar .accordion-toggle i.fa.fa-chevron-down,
.nav-sidebar .accordion-toggle i.fa.fa-chevron-left {
  @extend .pull-right;
  margin: 0;
  font-size: 14px;
  padding: 12px 7px 12px 0px;
}

.nav-sidebar .accordion-toggle.collapsed i.fa.fa-chevron-left {
  display: none;
}
.nav-sidebar .accordion-toggle {
  &.collpased{
    i.fa.fa-chevron-left{ display: none; }
  }
  &[aria-expanded="true"] {
    background-color: white;
    color: $nav-sidebar-link-color-active;
    i.fa.fa-chevron-down {
      display: none;
    }
  }
}
/* notch */
.nav-sidebar ul li.active { position: relative; }