/* ============================================================ */
/* Desktop                                                       */
/* ============================================================ */
.header-desctop-search {
    position: relative;
}
.header-desctop-search .search-line__form {
    display: flex;
    min-height: 40px;
    max-height: 40px;
}
.header-desctop-search .search-line__text {
    border: 1px solid #262626;
    border-radius: 6px 0 0 6px;
    padding: 11px 0 10px 30px;
}
.header-desctop-search .search-line__submit-button {
    background-color: #dccaff;
    height: 40px;
    width: 40px;
    filter: invert(1);
    border-radius: 0 6px 6px 0;
}
.header-desctop-search .x-close {
    display: none;
    cursor: pointer;
    position: absolute;
    top: 19px;
    left: 8px;
}
.header-desctop-search .x-close:before,
.header-desctop-search .x-close:after {
    content: "";
    position: absolute;
    width: 16px;
    height: 2px;
    background: gray;
}
.header-desctop-search .x-close:before {
    transform: rotate(45deg);
}
.header-desctop-search .x-close:after {
    transform: rotate(-45deg);
}

/* ============================================================ */
/* Mobile: кнопка-лупа + раскрывающаяся строка                  */
/* ============================================================ */
.search-button {
    display: none;
    width: 41px;
    height: 31px;
    margin-top: 5px;
    margin-right: -10px;
    background: url('/bitrix/templates/dresscode/static/img/search.svg') no-repeat center;
    background-size: 75%;
}
@media (max-width: 1023px) {
    .search-button {
        display: inline-block;
    }
}
@media (max-width: 400px) {
    .search-button {
        width: 35px;
        margin-right: -8px;
    }
}

.search-line {
    display: none;
}

.search-line__close-button {
    background: url('/bitrix/templates/dresscode/headers/header2018/css/images/ic-close.svg') no-repeat center;
    height: 47px;
    width: 67px;
}

.search-line__submit-button {
    width: 34px;
    height: 31px;
    background: url(/bitrix/templates/dresscode/static/img/search.svg) no-repeat center;
    background-size: 75%;
    border: none;
}

.search-line__text {
    border: none;
    background-color: transparent;
    color: black;
    width: 100%;
}

/* ============================================================ */
/* Mobile fixed: компактная форма (.header-mobile-search)        */
/*                                                                */
/* ВНИМАНИЕ: базовые правила для .header-mobile-search уже есть   */
/* в headers/header2024/css/style.css — они специфичнее           */
/* (#subHeader6.header-wrap .mobile .header-mobile-search)        */
/* и переопределяют стили ниже. Здесь — только fallback,          */
/* чтобы внешний вид не сломался, если header2024/css/style.css   */
/* по какой-то причине не подключён.                              */
/* ============================================================ */
.header-mobile-search {
    display: none;
    width: 100%;
}
.header-mobile-search .search-line__text {
    padding-left: 15px;
    border-right: none;
}
.header-mobile-search .search-line__submit-button {
    background-color: unset;
    filter: invert(0);
    border: 1px solid #7FC200;
    border-left: none;
}