/* ===========================================================================
   Equism — амуниция для лошадей
   ---------------------------------------------------------------------------
   Компоновка — из hm-horses.css, карточка — из hm-card.css.
   Здесь только поля характеристик: сервер (ads/views.py, get_rider_filters)
   отдаёт их со старыми тёмными инлайновыми стилями. Перекрашиваем через
   !important, область ограничена .hl-equip. Высоту и видимость выпадающих
   списков не трогаем: ими управляет скрипт страницы.
   =========================================================================== */

/* Скрытые блоки исчезают даже там, где задан свой display */
.hl-equip [hidden] {
    display: none !important;
}

/* «Сбросить» в футере панели — кнопка, выглядящая как ссылка */
.hl-equip button.hl-reset {
    background: none;
    border: 0;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

/* Карточка лежит внутри обёртки .ad-item: растягиваем её, иначе <a> сожмётся по содержимому */
.hl-equip .ad-item {
    display: flex;
    min-width: 0;
}

.hl-equip .ad-item > .hm-card {
    flex: 1;
    min-width: 0;
}

.hl-equip .hl-equip__note {
    margin: 0;
    font-size: var(--hm-fs-sm);
    color: var(--hm-muted);
}

/* Поля характеристик в узкой панели: одна колонка, без bootstrap-отступов */
.hl-equip #characteristicsFields .row {
    display: grid;
    gap: var(--hm-sp-3);
    margin: 0 !important;
}

.hl-equip #characteristicsFields .row > [class*="col-"] {
    width: 100%;
    max-width: 100%;
    padding: 0 !important;
}

.hl-equip .char-label {
    display: block;
    margin-bottom: var(--hm-sp-2);
    font-size: var(--hm-fs-label);
    font-weight: 600;
    letter-spacing: var(--hm-ls-label);
    text-transform: uppercase;
    color: var(--hm-muted) !important;
    font-family: var(--hm-sans) !important;
}

.hl-equip .char-field .multi-select-display,
.hl-equip .char-field .form-control {
    background-color: var(--hm-surface) !important;
    border: 1px solid var(--hm-border) !important;
    border-radius: var(--hm-r) !important;
    color: var(--hm-text) !important;
    font-family: var(--hm-sans) !important;
    font-size: var(--hm-fs-sm) !important;
    min-height: 44px;
}

/* Стрелку у select берём нативную: светлая стрелка из инлайна на светлом фоне не видна */
.hl-equip .char-field select.form-control {
    appearance: auto !important;
    -webkit-appearance: auto !important;
    background-image: none !important;
    padding-right: var(--hm-sp-3) !important;
}

.hl-equip .char-field .selected-text {
    color: var(--hm-text) !important;
}

.hl-equip .char-field .multi-select-dropdown {
    background: var(--hm-surface) !important;
    border: 1px solid var(--hm-border) !important;
    border-radius: var(--hm-r) !important;
    box-shadow: var(--hm-sh) !important;
}

.hl-equip .char-field .option-item {
    color: var(--hm-text) !important;
    font-family: var(--hm-sans) !important;
    font-size: var(--hm-fs-sm) !important;
}

.hl-equip .char-field .option-item:hover {
    background: var(--hm-green-soft-2) !important;
}

/* Поиск над списком: виден сразу, без открытия панели фильтров */
.hl-equip .hl-search {
    margin-bottom: var(--hm-sp-4);
}

.hl-equip .hl-search .hm-field {
    margin: 0;
}