@import '../common/index.wxss';

.van-search {
  -webkit-align-items: center;
  align-items: center;
  box-sizing: border-box;
  padding: 10px 12px;
  padding: var(--search-padding, 10px 16px)
}

.van-search,
.van-search__content {
  display: -webkit-flex;
  display: flex
}

.van-search__content {
  -webkit-flex: 1;
  flex: 1;
  padding-left: 8px;
  padding-left: var(--padding-xs, 8px);
  border-radius: 2px;
  border-radius: var(--border-radius-sm, 2px);
  background-color: #f7f8fa;
  background-color: var(--search-background-color, #f7f8fa)
}

.van-search__content--round {
  border-radius: 17px;
  border-radius: calc(var(--search-input-height, 52px)/2)
}

.van-search__label {
  padding: 0 5px;
  padding: var(--search-label-padding, 0 5px);
  font-size: 14px;
  font-size: var(--search-label-font-size, 16px);
  line-height: 34px;
  line-height: var(--search-input-height, 34px);
  color: #323233;
  color: var(--search-label-color, #323233)
}

.van-search__field {
  -webkit-flex: 1;
  flex: 1;
  height: 68rpx;
}

.van-search__field__left-icon {
  color: #969799;
  color: var(--search-left-icon-color, #969799)
}

.van-search--withaction {
  padding-right: 0
}

.van-search__action {
  padding: 0 8px;
  padding: var(--search-action-padding, 0 8px);
  font-size: 16px;
  font-size: var(--search-action-font-size, 16px);
  line-height: 34px;
  line-height: var(--search-input-height, 34px);
  color: #323233;
  color: var(--search-action-text-color, #323233)
}

.van-search__action--hover {
  background-color: #f2f3f5;
  background-color: var(--active-color, #f2f3f5)
}