@import '~antd/es/menu/style/index.less';
@import '../variable.less';

@menu-prefix-cls: ~'@{ant-prefix}-menu';

.@{menu-prefix-cls} {
  &-item-with-icon,
  &-submenu-inline {
    > div {
      display: flex;
      align-items: center;

      > .@{iconfont-css-prefix} {
        margin-right: @menu-item-icon-margin-right;
      }
    }
  }

  &-inline-collapsed {
    > .@{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 {
      padding: @menu-item-padding !important;
    }

    .@{iconfont-css-prefix} {
      display: flex;
      align-items: center;
      justify-content: center;
      transition: @menu-icon-transition;
    }
  }

  &-vertical,
  &-vertical-left,
  &-vertical-right,
  &-inline {
    .@{menu-prefix-cls}-item,
    .@{menu-prefix-cls}-submenu-title {
      padding: @menu-item-padding;
    }
  }

  &-dark &-item:hover,
  &-dark &-item-active,
  &-dark &-submenu-active,
  &-dark &-submenu-open,
  &-dark &-submenu-selected,
  &-dark &-submenu-title:hover,
  &-dark&-dark:not(&-horizontal) &-item-selected:hover {
    background-color: @menu-dark-item-hover-bg;
    color: @menu-dark-item-hover-text-color;
  }

  &-dark&-dark:not(&-horizontal) &-submenu-inline {
    .@{menu-prefix-cls}-item:hover,
    .@{menu-prefix-cls}-item-active:hover,
    .@{menu-prefix-cls}-item-selected:hover {
      background-color: transparent;
    }
    .@{menu-prefix-cls}-item-selected {
      color: @menu-dark-selected-item-icon-color;
    }
    > ul {
      list-style-type: 'disc';
    }
  }
}