/* ===== СТИЛИ ДЛЯ СЕЛЕКТОРА В ПОПАПЕ ПРОФИЛЯ ===== */

/* Базовые стили селектора в попапе - такие же как в карточке каталога */
.popup.popup-sel .new-select {
    border: 1px solid #bdbdbd !important;
    border-radius: 10px !important;
    height: 36px !important;
    background: #fff !important;
    margin-bottom: 0 !important;
}

/* Текст в селекторе - обрезка с многоточием */
.popup.popup-sel .new-select span {
    overflow-x: hidden !important;
    white-space: nowrap !important;
    display: block !important;
    max-width: 100% !important;
    text-overflow: ellipsis !important;
}

/* Стрелка селектора */
.popup.popup-sel .new-select:after {
    top: 50% !important;
    margin-top: -7px !important;
    border-right: 2.5px solid #000 !important;
    border-bottom: 2.5px solid #000 !important;
    width: 10px !important;
    height: 10px !important;
    transform: rotate(45deg) !important;
    background-image: none !important;
    transition: all 0.3s ease !important;
}

/* Состояние open - зеленая рамка */
.popup.popup-sel .new-select.open {
    border: 3px solid #26a69a !important;
}

/* Стрелка в состоянии open */
.popup.popup-sel .new-select.open:after {
    margin-top: -3px !important;
    transform: rotate(-135deg) !important;
}

/* Выпадающий список */
.popup.popup-sel .new-select ol {
    display: none !important;
    position: absolute !important;
    background: #fff !important;
    border-radius: 10px !important;
    box-shadow: 0 5px 10px rgba(0,0,0,0.1) !important;
    z-index: 100 !important;
    max-height: 200px !important;
    overflow-y: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    list-style: none !important;
    left: 0 !important;
    top: 100% !important;
    margin-top: 5px !important;
    border: 1px solid #bdbdbd !important;
}

/* Показываем список при open */
.popup.popup-sel .new-select.open ol {
    display: block !important;
}

/* Элементы списка */
.popup.popup-sel .new-select ol li {
    padding: 10px 15px !important;
    cursor: pointer !important;
    transition: background 0.2s ease !important;
    font-family: "TT-400" !important;
    overflow-x: hidden !important;
    white-space: nowrap !important;
    text-overflow: ellipsis !important;
}

/* Hover эффект - серый фон как в каталоге */
.popup.popup-sel .new-select ol li:hover {
    background: #f1f1f1 !important;
    color: #000 !important;
}

/* Отклоненные проекты - красный текст */
.popup.popup-sel .new-select ol li.rejected {
    color: #ff0000 !important;
}

/* Сообщение "нет проектов" - серый курсив по центру */
.popup.popup-sel .new-select ol li.no-projects {
    color: #999 !important;
    text-align: center !important;
    font-style: italic !important;
    cursor: default !important;
    pointer-events: none !important;
}

.popup.popup-sel .new-select ol li.no-projects:hover {
    background: transparent !important;
}

/* ===== СТИЛИ ДЛЯ КНОПКИ В ПОПАПЕ ПО РАЗНЫМ СТАТУСАМ ===== */

/* Предложение отклонено - розовый фон */
div.popup.popup-sel button.secondary.ps-btn.rejected-state {
    background: #ffdfdf !important;
    color: #000 !important;
    opacity: 1 !important;
}

