@import '../../style/themes/index.less';

@protable-search-prefix-cls: ~'@{pxx-prefix}-pro-table-search';

.@{protable-search-prefix-cls} {
  display: flex;
  flex-flow: column;
  margin-bottom: 8px;
  .scrollbar(4px);

  .@{protable-search-prefix-cls}-menu-space {
    padding: 8px 0;
  }

  .@{protable-search-prefix-cls}-menu-wrap {
    display: flex;
    align-items: center;
    min-height: 52px;
    border-bottom: 1px solid #f0f2f5;
  }

  .@{protable-search-prefix-cls}-menu {
    line-height: 48px;
    border-bottom: none;

    .@{ant-prefix}-menu-item {
      margin: 0 32px 0 0 !important;
      padding: 0 7px !important;
    }
  }

  .@{protable-search-prefix-cls}-title {
    color: rgba(0, 0, 0, 0.65);
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
  }

  .@{protable-search-prefix-cls}-filter {
    margin-left: -8px;
    font-size: 12px;
    line-height: 28px;
    border-bottom: none;

    .@{ant-prefix}-menu-item {
      margin: 0 8px !important;
      padding: 0 10px !important;
      color: rgba(0, 0, 0, 0.65) !important;
      border-bottom: none !important;

      &:hover {
        color: @primary-color !important;
        border-bottom: none !important;
      }
    }

    .@{ant-prefix}-menu-item-selected {
      color: @primary-color !important;
    }
  }

  .@{protable-search-prefix-cls}-toolbar {
    margin-left: auto;
    > * {
      margin-left: 10px;
    }
  }

  .@{protable-search-prefix-cls}-result {
    display: flex;
    flex: 1;
    align-items: center;
    overflow: auto;

    > * {
      margin-right: 16px;
    }

    > .@{ant-prefix}-divider {
      height: 100%;
    }

    > .@{ant-prefix}-tag {
      padding: 0 8px;
      font-size: 12px;
      line-height: 28px;
      border-radius: 28px;

      .@{ant-prefix}-tag-close-icon {
        margin-left: 4px;
      }
    }
  }

  .@{protable-search-prefix-cls}-filter-wrap {
    z-index: 0;
    display: flex;
    margin-top: 8px;
  }
}
