////////导航////////
// 导航条
.d-nav-bar {
  margin: 0;
  padding: 0;
  background-color: @sys-color-shadow;
  border: 1px solid #e7e7e7;
  .nav-bar-group {
    margin: 0;
    padding: 0;
    list-style: none;
    text-align: left;
    font-size: 0;
  }
  .nav-bar-item {
    position: relative;
    display: inline-block;
    text-align: center;
    font-size: @sys-font-size-sm;
    vertical-align: top;
    transition-duration: @sys-duration-sm;
    &:hover,&.active {
      background: darken(@sys-color-shadow, 10%);
    }
    &:hover {
      & > .d-list-cascade {
        display: block;
      }
      // & > .bar-item-link {
      //   .d-arrow-icon {
      //     &:before, &:after {
      //       background: #fff;
      //     }
      //   }
      // }
      .d-arrow-down {
        transform: rotate(-180deg);
      }
    }
    & > .d-list-cascade {
      display: none;
      position: absolute;
      margin: 0;
      border-radius: 2px;
      box-shadow: 0 2px 12px 0 rgba(0,0,0,.1);
      background: @sys-color-snow;
    }
  }
  .bar-item-link {
    display: flex;
    align-items: center;
    padding: 0 @sys-layout-lg;
    line-height: @sys-height-nav;
    color: @sys-color-deepgray;
    .d-arrow-icon {
      margin-left: @sys-layout-sm;
    }
  }
}

// 面包屑导航
.d-nav-breadcrumb {
  overflow: hidden;
  color: @sys-color-lightgray;
  line-height: @sys-line-height;
  .nav-breadcrumb-item:last-child {
    .item-separator {
      display: none;
    }
  }
  .item-link,.item-separator,.item-text {
    font-style: normal;
  }
  .item-separator {
    margin: 0 @sys-layout-sm;
  }
  .item-link {
    color: @sys-color-gray;
    &:hover {
      color: @color-theme;
    }
  }
  .item-text,.item-separator {
    color: @sys-color-lightgray;
  }
}

////主题////
.d-nav-bar-black {
  background-color: @sys-color-blackgray;
  border: none;
  .nav-bar-item {
    &:hover,&.active {
      background: @color-theme;
      & > .bar-item-link {
        .d-arrow-icon {
          &:before, &:after {
            background: #fff;
          }
        }
      }
      .bar-item-link {
        color: @sys-color-snow;
      }
    }
    // 级联菜单列表
    & >.d-list-cascade {
      box-shadow: 0 2px 12px 0 rgba(255,255,255,.1);
    }
  }
  .bar-item-link {
    color: @sys-color-snow;
  }
}