

/* Start:/local/templates/.default/components/bitrix/search.page/new/style.css?17592411933440*/
.search-page{
  margin-top: 60px;
}

.search-form {
  display: flex;
  align-items: center;
  gap: 10px;
  background: transparent;
  transition: all 0.2s;
  margin-left: auto;
  min-width: 480px;
}

.search-form__container {
  flex-grow: 1;
  position: relative;
}

.search-form__submit-btn {
  font-family: 'Ubuntu', sans-serif;
  font-weight: 700;
  font-style: normal; /* или bold, если это соответствует Bold в Figma */
  font-size: 18px;
  line-height: 21.6px;
  letter-spacing: 0%;
  color: var(--colorOrange);
  width: 119px;
  height: 46px;
  border-radius: 60px;
  border: 2px solid; /* Цвет будет взят из color, если не указан */
  padding: 12px 32px;
  gap: 10px; /* gap не работает для inline-элементов внутри button, но можно использовать margin */
  background: transparent;
  cursor: pointer;
  transition: all 0.2s;
  margin-left: 17px; /* Отступ 17px слева от кнопки поиска */
  box-sizing: border-box; /* Учитывает padding в ширине и высоте */
}

/* Если var(--colorOrange) определяет только текст, а border должен быть другим цветом, уточните: */
.search-form__submit-btn {
  border-color: var(--colorOrange);
  color: var(--colorOrange);
}

/* При наведении, если нужно изменение стиля */
.search-form__submit-btn:hover {
  background-color: var(--colorOrange);
  color: white; /* или другой цвет текста при наведении */
}

.search-form__submit-btn svg:hover {
  fill: #f37521;
}

.search-form__submit-btn svg {
  fill: black;
}

.search-form input.search-form__input {
  padding-right: 34px; /* Чтобы иконка закрытия не налезала на текст */
  height: 48px;
  box-shadow: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  padding: 9px 56px 9px 15px;
  border: 1px solid #D9D9D9;
  font-weight: 400;
  color: #797A7C;
  width: 100%;
  border-radius: 100px;
}

.search-form input.search-form__input::placeholder {
  color: #797A7C;
}

.search-form .search-component {
  box-shadow: none;
}

.search-form__close-btn {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  cursor: pointer;
  padding: 0;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.2s;
}

.search-form__input:focus + .search-form__close-btn,
.search-form__input:not(:placeholder-shown) + .search-form__close-btn {
  opacity: 1;
}

.search-form__close-btn svg {
  fill: #797A7C;
}

.search-form__close-btn:hover svg {
  fill: #2e2e2e;
}

.search-results-count {

    margin-top: 12px;
    height: 20px;
    padding-right: 28px;
    padding-left: 28px;
    display: flex;
    align-items: center;
    gap: 10px;
    font-family: Ubuntu;
    font-weight: 400;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: 0%;
    color: #797A7C;
    opacity: 1;
    white-space: nowrap;
    overflow: hidden;
}


.catalog {
    padding-top: 40px !important;
    padding-bottom: 40px !important;
}


@media (max-width: 768px) {
    .search-form {
        flex-wrap: wrap;
    }

    .search-form__container {
        flex-grow: initial;
        position: relative;
    }

}
/* End */


/* Start:/bitrix/components/bitrix/system.show_message/templates/.default/style.min.css?149733553951*/
font.errortext{color:red}font.notetext{color:green}
/* End */
/* /local/templates/.default/components/bitrix/search.page/new/style.css?17592411933440 */
/* /bitrix/components/bitrix/system.show_message/templates/.default/style.min.css?149733553951 */
