/**
 * yb-card-spacing.css — одно правило отступов на карточку товара.
 * Требование владельца 28.08.2026: «везде и на десктопе, и на мобилке отступы
 * очень некрасиво смотрятся — тут больше, тут меньше. Должно быть одно правило».
 * Шкала и словарь значений — 07_Автоматизация/агенты/САЙТ-ДИЗАЙНЕР/_КОНТЕКСТ/ОТСТУПЫ_ПРАВИЛО.md
 *
 * Восемь значений: 4 · 8 · 12 · 16 · 24 · 32 · 40 · 56. Промежуточных нет.
 * Шаг между блоками задаёт сам блок, а не сетка-контейнер: у Aspro колонка —
 * grid с row-gap 24, и этот gap складывался с собственными полями блоков.
 * Отсюда и брались 91, 97 и 122 px вместо 32.
 *
 * Файл подключён к ОБОИМ шаблонам и идёт последним. Разметка колонки у них
 * одна и та же, поэтому одни и те же селекторы работают и на телефоне,
 * и на компьютере — ровно этого владелец и просил.
 *
 * Откат — снять подключение в component_epilog.php обоих шаблонов и сбросить кэш.
 */

/* ── 1. Колонка: сетка не расставляет, расставляют блоки ─────────────────── */
.catalog-detail__main .grid-list.gap--24 { row-gap: 0; }
/* 24 — шаг по умолчанию для всего, что не перечислено ниже: «между блоками
   внутри одной группы». Нулевые по высоте служебные узлы шага не занимают. */
.catalog-detail__main .grid-list.gap--24 > * { margin-top: 24px; }
.catalog-detail__main .grid-list.gap--24 > :first-child,
.catalog-detail__main .grid-list.gap--24 > script,
.catalog-detail__main .grid-list.gap--24 > .properties-wrapper,
/* обёртки цены и плашек шага не задают — его задают .yb-price-row и .yb-adv внутри */
.catalog-detail__main .grid-list.gap--24 > .visible-by-container-rule { margin-top: 0; }

/* бейджи Сплита и Плюса → строка доставки: строки внутри одного блока цены */
.catalog-detail__main .grid-list.gap--24 > .yb-promise { margin-top: 8px; }
/* доставка → кнопки: блоки внутри одной группы */
.catalog-detail__main .grid-list.gap--24 > .yb-cta-row,
.catalog-detail__main .grid-list.gap--24 > .catalog-detail__btn-actions { margin-top: 24px; }
/* кнопка → кнопка (телефон, на компьютере они в одном ряду) и кнопки → «спросить у флориста» */
.catalog-detail__main .grid-list.gap--24 > .yb-ycp-oneclick,
.catalog-detail__main .grid-list.gap--24 > .yb-msgbar {
    margin-top: 12px;
    /* на телефоне у обоих блоков были отрицательные margin — ими прежде
       подпирали разъезд, который теперь снят в корне */
    margin-bottom: 0;
}

/* ── 2. Верх колонки: заголовок · артикул · варианты ─────────────────────── */
.catalog-detail__main .grid-list.gap--16 { row-gap: 0; }
.catalog-detail__main .grid-list.gap--16 > * { margin-top: 12px; }
.catalog-detail__main .grid-list.gap--16 > :first-child { margin-top: 0; }

/* ── 3. Блоки с разделительной линией — шаг 32 ────────────────────────────
   Линия стоит ровно посередине промежутка: 16 сверху от соседа, 16 до своего
   содержимого. Такие линии есть и в макете студии (там .blk с border-top),
   поэтому их оставляем; лишними были только удвоенные — см. пункт 4.
   Вес селектора — три класса: столько же у правил раздела 12 yb-card-webox.css,
   а файл подключается позже. */
.catalog-detail .catalog-detail__main .yb-variants,
.catalog-detail .catalog-detail__main .yb-price-row,
.catalog-detail .catalog-detail__main .yb-adv,
.catalog-detail .catalog-detail__main .yb-desk-desc {
    margin-top: 16px;
    margin-bottom: 0;
    padding-top: 16px;
}
/* заголовок блока → его содержимое */
.catalog-detail .catalog-detail__main .yb-variants__t { margin-bottom: 16px; }

/* ── 4. Удвоенный разделитель описания ───────────────────────────────────
   `.detail_text__info` получает свои margin/padding/линию от раздела 12.3
   yb-card-webox.css, а с 28.08 текст лежит внутри `.yb-desk-desc`, у которого
   ровно то же самое. Выходило два промежутка и две линии подряд. Вес — четыре
   класса, ровно чтобы перебить трёхклассовое правило webox. */
.catalog-detail .catalog-detail__main .yb-desk-desc .detail_text__info {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
}

/* ── 5. Низ карточки: разделы через 40 ───────────────────────────────────
   Между крупными разделами страницы — 40: тот же приём, что и в пункте 3,
   линия посередине (24 сверху + 16 до содержимого). Контейнер низа у Aspro
   даёт 40–48 px в зависимости от ширины окна — убираем эту «плавучесть». */
/* Граница «карточка → низ страницы» одна на оба шаблона: тема даёт 72px на
   компьютере и 40 на телефоне — ровно тот разнобой, на который жаловался
   владелец. Между крупными разделами по шкале 40, и ровно 40 здесь и выходит:
   16 наших плюс 24, которые тема добавляет снизу колонки под пустую правую
   половину (её разметку Aspro держит для широких контейнеров). Убрать те 24
   можно только правкой классов темы — это дороже, чем стоит вопрос. */
.catalog-detail__bottom-info { row-gap: 0; gap: 0; margin-top: 16px; }
.catalog-detail__bottom-info > #yb-acc-group { margin-top: 24px; }
.catalog-detail__bottom-info > .yb-gifts,
.catalog-detail__bottom-info > #yb-reviews {
    margin-top: 24px;
    margin-bottom: 0;
    padding-top: 16px;
    border-top: 1px solid var(--yb-line, #e7e5ee);
}
.catalog-detail__bottom-info > #yb-tabs {
    margin-top: 0;
    /* свои 4px вкладок складывались с 24 «гармошек» и давали 28 */
    margin-bottom: 0;
}
.catalog-detail__bottom-info > #yb-acc-group:first-child { margin-top: 0; }
