/* Take-Top: то, что должно быть нашим, а не темы.
   Файлы темы (theme.min.css, custom.css, legacy-bridge.css, image-picker.css)
   лежат байт в байт как на проде и правиться не должны — иначе их уже не с чем
   сравнить. Всё, что мы меняем, живёт здесь и грузится последним. */

/* Шапка.
   Высоту шапке на проде давал не логотип, а блок ночной темы справа: он 56px,
   и логотип стоял в нём по центру, с восемью пикселями сверху и снизу. Ночную
   тему мы убрали (PR #167) — и шапка села до 40px, ровно по высоте логотипа,
   который стал упираться в оба края. Возвращаем ей ту же высоту. */
.app-header .navbar {
  min-height: 56px;
}

/* Сетка выбора постов.
   Плагин image-picker раскладывает плитки флоатом и не даёт им ширины — плитка
   получается размером с картинку, а картинки у нас 250×250. В колонке мастера
   заказа помещалось две штуки в ряд, справа оставалась пустая треть, и ряды
   ехали. Раскладываем сеткой, которая считает не по ширине экрана, а по ширине
   своей колонки: плитка не уже ста десяти пикселей, остальное делится поровну.
   Так одинаково ровно и в узкой карточке услуги, и на широкой странице.

   Клетка держит квадрат сама: плагин прячет картинку до загрузки и показывает
   спиннер, и без этого ряд скакал бы по высоте, пока грузится. */
ul.thumbnails.image_picker_selector {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 8px;
  overflow: visible;
}

ul.thumbnails.image_picker_selector li {
  float: none;
  margin: 0;
}

ul.thumbnails.image_picker_selector li .thumbnail {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  border-radius: 4px;
  margin: 0;
}

ul.thumbnails.image_picker_selector li .thumbnail img.image_picker_image {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* Сколько прибавится этому посту.
   Показывается на выбранной плитке вместо счётчика «выбрано 0 из 12», который
   ничего не говорил: пакет делится между выбранными постами, и человек должен
   видеть, сколько достанется каждому (владелец, 2026-09-16). */
ul.thumbnails.image_picker_selector li .thumbnail .take-post-share {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 1;
  padding: 2px 7px;
  border-radius: 999px;
  background: #3063A0;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  line-height: 1.5;
  box-shadow: 0 2px 6px rgba(0, 0, 0, .3);
}