.m-search {
  --van-cell-background-color: transparent;

  input::placeholder {
    color: var(--k-gray-4);
  }

  :global {
    .van-field__control {
      -webkit-user-select: text !important;
      user-select: text !important;
      font-size: 13px;
    }

    .van-search__field {
      background: transparent !important;
      padding: 0 var(--van-padding-xs) 0 0;
    }

    .van-field__right-icon {
      display: flex;
      align-items: center;
      justify-content: center;
      padding-right: 4px;
    }
  }

  &.default {
    :global {
      .van-search__content {
        background: #f8f9fc !important;
      }
    }
  }

  &.white {
    :global {
      .van-search__content {
        background: #fff !important;
      }
    }
  }

  &.transparent {
    :global {
      .van-search__content {
        background: rgba(255, 255, 255, 0.16);

        input::placeholder {
          color: #fff;
        }

        input {
          color: #fff;
        }

        .van-field__clear {
          color: #fff;
        }
      }
    }
  }

  .searchBtn {
    width: 56px;
    height: 27px;
    padding: 0;
    font-size: 14px;
    font-weight: 500;
    --van-button-mini-height: 28px;
    --van-font-size-xs: 14px;
  }
}