@import '../../styles/themes/index.less';
@import '../../styles/mixins/index.less';

@menu-font-size: @font-size-base + 2;
@menu-line-height: @line-height-base;
@menu-border-radius: @border-radius;
@menu-font-weight-item-selected: @font-weight-400;
@menu-color-label-item-selected: var(--primary);
@menu-height-label-item-selected: 3px;
@menu-margin-left-item-suffix-icon: @spacing-3;
@menu-margin-right-item-prefix-icon: @spacing-7;
@menu-horizontal-margin-right-item-prefix-icon: @spacing-4;

// vertical 模式下 item 之间的间隙
@menu-item-gap: @spacing-2;
// vertical 下嵌套子菜单的层级缩进
@menu-item-indent-spacing: @spacing-8;

// 折叠按钮
@menu-width-collapse-button: @size-6;
@menu-height-collapse-button: @size-6;
@menu-border-radius-collapse-button: @border-radius;

/**********************************************
 * theme: light / dark
 * status: default / disabled / selected / hover
 **********************************************/
@menu-light-color-bg: var(--color-bg-2);
@menu-light-color-bg-item_default: var(--color-bg-2);
@menu-light-color-bg-item_hover: var(--color-fill-2);
@menu-light-color-bg-item_selected: var(--color-fill-2);
@menu-light-color-bg-item_disabled: var(--color-bg-2);
@menu-light-color-item_default: var(--color-text-2);
@menu-light-color-item_hover: var(--color-text-2);
@menu-light-color-item_selected: var(--primary);
@menu-light-color-submenu_selected: var(--primary);
@menu-light-color-bg-submenu_selected_hover: var(--color-fill-2);
@menu-light-color-item_disabled: var(--color-text-4);
@menu-light-color-icon_default: var(--color-text-3);
@menu-light-color-icon_hover: var(--color-text-3);
@menu-light-color-icon_selected: var(--primary);
@menu-light-color-icon_disabled: var(--color-text-4);
@menu-light-color-group-title: var(--color-text-3);

@color-menu-dark-hover: fade(#fff, 8%);
@menu-dark-color-bg: @dark-color-bg-1;
@menu-dark-color-bg-item_default: @menu-dark-color-bg;
@menu-dark-color-bg-item_hover: @color-menu-dark-hover;
@menu-dark-color-bg-item_selected: @color-menu-dark-hover;
@menu-dark-color-bg-item_disabled: @menu-dark-color-bg;
@menu-dark-color-submenu_selected: var(--primary);
@menu-dark-color-bg-submenu_selected_hover: @color-menu-dark-hover;
@menu-dark-color-item_default: var(--color-text-4);
@menu-dark-color-item_hover: var(--color-text-4);
@menu-dark-color-item_selected: var(--color-bg-white);
@menu-dark-color-item_disabled: var(--color-text-2);
@menu-dark-color-icon_default: var(--color-text-3);
@menu-dark-color-icon_hover: var(--color-text-3);
@menu-dark-color-icon_selected: var(--color-bg-white);
@menu-dark-color-icon_disabled: var(--color-text-2);
@menu-dark-color-group-title: var(--color-text-3);

// popup sub-menu
@menu-color-border-popup: var(--color-fill-3);

// collapse button style
@menu-light-color-bg-button: var(--color-fill-1);
@menu-light-color-bg-button_hover: var(--color-fill-3);
@menu-light-color-button: var(--color-text-3);
@menu-dark-color-bg-button: var(--primary);
@menu-dark-color-bg-button_hover: var(--primary-7);
@menu-dark-color-button: var(--color-bg-white);

/**********************************************
 * horizontal / vertical
 **********************************************/
@menu-horizontal-padding-vertical: @font-size-base;
@menu-horizontal-padding-horizontal: @spacing-8;
@menu-horizontal-item-gap: @spacing-6;
@menu-horizontal-item-height: 28px;
@menu-horizontal-item-padding-horizontal: @spacing-6;

@menu-vertical-padding-vertical: @spacing-2;
@menu-vertical-padding-horizontal: @spacing-4;
@menu-vertical-item-height: 28px;
@menu-vertical-item-padding-horizontal: @spacing-6;

/************************************************
 * collapse
 ***********************************************/
@menu-collapse-width: @size-12;
@menu-collapse-padding-vertical: @spacing-2;
@menu-collapse-padding-horizontal: @spacing-2;

/************************************************
 * popButton
 ***********************************************/
@menu-pop-button-size: @size-10;
@menu-pop-button-margin-bottom: @spacing-6;
@menu-pop-button-box-shadow: @shadow2-down;
@menu-pop-button-border-color: @color-transparent;
