////@import '~ant-design-vue/lib/style/themes/default';
////@import '~ant-design-vue/lib/style/mixins/index';
//
//@menu-prefix-cls: ~'@{ant-prefix}-menu';
//@menu-item-active-border-width: 3px;
//@menu-item-height: 40px;
//@menu-horizontal-height: 64px;
//@menu-inline-toplevel-item-height: 40px;
//@menu-collapsed-width: 80px;
//@iconfont-css-prefix : anticon;
//@text-color-dark : fade(#fff, 85%);
//@disabled-color : fade(#000, 25%);
//
//// default theme
//body {
//  .@{menu-prefix-cls} {
//    .reset-component;
//    outline: none;
//    margin-bottom: 0;
//    padding-left: 0; // Override default ul/ol
//    list-style: none;
//    //box-shadow: @box-shadow-base;
//    color: @text-color;
//    background: @background-color-base;
//    line-height: 0; // Fix display inline-block gap
//    transition: background 0.3s, width 0.2s;
//    .clearfix;
//
//    ul,
//    ol {
//      list-style: none;
//      margin: 0;
//      padding: 0;
//    }
//
//    &-hidden {
//      display: none;
//    }
//
//    &-item-group-title {
//      color: fade(#000, 45%);;
//      font-size: 14px;
//      line-height: 48px;
//      padding: 8px 16px;
//      transition: all 0.3s;
//    }
//
//    &-submenu,
//    &-submenu-inline {
//      transition: border-color 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1),
//      padding 0.15s cubic-bezier(0.645, 0.045, 0.355, 1);
//    }
//
//    &-item:active,
//    &-submenu-title:active {
//      background: @primary-color;
//    }
//
//    &-submenu &-sub {
//      cursor: initial;
//      transition: background 0.3s cubic-bezier(0.645, 0.045, 0.355, 1), padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
//    }
//
//    &-item > a {
//      display: block;
//      color: @text-color;
//      &:hover {
//        color: @primary-color;
//      }
//      &:focus {
//        text-decoration: none;
//      }
//      &:before {
//        position: absolute;
//        background-color: transparent;
//        top: 0;
//        left: 0;
//        bottom: 0;
//        right: 0;
//        content: '';
//      }
//    }
//
//    &-item-divider {
//      height: 1px;
//      overflow: hidden;
//      background-color: @border-color-split;
//      line-height: 0;
//    }
//
//    &-item:hover,
//    &-item-active,
//    &:not(&-inline) &-submenu-open,
//    &-submenu-active,
//    &-submenu-title:hover {
//      color: @primary-color;
//    }
//
//    &-horizontal &-item,
//    &-horizontal &-submenu {
//      margin-top: -1px;
//    }
//
//    &-horizontal > &-item:hover,
//    &-horizontal > &-item-active,
//    &-horizontal > &-submenu &-submenu-title:hover {
//      background-color: transparent;
//    }
//
//    &-item-selected {
//      color: @primary-color;
//      > a,
//      > a:hover {
//        color: @primary-color;
//      }
//    }
//
//    &:not(&-horizontal) &-item-selected {
//      background-color: @primary-color;
//    }
//
//    &-inline,
//    &-vertical,
//    &-vertical-left {
//      border-right: 1px solid @border-color-split;
//    }
//    &-vertical-right {
//      border-left: 1px solid @border-color-split;
//    }
//
//    &-vertical&-sub,
//    &-vertical-left&-sub,
//    &-vertical-right&-sub {
//      border-right: 0;
//      padding: 0;
//      transform-origin: 0 0;
//      .@{menu-prefix-cls}-item {
//        border-right: 0;
//        margin-left: 0;
//        left: 0;
//        &:after {
//          border-right: 0;
//        }
//      }
//      > .@{menu-prefix-cls}-item,
//      > .@{menu-prefix-cls}-submenu {
//        transform-origin: 0 0;
//      }
//    }
//
//    &-horizontal&-sub,
//    &-vertical&-sub,
//    &-vertical-left&-sub,
//    &-vertical-right&-sub {
//      min-width: 160px;
//    }
//
//    &-item,
//    &-submenu-title {
//      cursor: pointer;
//      margin: 0;
//      padding: 0 20px;
//      position: relative;
//      display: block;
//      white-space: nowrap;
//      transition: color 0.3s @ease-in-out, border-color 0.3s @ease-in-out,
//      background 0.3s @ease-in-out, padding 0.15s @ease-in-out;
//      .@{iconfont-css-prefix} {
//        min-width: 14px;
//        margin-right: 10px;
//        font-size: @font-size-base;
//        transition: font-size 0.15s @ease-out, margin 0.3s @ease-in-out;
//        + span {
//          transition: opacity 0.3s @ease-in-out, width 0.3s @ease-in-out;
//          opacity: 1;
//        }
//      }
//    }
//
//    & > &-item-divider {
//      height: 1px;
//      margin: 1px 0;
//      overflow: hidden;
//      padding: 0;
//      line-height: 0;
//      background-color: @border-color-split;
//    }
//
//    &-submenu {
//      &-popup {
//        position: absolute;
//        border-radius: @border-radius-base;
//        z-index: @zindex-dropdown;
//        background: @menu-popup-bg;
//
//        .submenu-title-wrapper {
//          padding-right: 20px;
//        }
//
//        &:before {
//          position: absolute;
//          top: -7px;
//          left: 0;
//          right: 0;
//          bottom: 0;
//          content: ' ';
//          opacity: 0.0001;
//        }
//      }
//
//      > .@{menu-prefix-cls} {
//        background-color: @component-background;
//        border-radius: @border-radius-base;
//        &-submenu-title:after {
//          transition: transform 0.3s @ease-in-out;
//        }
//      }
//
//      &-vertical,
//      &-vertical-left,
//      &-vertical-right,
//      &-inline {
//        > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow {
//          transition: transform 0.3s @ease-in-out;
//          position: absolute;
//          top: 50%;
//          right: 16px;
//          width: 10px;
//          &:before,
//          &:after {
//            content: '';
//            position: absolute;
//            vertical-align: baseline;
//            background: #fff;
//            background-image: linear-gradient(to right, @text-color, @text-color);
//            width: 6px;
//            height: 1.5px;
//            border-radius: 2px;
//            transition: background 0.3s @ease-in-out, transform 0.3s @ease-in-out,
//            top 0.3s @ease-in-out;
//          }
//          &:before {
//            transform: rotate(45deg) translateY(-2px);
//          }
//          &:after {
//            transform: rotate(-45deg) translateY(2px);
//          }
//        }
//        > .@{menu-prefix-cls}-submenu-title:hover .@{menu-prefix-cls}-submenu-arrow {
//          &:after,
//          &:before {
//            background: linear-gradient(to right, @primary-color, @primary-color);
//          }
//        }
//      }
//
//      &-inline > .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow {
//        &:before {
//          transform: rotate(-45deg) translateX(2px);
//        }
//        &:after {
//          transform: rotate(45deg) translateX(-2px);
//        }
//      }
//
//      &-open {
//        &.@{menu-prefix-cls}-submenu-inline
//        > .@{menu-prefix-cls}-submenu-title
//        .@{menu-prefix-cls}-submenu-arrow {
//          transform: translateY(-2px);
//          &:after {
//            transform: rotate(-45deg) translateX(-2px);
//          }
//          &:before {
//            transform: rotate(45deg) translateX(2px);
//          }
//        }
//      }
//    }
//
//    &-vertical &-submenu-selected,
//    &-vertical-left &-submenu-selected,
//    &-vertical-right &-submenu-selected {
//      color: @primary-color;
//      > a {
//        color: @primary-color;
//      }
//    }
//
//    &-horizontal {
//      border: 0;
//      border-bottom: 1px solid @border-color-split;
//      box-shadow: none;
//      height: @menu-horizontal-height;
//      line-height: @menu-horizontal-height;
//      white-space: nowrap;
//
//      > .@{menu-prefix-cls}-item,
//      > .@{menu-prefix-cls}-submenu {
//        position: relative;
//        height: @menu-horizontal-height;
//        line-height: @menu-horizontal-height;
//        top: 1px;
//        display: inline-block;
//        vertical-align: bottom;
//        border-bottom: 2px solid transparent;
//
//        &:hover,
//        &-active,
//        &-open,
//        &-selected {
//          border-bottom: 2px solid @primary-color;
//          color: @primary-color;
//        }
//      }
//
//      > .@{menu-prefix-cls}-item {
//        > a {
//          display: block;
//          color: @text-color;
//          &:hover {
//            color: @primary-color;
//          }
//          &:before {
//            bottom: -2px;
//          }
//        }
//        &-selected > a {
//          color: @primary-color;
//        }
//      }
//
//      &:after {
//        content: '\20';
//        display: block;
//        height: 0;
//        clear: both;
//      }
//    }
//
//    &-vertical,
//    &-vertical-left,
//    &-vertical-right,
//    &-inline {
//      .@{menu-prefix-cls}-item {
//        position: relative;
//        &:after {
//          content: '';
//          position: absolute;
//          right: 0;
//          top: 0;
//          bottom: 0;
//          border-right: @menu-item-active-border-width solid @primary-color;
//          transform: scaleY(0.0001);
//          opacity: 0;
//          transition: transform 0.15s @ease-out, opacity 0.15s @ease-out;
//        }
//      }
//
//      .@{menu-prefix-cls}-item,
//      .@{menu-prefix-cls}-submenu-title {
//        padding: 0 16px;
//        font-size: @font-size-base;
//        line-height: @menu-item-height;
//        height: @menu-item-height;
//        margin-top: 4px;
//        margin-bottom: 4px;
//        overflow: hidden;
//        text-overflow: ellipsis;
//      }
//
//      // disable margin collapsed
//      .@{menu-prefix-cls}-submenu {
//        padding-bottom: 0.01px;
//      }
//
//      .@{menu-prefix-cls}-item:not(:last-child) {
//        margin-bottom: 8px;
//      }
//
//      > .@{menu-prefix-cls}-item,
//      > .@{menu-prefix-cls}-submenu > .@{menu-prefix-cls}-submenu-title {
//        line-height: @menu-inline-toplevel-item-height;
//        height: @menu-inline-toplevel-item-height;
//      }
//    }
//
//    &-inline {
//      width: 100%;
//      .@{menu-prefix-cls}-selected,
//      .@{menu-prefix-cls}-item-selected {
//        &:after {
//          transition: transform 0.15s @ease-in-out, opacity 0.15s @ease-in-out;
//          opacity: 1;
//          transform: scaleY(1);
//        }
//      }
//
//      .@{menu-prefix-cls}-item,
//      .@{menu-prefix-cls}-submenu-title {
//        width: ~'calc(100% + 1px)';
//      }
//
//      .@{menu-prefix-cls}-submenu-title {
//        padding-right: 34px;
//      }
//    }
//
//    &-inline-collapsed {
//      width: @menu-collapsed-width;
//      > .@{menu-prefix-cls}-item,
//      > .@{menu-prefix-cls}-item-group
//      > .@{menu-prefix-cls}-item-group-list
//      > .@{menu-prefix-cls}-item,
//      > .@{menu-prefix-cls}-item-group
//      > .@{menu-prefix-cls}-item-group-list
//      > .@{menu-prefix-cls}-submenu
//      > .@{menu-prefix-cls}-submenu-title,
//      > .@{menu-prefix-cls}-submenu > .@{menu-prefix-cls}-submenu-title {
//        left: 0;
//        text-overflow: clip;
//        padding: 0 (@menu-collapsed-width - 16px) / 2 !important;
//        .@{menu-prefix-cls}-submenu-arrow {
//          display: none;
//        }
//        .@{iconfont-css-prefix} {
//          font-size: 16px;
//          line-height: @menu-item-height;
//          margin: 0;
//          + span {
//            max-width: 0;
//            display: inline-block;
//            opacity: 0;
//          }
//        }
//      }
//      &-tooltip {
//        pointer-events: none;
//        .@{iconfont-css-prefix} {
//          display: none;
//        }
//        a {
//          color: @text-color-dark;
//        }
//      }
//
//      .@{menu-prefix-cls}-item-group-title {
//        overflow: hidden;
//        white-space: nowrap;
//        text-overflow: ellipsis;
//        padding-left: 4px;
//        padding-right: 4px;
//      }
//    }
//
//    &-item-group-list {
//      margin: 0;
//      padding: 0;
//      .@{menu-prefix-cls}-item,
//      .@{menu-prefix-cls}-submenu-title {
//        padding: 0 16px 0 28px;
//      }
//    }
//
//    &-root&-vertical,
//    &-root&-vertical-left,
//    &-root&-vertical-right,
//    &-root&-inline {
//      box-shadow: none;
//    }
//
//    &-sub&-inline {
//      padding: 0;
//      border: 0;
//      box-shadow: none;
//      border-radius: 0;
//      & > .@{menu-prefix-cls}-item,
//      & > .@{menu-prefix-cls}-submenu > .@{menu-prefix-cls}-submenu-title {
//        line-height: @menu-item-height;
//        height: @menu-item-height;
//        list-style-type: disc;
//        list-style-position: inside;
//      }
//
//      & .@{menu-prefix-cls}-item-group-title {
//        padding-left: 32px;
//      }
//    }
//
//    // Disabled state sets text to gray and nukes hover/tab effects
//    &-item-disabled,
//    &-submenu-disabled {
//      color: @disabled-color !important;
//      cursor: not-allowed;
//      background: none;
//      border-color: transparent !important;
//      > a {
//        color: @disabled-color !important;
//        pointer-events: none;
//      }
//      > .@{menu-prefix-cls}-submenu-title {
//        color: @disabled-color !important;
//        cursor: not-allowed;
//        > .@{menu-prefix-cls}-submenu-arrow {
//          &:before,
//          &:after {
//            background: @disabled-color !important;
//          }
//        }
//      }
//    }
//  }
//}
//
//@disabled-color-dark : fade(#fff, 35%);
//@menu-dark-color: white;
//@menu-dark-bg: @title-color;
//body {
//  .@{menu-prefix-cls} {
//    // dark theme
//    &-dark,
//    &-dark &-sub {
//      color: @menu-dark-color;
//      background: @menu-dark-bg;
//      .@{menu-prefix-cls}-submenu-title .@{menu-prefix-cls}-submenu-arrow {
//        opacity: 0.45;
//        transition: all 0.3s;
//        &:after,
//        &:before {
//          background: @menu-dark-arrow-color;
//        }
//      }
//    }
//
//    &-dark&-submenu-popup {
//      background: transparent;
//    }
//
//    &-dark &-inline&-sub {
//      background: @menu-dark-color;
//      box-shadow: 0 2px 8px rgba(0, 0, 0, 0.45) inset;
//    }
//
//    &-dark&-horizontal {
//      border-bottom: 0;
//    }
//
//    &-dark&-horizontal > &-item,
//    &-dark&-horizontal > &-submenu {
//      border-color: @menu-dark-bg;
//      border-bottom: 0;
//      top: 0;
//      margin-top: 0;
//    }
//
//    &-dark&-horizontal > &-item > a:before {
//      bottom: 0;
//    }
//
//    &-dark &-item,
//    &-dark &-item-group-title,
//    &-dark &-item > a {
//      color: @menu-dark-color;
//    }
//
//    &-dark&-inline,
//    &-dark&-vertical,
//    &-dark&-vertical-left,
//    &-dark&-vertical-right {
//      border-right: 0;
//    }
//
//    &-dark&-inline &-item,
//    &-dark&-vertical &-item,
//    &-dark&-vertical-left &-item,
//    &-dark&-vertical-right &-item {
//      border-right: 0;
//      margin-left: 0;
//      left: 0;
//      &:after {
//        border-right: 0;
//      }
//    }
//
//    &-dark&-inline &-item,
//    &-dark&-inline &-submenu-title {
//      width: 100%;
//    }
//
//    &-dark &-item:hover,
//    &-dark &-item-active,
//    &-dark &-submenu-active,
//    &-dark &-submenu-open,
//    &-dark &-submenu-selected,
//    &-dark &-submenu-title:hover {
//      background-color: transparent;
//      color: @menu-dark-color;
//      > a {
//        color: @menu-dark-color;
//      }
//      > .@{menu-prefix-cls}-submenu-title,
//      > .@{menu-prefix-cls}-submenu-title:hover {
//        > .@{menu-prefix-cls}-submenu-arrow {
//          //opacity: 1;
//          &:after,
//          &:before {
//            background: @menu-dark-bg;
//          }
//        }
//      }
//    }
//
//    &-dark &-item-selected {
//      border-right: 0;
//      color: @menu-dark-color;
//      &:after {
//        border-right: 0;
//      }
//      > a,
//      > a:hover {
//        color: @menu-dark-color;
//      }
//    }
//
//    &&-dark &-item-selected,
//    &-submenu-popup&-dark &-item-selected {
//      background-color: @menu-dark-bg;
//    }
//
//    // Disabled state sets text to dark gray and nukes hover/tab effects
//    &-dark &-item-disabled,
//    &-dark &-submenu-disabled {
//      &,
//      > a {
//        opacity: 0.8;
//        color: @disabled-color-dark !important;
//      }
//      > .@{menu-prefix-cls}-submenu-title {
//        color: @disabled-color-dark !important;
//        > .@{menu-prefix-cls}-submenu-arrow {
//          &:before,
//          &:after {
//            background: @disabled-color-dark !important;
//          }
//        }
//      }
//    }
//  }
//
//}
