@w-menu:~ "w-menu";

.@{w-menu} {
  margin: 0 !important;
  padding: 5px;
  box-sizing: border-box;
  border-radius: 3px;
  min-width: 100%;
  width: 100%;
  text-align: left;
  font-size: 14px;
  transition: width 0.2s, min-width 0.2s, max-width 0.2s, height 0.2s, min-height 0.2s, max-height 0.2s;
  &&-dark,
  &&-light {
    padding-left: 5px;
  }
  &:not(&-dark) {
    color: #182026;
    background: #fff;
  }
  li {
    margin: 0 !important;
    list-style: none !important;
    position: relative;
    &:first-of-type {
      border-top: none;
    }
    a:not([href]) {
      color: inherit;
    }
  }
  &.w-bordered {
    box-shadow: 0 0 0 1px rgba(16, 22, 26, 0.1), 0 0 0 rgba(16, 22, 26, 0), 0 1px 1px rgba(16, 22, 26, 0.2);
  }
  .@{w-menu}-divider {
    display: block;
    margin: 5px !important;
    border-top: 1px solid rgba(16, 22, 26, 0.15);
    > strong {
      display: block;
      line-height: 17px;
    }
  }
  .@{w-menu}-divider:not(:first-of-type) {
    > strong {
      margin-top: 10px;
    }
  }
}

.@{w-menu} {
  &&-light&-inline-collapsed > li > .@{w-menu}-item:hover {
    color: #008ef0;
  }
  &-inline-collapsed {
    width: 80px;
    min-width: 80px;
    > li > .@{w-menu}-item {
      justify-content: center;
      padding-top: 10px;
      padding-bottom: 10px;
      font-size: 18px;
      &:hover {
        background-color: transparent;
        color: #fff;
      }
      > * {
        margin-right: 0;
      }
    }
    > li > .@{w-menu}-item .@{w-menu}-item-text {
      width: 0;
      flex-grow: 0;
    }
    > li > .@{w-menu}-item .@{w-menu}-subitem-collapse-icon {
      display: none;
    }
  }
}
.@{w-menu} {
  &-dark,
  &-dark.w-bordered,
  &-dark & {
    background: #343a40;
    color: rgba(255, 255, 255, 0.65);
  }
  &-dark.w-bordered {
    box-shadow: initial;
  }
  &-dark .active {
    color: #fff !important;
  }
  &-dark &-item.w-disabled,
  &-dark &-item.w-disabled &-item-icon {
    color: rgba(142, 142, 142, 0.79) !important;
  }
  &-dark &-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.2);
  }
}
