/* =====================================================================
   archive.css — стили поля поиска на странице архива.
   Раньше эти стили приходили из тяжёлого Vuetify (Vue + Vuetify ~сотни КБ),
   хотя реально использовались ТОЛЬКО для одного поля поиска и без Vue-логики.
   Здесь оставлены только нужные правила, а Vue/Vuetify полностью убраны.
   Иконки (.material-icons) берёт шрифт Google Material Icons — он подключается
   отдельной ссылкой через $extra_css в archive.php.
   ===================================================================== */

/* Контейнер текстового поля (как Vuetify v-text-field в одну строку) */
.v-input.v-text-field {
  display: flex;
  align-items: flex-start;
  width: 100%;
  font-size: 14px;
  text-align: left;
}

.v-input__control {
  display: flex;
  flex-direction: column;
  width: 100%;
}

/* Нижняя линия-подчёркивание */
.v-input__slot {
  display: flex;
  align-items: center;
  width: 100%;
  border-bottom: 1px solid rgba(0, 0, 0, 0.42);
  transition: border-color 0.2s ease;
}
.v-input__slot:hover {
  border-bottom-color: rgba(0, 0, 0, 0.87);
}

.v-text-field__slot {
  flex: 1 1 auto;
  display: flex;
}

/* Сам input — без рамки, прозрачный фон */
.v-input.v-text-field input {
  width: 100%;
  border: none;
  outline: none;
  background: transparent;
  padding: 8px 0;
  font-size: 14px;
  line-height: 18px;
  color: rgba(0, 0, 0, 0.87);
}
.v-input.v-text-field input::placeholder {
  color: rgba(0, 0, 0, 0.54);
}

/* Иконка поиска справа */
.v-input__append-inner {
  display: flex;
  align-items: center;
  margin-left: 4px;
}
.v-input__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 24px;
  height: 24px;
}
.v-icon.material-icons {
  color: rgba(0, 0, 0, 0.54);
  font-size: 24px;
  line-height: 1;
}

/* --- Отступы между блоками страницы архива --- */

/* Надёжно: контейнеры фильтров и таблицы — прямые дети section.bg0.
   margin-bottom даёт зазор «фильтры → таблица» и «таблица → пагинация». */
.bg0 > .container {
  margin-bottom: 40px;
}

/* Нижний отступ панели со страницами */
#pagination {
  margin-bottom: 25px;
}

/* --- Центрирование иконок фильтров (воронка слева, стрелка справа) --- */
/* В main.css у .control-icon был невалидный top:2 и line-height:45px,
   из-за чего иконки уезжали по вертикали. Центрируем flex'ом по центру их бокса. */
.control-icon,
.select-arrow {
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: normal;
}