/*!
 * Licensed to the Apache Software Foundation (ASF) under one or more
 * contributor license agreements. See the NOTICE file distributed with
 * this work for additional information regarding copyright ownership.
 * The ASF licenses this file to You under the Apache License, Version 2.0
 * (the "License"); you may not use this file except in compliance with
 * the License. You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

/*
 * Component: Sidebar
 * ------------------
 */
//Main Sidebar
.main-sidebar{
  position: absolute;
  top: @navbar-height;
  left: 0;
  min-height: 100%;
  width: @sidebar-width;
  z-index: 810;
  box-shadow: 5px 0 5px -5px #333;
  //Using disposable variable to join statements with a comma
  @transition-rule: @transition-speed @transition-fn,
    width @transition-speed @transition-fn;
  .transition-transform(@transition-rule);
  @media (max-width: @screen-xs-max) {
    .translate(-@sidebar-width, 0);
  }
  .sidebar-collapse & {
    @media (min-width: @screen-sm) {
      .translate(-@sidebar-width, 0);
    }
  }
  .sidebar-open & {
    @media (max-width: @screen-xs-max) {
      .translate(0, 0);
    }
  }
}

.sidebar {
  padding-bottom: 10px;
}

// Sidebar menu
.sidebar-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  //First Level
  > li {
    position: relative;
    margin: 0;
    padding: 0;
    > a {
      padding: 12px 5px 12px 15px;
      display: block;
      > .fa {
        width: 20px;
      }
    }
    .label,
    .badge {
      margin-top: 3px;
      margin-right: 5px;
    }
  }
  li.header {
    padding: 10px 25px 10px 15px;
    font-size: 12px;
  }
  li > a > .fa-angle-left {
    width: auto;
    height: auto;
    padding: 0;
    margin-right: 10px;
    margin-top: 3px;
  }
  li.active {
    > a > .fa-angle-left {
      .rotate(-90deg);
    }
    > .treeview-menu {
      display: block;
    }
  }

  // Tree view menu
  .treeview-menu {
    display: none;
    list-style: none;
    padding:0;
    margin:0;
    padding-left: 5px;
    .treeview-menu {
      padding-left: 20px;
    }
    > li {
      margin: 0;
      > a {
        padding: 5px 5px 5px 15px;
        display: block;
        font-size: 14px;
        > .fa {
          width: 20px;
        }
        > .fa-angle-left,
        > .fa-angle-down {
          width: auto;
        }
      }
    }
  }
}