/* Предложение отправлено - серый фон */
div.popup.popup-sel button.secondary.ps-btn.pending-state {
    background: #b5b5b5 !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* Интеграция в работе - серый фон */
div.popup.popup-sel button.secondary.ps-btn.active-state {
    background: #b5b5b5 !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* ===== СТИЛИ ДЛЯ УМНОГО ПОИСКА ===== */

/* Подсветка найденных слов */
mark {
    background-color: #4CAF50 !important;
    color: white !important;
    padding: 0 2px !important;
    border-radius: 2px !important;
    font-weight: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    display: inline !important;
}

/* Кнопка поиска/очистки - красный цвет при очистке */
button#searchActionBtn.clear-mode {
    background: #ff4444 !important;
}

/* Скрытие фильтров при поиске - ОТМЕНЕНО, фильтр остается видимым */
/* .catalog-filter.hidden-by-search {
    display: none;
} */

/* Блокируем кнопку фильтра во время поиска */
.catalog-filter.filter-disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

.catalog-filter.filter-disabled .cat-filter {
    cursor: not-allowed;
}

/* На мобильных устройствах скрываем фильтр полностью во время поиска */
@media (max-width: 650px) {
    .catalog-filter.filter-disabled {
        display: none !important;
    }
}

/* Скрываем белую заглушку white__top при активном поиске */
.search-active .white__top {
    display: none;
}

/* Сообщение о результатах поиска */
.search-results-info {
    padding: 10px 15px;
    background: #f0f8ff;
    border-left: 3px solid #4CAF50;
    margin-bottom: 15px;
    border-radius: 4px;
    font-size: 14px;
    color: #333;
    display: none;
    position: relative;
    z-index: 1;
    width: fit-content;
    max-width: 600px;
    box-sizing: border-box;
}

.search-results-info.visible {
    display: block;
}

/* Анимация тряски для селектора */
.select-block.quick-move {
    animation: quick 0.5s 1 linear !important;
    display: block !important;
}

/* ===== СТИЛИ ДЛЯ ФИЛЬТРА КАТАЛОГА ===== */
.catalog-filter {
    width: 250px !important;
    min-width: 250px !important;
    border-radius: 10px !important;
    background: rgb(218, 237, 224) !important;
    padding: 14px 10px !important;
    position: relative !important;
    z-index: 9 !important;
    top: auto !important;
    max-height: none !important;
    overflow-y: visible !important;
    box-sizing: border-box !important;
    align-self: flex-start !important;
}

/* Десктоп - добавляем отступ после кнопки */
@media screen and (min-width: 1201px) {
    .catalog-filter {
        height: fit-content !important;
        padding-bottom: 14px !important;
    }
}

.catalog-inner:has(.catalog-filter.fixed) {
    padding-right: 270px;
}

/* Мобильные стили для фильтра */
@media screen and (max-width: 1200px) {
    .catalog-filter {
        width: 100% !important;
        min-width: unset !important;
        height: 40px;
        padding-top: 10px !important;
        padding-bottom: 10px !important;
        overflow: hidden;
        transition: 0.3s;
        align-self: auto !important;
        position: relative !important;
        z-index: 11 !important;
    }
    
    /* Когда фильтр открыт - разрешаем overflow для подсказок */
    .catalog-filter.open {
        overflow: visible !important;
        height: auto !important;
    }
    
    /* Стрелка у заголовка Фильтр */
    .catalog-filter h3.cat-filter {
        position: relative;
    }
    
    .catalog-filter h3.cat-filter:after {
        position: absolute;
        content: '';
        right: 10px;
        top: 0px;
        transform: rotate(90deg);
        transform-origin: 20% 50%;
        width: 16px;
        height: 20px;
        background: url(/img/nav_arrow.svg);
        background-size: contain;
        background-repeat: no-repeat;
        transition: .3s;
    }
    
    /* Активный фильтр в свернутом состоянии - зеленый фон */
    .catalog-filter.selected:not(.open) {
        background: rgb(24, 202, 24) !important;
    }
    
    .catalog-filter.selected:not(.open) h3.cat-filter {
        color: white !important;
    }
    
    .catalog-filter.selected:not(.open) h3.cat-filter:after {
        filter: invert(100%);
    }
    
    /* Развернутый активный фильтр - обычный фон */
    .catalog-filter.open.selected {
        background: rgb(218, 237, 224) !important;
    }
    
    .catalog-filter.open.selected h3.cat-filter {
        color: black !important;
    }
    
    .catalog-filter.open.selected h3.cat-filter:after {
        filter: invert(0%);
    }
    
    /* Поворот стрелки при открытии */
    .catalog-filter.open h3.cat-filter:after {
        transform: rotate(-90deg);
    }
    
    /* Кнопка Применить в активном фильтре - зеленая */
    .catalog-filter.selected button.secondary.filter-ok {
        background: #18ca18 !important;
        color: white !important;
        border: 0 !important;
    }
    
    .catalog-filter.selected button.secondary.filter-ok:hover {
        background: rgb(0, 141, 42) !important;
    }
    
    /* Белая заглушка должна прокручиваться вместе со страницей */
    .white__top {
        position: absolute !important;
    }
}