@charset "UTF-8";

////
/// @module menu: 菜单
/// @tag Menu
/// @category component
/// @family data-display
/// @varPrefix $menu-
/// @classPrefix {prefix}-menu
/// @order {"size/bounding":10,"size/item":11,"size/sub menu":12,"size/group title":13,"size/divider":14,"size/selected icon":15,"size/arrow":16,"size/checkbox & radio":17,"statement/normal":10,"statement/normal/bounding":100,"statement/normal/text":101,"statement/normal/divider":102,"statement/normal/item":103,"statement/normal/arrow":104,"statement/selected":11,"statement/selected/item":110,"statement/selected/text":111,"statement/selected/selected icon":112,"statement/hover":12,"statement/hover/item":120,"statement/hover/text":121,"statement/hover/arrow":122,"statement/hover/selected icon":123,"statement/disabled":13,"statement/disabled/text":130}
////

$menu-prefix: '.#{$css-prefix}menu';

// Size
// ----------------------------------------

/// padding (t, b)
/// @namespace size/bounding
$menu-padding-vertical: $S4;

/// padding (l, r)
/// @namespace size/bounding
$menu-padding-horizontal: $S16 !default;

/// item height
/// @namespace size/item
$menu-line-height: $S36 - (14px - $font-size-body)*2  !default;

/// text
/// @namespace size/item
$menu-font-size: $font-size-body !default;

/// text
/// @namespace size/sub menu
$menu-submenu-title-size: $font-size-body !default;

/// padding (l, r)
/// @namespace size/group title
$menu-padding-title-horizontal: $S12 !default;

/// width
/// @namespace size/divider
$menu-divider-width: 1px !default;

/// margin (t, b)
/// @namespace size/divider
$menu-divider-margin-ver: $S4 !default;

/// margin (l, r)
/// @namespace size/divider
$menu-divider-margin-hoz: $S12 !default;

/// size
/// @namespace size/selected icon
$menu-icon-selected-size: $icon-m !default;

/// right
/// @namespace size/selected icon
$menu-icon-selected-right: $S8 !default;

/// size
/// @namespace size/arrow
$menu-icon-size: $S16;

/// margin (r)
/// @namespace size/checkbox & radio
$menu-icon-margin: $S4 !default;

// Statement:Normal
// ----------------------------------------

/// shadow
/// @namespace statement/normal/bounding
$menu-shadow: $shadow-01 !default;

/// color
/// @namespace statement/normal/text
$menu-color: $gray-08 !default;

/// style
/// @namespace statement/normal/divider
$menu-divider-style: solid !default;

/// color
/// @namespace statement/normal/divider
$menu-divider-color: $gray-03;

/// background
/// @namespace statement/normal/item
$menu-background: $background-section !default;

/// color
/// @namespace statement/normal/text
$menu-color: $gray-08 !default;

/// color
/// @namespace statement/normal/arrow
$menu-arrow-color: $gray-05;

// Statement:Selected
// ----------------------------------------

/// background
/// @namespace statement/selected/item
$menu-background-selected: $background-section !default;

/// color
/// @namespace statement/selected/text
$menu-color-selected: $gray-08 !default;

/// color
/// @namespace statement/selected/selected icon
$menu-icon-selected-color: $primary-brand !default;

// Statement:Hover
// ----------------------------------------

/// background
/// @namespace statement/hover/item
$menu-background-hover: $gray-01;

/// color
/// @namespace statement/hover/text
$menu-color-hover: $gray-08 !default;

/// color
/// @namespace statement/hover/arrow
$menu-arrow-color-hover: $gray-06;

/// color
/// @namespace statement/hover/selected icon
$menu-icon-selected-hover-color: $primary-brand !default;

// Statement:focus
// ----------------------------------------

/// background
/// @namespace statement/focus/item
$menu-background-focus: $gray-02;

/// color
/// @namespace statement/focus/text
$menu-color-focus: $gray-08 !default;

/// color
/// @namespace statement/focus/arrow
$menu-arrow-color-focus: $gray-07;

/// color
/// @namespace statement/focus/selected icon
$menu-icon-selected-focus-color: $primary-brand !default;

// Statement:Disabled
// ----------------------------------------

/// color
/// @namespace statement/disabled/text
$menu-color-disabled: $gray-05 !default;