.nut-theme-dark {
  .nut-subsidenavbar {
    background-color: $dark-background2;
    &__title {
      background-color: $dark-background3;
      color: $dark-color;
      &__text {
        color: $dark-color;
      }
    }
  }
}
.nut-subsidenavbar {
  display: grid;
  float: left;
  width: 100%;
  position: relative;
  &__title {
    display: block;
    width: $sidenavbar-sub-title-width;
    height: $sidenavbar-sub-title-height;
    position: relative;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    box-sizing: border-box;
    border-bottom: 1px solid $sidenavbar-sub-title-border-color;
    color: $sidenavbar-sub-title-text-color;
    font-size: $sidenavbar-sub-title-font-size;
    background-color: $sidenavbar-sub-title-bg-color;
    border-radius: $sidenavbar-sub-title-radius;
    border: $sidenavbar-sub-title-border;
    &__text {
      line-height: $sidenavbar-sub-title-text-line-height;
      color: $sidenavbar-sub-title-text-color;
    }
    &__icon {
      position: absolute;
      top: 50%;
      right: 20px;
      transform: translateY(-50%);
      i {
        transition: transform 0.5s ease-in-out;
        &.up {
          transform: rotate(-180deg);
        }
      }
    }
  }
  &__list {
    width: 100%;
  }
}
