/* toolbar-fields.css — подписанные поля панелей фильтров.
 *
 * ЗАЧЕМ. Четыре экрана (отчёты, метрики, гипотезы, политики) размечают поля как
 * <label class="f"><span>Подпись</span><input|select></label>. Класса `.f` в CSS
 * НЕ БЫЛО ни одного правила: единственное совпадение — `.cr-row .f`, заливка
 * полоски прогресса, к формам отношения не имеющая. Поэтому подписи и поля
 * валились в одну строку встык, подпись налезала на соседнее поле, и экран
 * выбивался из остальной панели.
 *
 * Замерено 13.09.2026: 13 таких полей на экране отчётов, 4 на метриках,
 * 3 на политиках, 2 на гипотезах.
 *
 * Правила намеренно привязаны к контейнеру панели, а не к голому `.f`:
 * голый селектор задел бы `.cr-row .f` и сломал бы полоски прогресса.
 */

.deals-toolbar .f,
.ui-toolbar .f {
  display: inline-grid;
  gap: 4px;
  align-content: start;
  min-width: 0;
}

/* Подпись НАД полем и капсом — так же, как на панелях управления ценами. */
.deals-toolbar .f > span,
.ui-toolbar .f > span {
  font-size: var(--fs-12);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--dim);
  font-weight: 600;
  line-height: 1.2;
  white-space: nowrap;
}

.deals-toolbar .f > input,
.deals-toolbar .f > select,
.ui-toolbar .f > input,
.ui-toolbar .f > select {
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-lg, 10px);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  box-sizing: border-box;
  max-width: 100%;
}

.deals-toolbar .f > input:focus-visible,
.deals-toolbar .f > select:focus-visible,
.ui-toolbar .f > input:focus-visible,
.ui-toolbar .f > select:focus-visible {
  outline: 2px solid var(--line-3);
  outline-offset: 1px;
}

/* Поисковое поле шире прочих: в него кладут название документа целиком. */
.deals-toolbar .f > input[type="search"],
.deals-toolbar .f > input[type="text"] {
  min-width: 220px;
}

/* Панель дышит по строкам, а не слипается в одну ленту. */
.deals-toolbar {
  row-gap: 12px;
  column-gap: 14px;
  align-items: end;
}

/* ── Подписанные поля в сетке фильтров ──────────────────────────────────
 * `.fl` — та же история, что и `.f`: класс определён ТОЛЬКО внутри чужих
 * контейнеров (.cleanup-filter-grid, .today-new-entity-toolbar,
 * .tns-summary-controls), а в .deals-filters-grid правил нет ни одного.
 * Поэтому подпись и поле шли встык в одну строку. */
.deals-filters-grid .fl {
  display: grid;
  gap: 6px;
  align-content: start;
  min-width: 0;
}

.deals-filters-grid .fl > span {
  font-size: var(--fs-12);
  text-transform: uppercase;
  letter-spacing: .08em;
  color: var(--dim);
  font-weight: 600;
  line-height: 1.2;
}

.deals-filters-grid .fl > select,
.deals-filters-grid .fl > input {
  min-height: 36px;
  padding: 6px 10px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-lg, 10px);
  background: var(--surface);
  color: var(--text);
  font: inherit;
  box-sizing: border-box;
  max-width: 100%;
}

.deals-filters-grid .fl .chips input,
.deals-filters-grid .fl .chips select {
  min-height: 34px;
  padding: 5px 9px;
  border: 1px solid var(--line-2);
  border-radius: var(--r-lg, 10px);
  background: var(--surface);
  color: var(--text);
  font: inherit;
}

.deals-filters-grid .fl .chips input[type="text"] { min-width: 210px; }

/* ── Заголовок раздела уезжал вправо на 20 экранах ──────────────────────
 * views.css задаёт `.brief-section .sh { align-items: flex-end }` для
 * СТРОЧНОЙ раскладки, а redesign.css переключает контейнер на колонку и
 * выравнивание не сбрасывает. В колонке flex-end прижимает и заголовок,
 * и подпись к правому краю — на всех 20 экранах, где встречается class="sh".
 * Замерено 13.09.2026 на экране отчётов, но правило общее, поэтому и правка
 * общая: в колонке заголовок раздела выравнивается по левому краю. */
.brief-section .sh {
  align-items: flex-start;
  text-align: left;
}