/* страница collections, тема creator
   Источник измерений: my-agent/output/fw-shots/nikkykash/{desktop,mobile}/
   collections.metrics.md. Заголовок (.sf-page-title 40px/center/mb-64) и
   сетка-по-умолчанию (.sf-grid gap:32px, presets.css) уже верны — не
   дублируем. Здесь — то, что специфично для /collections/all и не должно
   протечь на home/кабинет через общие классы .sf-grid/.sf-muted. */

/* Вертикальный ритм секции: FW collection--padding = 27px (mobile) / 36px
   (desktop, brakpoint у FW 640px). Берём 768px — тот же breakpoint, на
   котором .store-container у Creator меняет горизонтальные паддинги
   (presets.css) — паддинги страницы переключаются синхронно в одной точке,
   а не в двух разных. */
.preset-creator .sf-creator-collection {
  padding-top: 27px;
  padding-bottom: 27px;
}
@media (min-width: 768px) {
  .preset-creator .sf-creator-collection {
    padding-top: 36px;
    padding-bottom: 36px;
  }
}

/* Сетка товаров: .sf-grid (presets.css) держит 32px на всех ширинах —
   верно для десктопа (метрика gap=32px), но на 390px эталон даёт gap=16px.
   .sf-grid — общий класс (home/кабинет), поэтому сужаем мобильный gap
   только для этой страницы через доп.класс на том же узле; тройная цепочка
   классов даёт специфичность выше `.preset-creator .sf-grid` независимо от
   порядка подключения файлов. */
@media (max-width: 767px) {
  .preset-creator .sf-grid.sf-creator-collection-grid {
    gap: var(--card-gap, 16px);
  }
}

/* Колонки: FW-грид фиксированной ширины (304px десктоп / 155px моб.), НЕ
   резиновые Tailwind grid-cols-2/md:grid-cols-4 (1fr) из collection.html —
   те дают specificity 1 класс, эта цепочка (3 класса) их перебивает.
   justify-content:center — карточная сетка ýже своего контейнера
   (col-grid 1312px внутри контента 1376px на 1440-десктопе, 326px внутри
   358px на 390-моб.), центровка сама создаёт доп. инсет сверх обычного
   паддинга страницы (32px/16px) — первая карточка на x=64 (десктоп) /
   x=32 (моб.), как в эталоне (collections.metrics.md, Grid-контейнеры). */
.preset-creator .sf-grid.sf-creator-collection-grid {
  grid-template-columns: repeat(2, 155px);
  justify-content: center;
}
@media (min-width: 768px) {
  .preset-creator .sf-grid.sf-creator-collection-grid {
    grid-template-columns: repeat(4, 304px);
  }
}

/* Пустое состояние коллекции: в эталоне нет (у nikkykash все коллекции
   заполнены) — нейтральная центровка вместо голого текста впритык к
   заголовку, цвет/шрифт наследует общий .sf-muted. */
.preset-creator .sf-creator-collection-empty {
  display: block;
  text-align: center;
  padding: 48px 0;
}