/**
 * Search PRO → визуал поля как в Figma header (node 7437:26493 / imput/search)
 * и старом form.search темы: белая обводка 2px, radius-8, иконка слева, hover → белый фон.
 */

.header__top .header__desktop-actions .search--searchpro {
  margin-bottom: 0;
  flex: 1 1 auto;
  min-width: 0;
  position: relative;
  z-index: 20;
  color: #fff;
}

.header__top .header__desktop-actions .search--searchpro .js-searchpro__field-wrapper,
.header__top .header__desktop-actions .search--searchpro .js-searchpro__field,
.header__top .header__desktop-actions .search--searchpro .searchpro__field {
  width: 100% !important;
  max-width: none !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field,
.header__top .header__desktop-actions .search--searchpro .searchpro__field * {
  font-family: inherit !important;
  box-sizing: border-box;
}

/* Контейнер = Figma imput/search */
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container {
  position: relative;
  display: flex !important;
  align-items: center !important;
  width: 100%;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 2px solid #fff !important;
  border-radius: var(--radius-8, 8px) !important;
  box-shadow: none !important;
  transition:
    background-color 0.2s ease,
    border-color 0.2s ease;
  z-index: 1;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-container.js-searchpro__field-container--focus,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:hover,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:focus-within {
  background: #fff !important;
  border-color: #fff !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-input-container {
  flex: 1 1 auto;
  width: 100%;
  height: 100%;
  position: relative;
  display: flex;
  align-items: center;
  min-width: 0;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-input {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  color: #fff !important;
  font-weight: 400 !important;
  font-size: 14px !important;
  line-height: 40px !important;
  height: 100% !important;
  width: 100% !important;
  padding: 0 36px 0 48px !important;
  margin: 0 !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-container.js-searchpro__field-container--focus .searchpro__field-input,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:hover .searchpro__field-input,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:focus-within .searchpro__field-input {
  color: #171717 !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-input::placeholder {
  color: rgba(255, 255, 255, 0.6) !important;
  opacity: 1 !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-container.js-searchpro__field-container--focus .searchpro__field-input::placeholder,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:hover .searchpro__field-input::placeholder,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:focus-within .searchpro__field-input::placeholder {
  color: rgba(23, 23, 23, 0.35) !important;
}

/* Кнопка «Найти» → иконка поиска слева (как icon-top-search / Figma icon/serach) */
.header__top .header__desktop-actions .search--searchpro .searchpro__field-button-container {
  position: absolute !important;
  left: 0;
  top: 0;
  height: 100%;
  width: 48px;
  z-index: 2;
  pointer-events: none;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-button {
  pointer-events: auto;
  display: block !important;
  width: 48px !important;
  min-width: 48px !important;
  height: 100% !important;
  padding: 0 !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background-color: transparent !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cg opacity='0.2'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.21053 0.0417472C6.71292 0.0937003 5.96897 0.254169 5.50323 0.409989C2.65956 1.3614 0.638855 3.71573 0.091003 6.71565C-0.0318485 7.38839 -0.0300517 8.64823 0.0947921 9.35237C0.480378 11.5273 1.61151 13.3415 3.36089 14.5908C4.24675 15.2234 5.34604 15.7011 6.40776 15.9148C7.55737 16.1461 8.50206 16.1455 9.65995 15.9129C10.6343 15.7171 11.6751 15.2783 12.5182 14.708L12.9645 14.406L15.6627 17.1C17.5263 18.9607 18.4153 19.822 18.5367 19.8845C18.7645 20.0019 19.1907 20.0113 19.396 19.9036C19.587 19.8035 19.7787 19.6147 19.8765 19.4305C19.988 19.2203 19.9938 18.7931 19.888 18.5711C19.8383 18.4669 18.9114 17.5105 17.1024 15.697L14.3912 12.9791L14.6931 12.5329C15.2575 11.6987 15.6996 10.6515 15.8999 9.67413C16.5168 6.66393 15.3771 3.57804 12.9507 1.68866C11.3361 0.431395 9.23956 -0.170128 7.21053 0.0417472ZM7.4176 2.02913C4.75936 2.30913 2.61327 4.27761 2.08366 6.92159C1.9585 7.54643 1.9585 8.54112 2.08366 9.16597C2.51928 11.3407 4.05518 13.0905 6.13432 13.7808C7.67725 14.2931 9.35268 14.1597 10.8023 13.4093C11.3953 13.1023 11.8762 12.7424 12.3548 12.2473C13.0457 11.5325 13.5107 10.7601 13.7917 9.86018C14.3498 8.07308 14.0791 6.23093 13.0253 4.64351C12.6868 4.13362 11.9246 3.3755 11.4048 3.03167C10.2028 2.23659 8.79889 1.88362 7.4176 2.02913Z' fill='white'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 20px center !important;
  background-size: 20px 20px !important;
  color: transparent !important;
  font-size: 0 !important;
  line-height: 0 !important;
  cursor: pointer;
  transition: none;
  -webkit-user-select: none;
  user-select: none;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-container.js-searchpro__field-container--focus .searchpro__field-button,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:hover .searchpro__field-button,
.header__top .header__desktop-actions .search--searchpro .searchpro__field-container:focus-within .searchpro__field-button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none'%3E%3Cg opacity='0.3'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.21053 0.0417472C6.71292 0.0937003 5.96897 0.254169 5.50323 0.409989C2.65956 1.3614 0.638855 3.71573 0.091003 6.71565C-0.0318485 7.38839 -0.0300517 8.64823 0.0947921 9.35237C0.480378 11.5273 1.61151 13.3415 3.36089 14.5908C4.24675 15.2234 5.34604 15.7011 6.40776 15.9148C7.55737 16.1461 8.50206 16.1455 9.65995 15.9129C10.6343 15.7171 11.6751 15.2783 12.5182 14.708L12.9645 14.406L15.6627 17.1C17.5263 18.9607 18.4153 19.822 18.5367 19.8845C18.7645 20.0019 19.1907 20.0113 19.396 19.9036C19.587 19.8035 19.7787 19.6147 19.8765 19.4305C19.988 19.2203 19.9938 18.7931 19.888 18.5711C19.8383 18.4669 18.9114 17.5105 17.1024 15.697L14.3912 12.9791L14.6931 12.5329C15.2575 11.6987 15.6996 10.6515 15.8999 9.67413C16.5168 6.66393 15.3771 3.57804 12.9507 1.68866C11.3361 0.431395 9.23956 -0.170128 7.21053 0.0417472ZM7.4176 2.02913C4.75936 2.30913 2.61327 4.27761 2.08366 6.92159C1.9585 7.54643 1.9585 8.54112 2.08366 9.16597C2.51928 11.3407 4.05518 13.0905 6.13432 13.7808C7.67725 14.2931 9.35268 14.1597 10.8023 13.4093C11.3953 13.1023 11.8762 12.7424 12.3548 12.2473C13.0457 11.5325 13.5107 10.7601 13.7917 9.86018C14.3498 8.07308 14.0791 6.23093 13.0253 4.64351C12.6868 4.13362 11.9246 3.3755 11.4048 3.03167C10.2028 2.23659 8.79889 1.88362 7.4176 2.02913Z' fill='%23171717'/%3E%3C/g%3E%3C/svg%3E") !important;
}

/* Clear — как header-search__clear */
.header__top .header__desktop-actions .search--searchpro .searchpro__field-clear-button {
  width: 20px !important;
  height: 20px !important;
  right: 14px !important;
  top: 50% !important;
  bottom: auto !important;
  transform: translateY(-50%);
  margin: 0 !important;
  opacity: 0.7;
  background-size: 10px 10px !important;
}

/* Плагин рендерит крестик без учёта состояния поля (нет условия в core-шаблоне field.html) —
   прячем его, пока показан placeholder (поле пустое); JS плагина сам покажет/скроет при вводе. */
.header__top .header__desktop-actions .search--searchpro .searchpro__field-input:placeholder-shown ~ .searchpro__field-clear-button {
  display: none !important;
}

.header__top .header__desktop-actions .search--searchpro .searchpro__field-categories-container {
  display: none !important;
}

@media (min-width: 1180px) {
  .header__top.scrollable .header__desktop-actions .search--searchpro {
    width: auto;
    flex: 0 0 196px;
  }
}

.header__top .header__desktop-actions .search--searchpro .searchpro__dropdown,
.header__top .header__desktop-actions .search--searchpro .js-searchpro__dropdown,
.header__top .header__desktop-actions .search--searchpro [class*="searchpro__dropdown"] {
  z-index: 50;
  border-radius: var(--radius-8, 8px);
}