@import '../index.less';
@btri-dropdown: ~'@{ant-prefix}-btri-dropdown';
@btri-menu: ~'@{ant-prefix}-btri-menu';
@btri-menu-submenu: ~'@{ant-prefix}-btri-menu-subMenu';
@btri-menu-item: ~'@{ant-prefix}-btri-menu-item';

.@{btri-dropdown} {
  &-btn--text {
    padding: 5px 12px !important;
  }
  &-btn--button {
    padding: 5px 16px !important;
  }
  &-btn--active {
    background-color: var(--primary-1) !important;
    color: var(--primary-color) !important;
    border-color: var(--primary-1) !important;
  }
}

.@{btri-dropdown}-menu {
  border: 1px solid var(--primary-2);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
  border-radius: var(--border-radius-base);
  overflow: hidden;

  .@{ant-prefix}-dropdown-menu-item,
  .@{ant-prefix}-dropdown-menu-submenu,
  .@{btri-menu-item},
  .@{btri-menu-submenu} {
    margin: 4px;
    border-radius: var(--border-radius-base);
    &:first-child {
      margin-top: 0;
    }
    &:last-child {
      margin-bottom: 0;
    }
  }

  .@{btri-menu}-item {
    .anticon {
      margin-right: 4px;
    }
  }
  .@{ant-prefix}-dropdown-menu-item-divider {
    background-color: var(--border-3);
    margin: 0 4px;
  }

  .@{btri-menu-submenu} {
    overflow: hidden;
  }
  .@{ant-prefix}-dropdown-menu-submenu-selected {
    background-color: var(--primary-1);

    .anticon-right.@{ant-prefix}-dropdown-menu-submenu-arrow-icon {
      color: var(--primary-color);
    }
  }
}

.@{ant-prefix}-dropdown-menu-submenu-popup {
  .@{ant-prefix}-dropdown-menu-vertical {
    border: 1px solid var(--primary-2);
    box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.1);
    border-radius: var(--border-radius-base);
    overflow: hidden;
  }

  .@{ant-prefix}-dropdown-menu-submenu-selected {
    background-color: var(--primary-1);

    .anticon-right.@{ant-prefix}-dropdown-menu-submenu-arrow-icon {
      color: var(--primary-color);
    }
  }

  .@{ant-prefix}-dropdown-menu-item,
  .@{ant-prefix}-dropdown-menu-submenu,
  .@{btri-menu-item},
  .@{btri-menu-submenu} {
    margin: 4px;
    border-radius: var(--border-radius-base);
    &:first-child {
      margin-top: 0;
    }
    &:last-child {
      margin-bottom: 0;
    }
  }
}