@menuPrefixCls: fxm-menu;
@subMenuPrefixCls: fxm-sub-menu;
@MenuSelectContanerPrefixCls: fxm-menu-select-container;
@multiSelectMenuBtnsCls: fxm-multi-select-btns;
@flexPrefixCls: fxm-flexbox;
@listPrefixCls: fxm-list;
@checkboxPrefixCls: fxm-checkbox;
@firstMenuColor: @fill-grey;

.fxm-menu {
  background-color: @fill-body;

  .fxm-menu-select-container {
    flex-grow: 2;

    .fxm-menu-select-container-submenu {
      align-self: stretch;
    }
  }

  .fxm-multi-select-btns {
    height: @menu-multi-select-btns-height;
    width: 100%;

    .fxm-multi-select-btns-btn {
      width: 50%;
      height: 100%;
      border-radius: 0;

      .hairline('all', @border-color-base, 0);
    }
  }

  .fxm-flexbox {
    .fxm-flexbox-item {
      margin-left: 0;
      -webkit-overflow-scrolling: touch;
      overflow-y: scroll;

      .fxm-list {
        padding: 0;
      }

      .fxm-list {
        .fxm-list-item {
          .fxm-list-line {
            .fxm-list-content {
              font-size: @link-button-font-size;
            }
            .fxm-list-extra {
              .fxm-checkbox-wrapper {
                .fxm-checkbox {
                  position: absolute;
                  top: 0;
                  left: 0;
                  right: 0;
                  bottom: 0;
                  width: 100%;
                  height: 100%;
                  overflow: visible;

                  .fxm-checkbox-inner {
                    top: 12px;
                    right: 15px;
                  }
                }
              }
            }
          }
        }
      }

      &:first-child {
        background-color: @firstMenuColor;

        .fxm-list {
          .fxm-list-body {
            background-color: @firstMenuColor;
            .hairline-remove('bottom');
          }

          .fxm-list-item {
            background-color: @firstMenuColor;

            .fxm-list-line {
              .hairline-remove('bottom');

              .fxm-list-content {
                color: @color-text-base;
              }
            }

            &:last-child {
              .hairline-remove('bottom');
            }

            &.fxm-menu-selected {
              background-color: @fill-base;
            }
          }
        }
      }

      &:last-child {
        background-color: @fill-base;

        .fxm-list {
          .fxm-list-item {
            background-color: @fill-base;
            .hairline-remove('bottom');

            .fxm-list-line {
              .fxm-list-extra {
                flex: 0;
              }
            }

            &.fxm-sub-menu-item-selected {
              .fxm-list-line {
                .fxm-list-content {
                  color: @color-link;
                }
              }
            }

            &.fxm-sub-menu-item-disabled {
              .fxm-list-line {
                .fxm-list-content {
                  color: @color-text-disabled;
                }
              }
            }
          }
        }
      }

      &:only-child {
        .fxm-list {
          .fxm-list-item {
            .fxm-list-line {
              .hairline('bottom');
            }

            &:last-child {
              .hairline('bottom');

              .fxm-list-line {
                .hairline-remove('bottom');
              }
            }
          }
        }
      }
    }
  }
}