.item-base() {
  @style: {
    position: relative;
    border-radius: @menu-border-radius;
    box-sizing: border-box;
    cursor: pointer;

    &.@{menu-prefix-cls}-disabled {
      cursor: not-allowed;
    }

    &.@{menu-prefix-cls}-selected {
      font-weight: @menu-font-weight-item-selected;
      .text-color-transition();

      svg {
        .text-color-transition();
      }
    }

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

  .applyStyleToItem(@style);
}

.item-mode(@mode) {
  @style-both: {
    padding: 0 ~'@{menu-@{mode}-item-padding-horizontal}';
    line-height: ~'@{menu-@{mode}-item-height}';

    .@{menu-prefix-cls}-icon-suffix .@{prefix}-icon {
      margin-right: 0;
    }
  };

  @style-vertical-only: {
    margin-bottom: @menu-item-gap;
    .text-ellipsis();

    .@{menu-prefix-cls}-item-inner {
      .text-ellipsis();

      width: 100%;
    }

    .@{menu-prefix-cls}-icon-suffix {
      position: absolute;
      right: @menu-vertical-item-padding-horizontal;
      top: 50%;
      transform: translateY(-50%);

      &.is-open {
        transform: translateY(-50%) rotate(180deg);
      }
    }
  };

  @style-horizontal-only: {
    .@{prefix}-icon {
      margin-right: @menu-horizontal-margin-right-item-prefix-icon;
    }

    .@{menu-prefix-cls}-icon-suffix {
      margin-left: @menu-margin-left-item-suffix-icon;
    }
  };

  .applyStyleToItem(@style-both);
  .applyStyleToItem(if(@mode = vertical, @style-vertical-only, @style-horizontal-only));
}

.theme(@theme) {
  &-@{theme} {
    background-color: ~'@{menu-@{theme}-color-bg}';

    // 处理普通菜单项的状态变化
    @item-style: {
      background-color: ~'@{menu-@{theme}-color-bg-item_default}';
      color: ~'@{menu-@{theme}-color-item_default}';

      .@{prefix}-icon {
        color: ~'@{menu-@{theme}-color-icon_default}';
      }

      &:hover {
        background-color: ~'@{menu-@{theme}-color-bg-item_hover}';
        color: ~'@{menu-@{theme}-color-item_hover}';

        .@{prefix}-icon {
          color: ~'@{menu-@{theme}-color-icon_hover}';
        }
      }

      &:focus-visible {
        .menu-focus-visible-style();
      }

      &.@{menu-prefix-cls}-selected {
        color: ~'@{menu-@{theme}-color-item_selected}';

        .@{prefix}-icon {
          color: ~'@{menu-@{theme}-color-icon_selected}';
        }
      }

      &.@{menu-prefix-cls}-disabled {
        background-color: ~'@{menu-@{theme}-color-bg-item_disabled}';
        color: ~'@{menu-@{theme}-color-item_disabled}';

        .@{prefix}-icon {
          color: ~'@{menu-@{theme}-color-icon_disabled}';
        }
      }
    };

    .applyStyleToItem(@item-style);

    // 只有 menuItem 选中时需要背景色
    .@{menu-prefix-cls}-item.@{menu-prefix-cls}-selected {
      background-color: ~'@{menu-@{theme}-color-bg-item_selected}';
    }

    //  子菜单被选中时，没有背景色，所以可以单独设置字体色
    .@{menu-prefix-cls}-inline-header.@{menu-prefix-cls}-selected {
      color: ~'@{menu-@{theme}-color-submenu_selected}';

      .@{prefix}-icon {
        color: ~'@{menu-@{theme}-color-submenu_selected}';
      }

      &:hover {
        background-color: ~'@{menu-@{theme}-color-bg-submenu_selected_hover}';
      }
    }

    // 为水平菜单添加项目选中的样式
    &.@{menu-prefix-cls}-horizontal {
      @item-selected-style: {
        &.@{menu-prefix-cls}-selected {
          background: none;
          .text-color-transition();

          &:hover {
            background-color: ~'@{menu-@{theme}-color-bg-item_hover}';
          }
        }
      };

      .applyStyleToItem(@item-selected-style);
    }

    // 处理标题样式
    .@{menu-prefix-cls}-group-title {
      color: ~'@{menu-@{theme}-color-group-title}';
      // 快速消除 hover 的特殊样式
      pointer-events: none;
    }

    // 展开折叠按钮颜色
    .@{menu-prefix-cls}-collapse-button {
      background-color: ~'@{menu-@{theme}-color-bg-button}';
      color: ~'@{menu-@{theme}-color-button}';

      &:hover {
        background-color: ~'@{menu-@{theme}-color-bg-button_hover}';
      }

      &:focus-visible {
        box-shadow: 0 0 0 2px var(--primary-6);
      }
    }
  }
}
