/**
 * Cart Redesign v2.0 — стили для /cart/ на pitomnik1.ru
 *
 * Архитектура (см. cart-redesign-handoff-v2/1-TZ-implementation.md):
 *   Цвет = срочность, не уникальный family. 4 цветовых дорожки:
 *     b1 (зелёный) instock        — готово сейчас
 *     b2 (мятный)  from_pitomnik  — скоро привезём
 *     b3 (амбр)    preorder       — ждём сезон  (включая preorder_06..12)
 *     b4 (серый)   supply         — под заказ
 *   Уникальность бакета внутри дорожки = иконка + заголовок + опц. badge.
 *
 * Скоупится через body.pp-cart-v2 (feature flag из functions.php).
 * Mobile-вёрстка (<768px) НЕ редизайнится — все правила внутри @media (min-width: 768px).
 *
 * Извлечено из mockup/cart-redesign/*.jsx (inline-styles), маппинг 1:1.
 */

/* ── Tokens ─────────────────────────────────────────────────────────────────
 * Все CSS-переменные дизайн-системы вынесены в `cart-tokens.css` — единый
 * источник правды, регенерируемый из `mockup/cart-redesign/tokens.jsx`.
 * Этот файл (cart-redesign.css) использует `var(--c-*)`. Хексы тут запрещены.
 * Enqueue order в functions.php: cart-tokens.css (priority 9) → cart-redesign.css (priority 20).
 * Все переменные документированы в `CLAUDE.md` §2.1 и `cart-tokens.css`. */

/* Default-family для секций без data-family (fallback на supply / серый) */
body.pp-cart-v2 .pp-bucket {
  --b-bg:   var(--c-b4-bg);
  --b-ink:  var(--c-b4-ink);
  --b-ring: var(--c-b4-ring);
}

/* WC backorder_notification («Доступно для предзаказа») избыточна в v2 на ЛЮБОМ
 * viewport: bucket-header «Поставка в Июне» / «Привезём из питомника» уже несёт
 * эту семантику чище. Правило вне @media — работает и на desktop, и на mobile.
 * BUG fix mobile-010 (2026-05-16). */
body.pp-cart-v2 .basket-product .backorder_notification { display: none !important; }

/* pp-from-line («📍 СЦ Реутов Парк», «🌱 8 Готовые», «🏆 Предзаказ — 6 Новые...»)
 * дублирует информацию bucket-header'а на ВСЕХ family — Алексей решил убрать
 * везде (mobile-011 2026-05-16 → mobile-012 «убрать везде»).
 * bucket-header даёт: «Из наличия» (= СЦ Реутов Парк), «Привезём из питомника»
 * (= конкретный склад питомника), «Поставка в Июне» (= preorder); + хинт
 * добавляет контекст «Готовы к выдаче…» / «Готовим к отгрузке…». */
body.pp-cart-v2 .basket-product .pp-from-line { display: none !important; }

/* Family → tokens. Поддерживаем оба варианта написания (engine отдаёт `from-pitomnik` с дефисом, ТЗ — `from_pitomnik` с подчёркиванием). */
body.pp-cart-v2 .pp-bucket[data-family="instock"]        { --b-bg: var(--c-b1-bg); --b-ink: var(--c-b1-ink); --b-ring: var(--c-b1-ring); }
body.pp-cart-v2 .pp-bucket[data-family="from_pitomnik"]  { --b-bg: var(--c-b2-bg); --b-ink: var(--c-b2-ink); --b-ring: var(--c-b2-ring); }
body.pp-cart-v2 .pp-bucket[data-family="from-pitomnik"]  { --b-bg: var(--c-b2-bg); --b-ink: var(--c-b2-ink); --b-ring: var(--c-b2-ring); }
body.pp-cart-v2 .pp-bucket[data-family="preorder"]       { --b-bg: var(--c-b3-bg); --b-ink: var(--c-b3-ink); --b-ring: var(--c-b3-ring); }
body.pp-cart-v2 .pp-bucket[data-family="supply"]         { --b-bg: var(--c-b4-bg); --b-ink: var(--c-b4-ink); --b-ring: var(--c-b4-ring); }
/* Любая новая family — добавьте маппинг здесь, не создавайте новых цветов. */

/* ── Mobile guard: всё ниже работает только от 768px ──────────────────── */
@media (min-width: 768px) {

  /* ── Page wrapper ──────────────────────────────────────────────────── */
  /* Корпоративный сайт pitomnik1.ru на белом фоне; мокап-токен `page: #f5f6f3`
   * (cream/off-white) визуально конфликтует с остальным сайтом. Оставляем
   * transparent чтобы наследовался белый от <main>. Bucket-секции и aside
   * рисуют свой собственный белый+borderRadius — контраст не нужен. */
  body.pp-cart-v2 .basket-section { background: transparent; }
  body.pp-cart-v2 .basket {
    font-family: var(--ff-cart);
    color: var(--c-ink);
  }
  body.pp-cart-v2 .basket__wrap {
    display: flex;
    align-items: flex-start;
    gap: 24px;
    padding: 0 0 32px;
  }
  body.pp-cart-v2 .woocommerce-cart-form.basket__content {
    flex: 1;
    min-width: 0;
    background: transparent;
    box-shadow: none;
    padding: 0;
  }
  /* Скрываем дефолтный «container» нагроможденки темы — двухколонник делаем сами */
  body.pp-cart-v2 .basket-aside {
    width: 340px;
    flex-shrink: 0;
    position: sticky;
    top: 24px;
    background: transparent;
    box-shadow: none;
    padding: 0;
  }

  /* ── H1 «Корзина» ──────────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-cart-title {
    margin: 0 0 16px;
    font-family: var(--ff-cart);
    font-size: 28px;
    font-weight: 700;
    color: var(--c-ink);
    letter-spacing: -0.4px;
  }
  body.pp-cart-v2 .pp-cart-title__count {
    margin-left: 10px;
    font-size: 14px;
    font-weight: 400;
    color: var(--c-mute);
    letter-spacing: 0;
  }

  /* ── Bulk-action bar ──────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-bulk-bar {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
    /* padding-left 36px = чекбокс-колонка (master at left:9px), как в row.
     * До этого было 16px → master сидел на 16px правее row checkboxes. */
    padding: 10px 16px 10px 36px;
    margin: 0 0 16px;
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--ff-cart);
    font-size: 13px;
    position: relative;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-master {
    /* Жёстко позиционируем как row-чекбоксы: absolute left:9, центр по
     * вертикали. Иначе master сидит на padding-left edge (натуральная позиция
     * flex-child), что даёт misalignment с row-checkboxes. */
    position: absolute !important;
    left: 9px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    width: 18px; height: 18px;
    margin: 0;
    accent-color: var(--c-primary);
    cursor: pointer;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-info {
    color: var(--c-ink-soft);
    cursor: pointer;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-info b {
    color: var(--c-ink);
    font-weight: 700;
  }
  body.pp-cart-v2 .pp-bulk-bar__spacer { flex: 1; }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-hint {
    font-size: 12px;
    color: var(--c-mute);
  }
  /* Bulk-delete: outline-кнопка с красным акцентом (BUG-003 fix 2026-05-16).
   * Warehouse mu-plugin печатает inline `<style>` с `background: #c0392b; color: #fff`
   * — заливочный красный. Это конфликтует с дизайн-решением ТЗ §П5 «без модалки,
   * мягкое действие». Перекрываем специфичностью body.pp-cart-v2 (выше) и !important
   * на критичных property для надёжности при любом ордере inline-style блоков. */
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-delete {
    height: 28px !important;
    padding: 0 12px !important;
    background: transparent !important;
    color: var(--c-danger) !important;
    border: 1px solid var(--c-danger) !important;
    border-radius: var(--r-sm) !important;
    font-family: var(--ff-cart) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    cursor: pointer;
    display: inline-flex !important;
    align-items: center !important;
    gap: 6px !important;
    transition: all 150ms;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-delete:not(:disabled):hover {
    background: var(--c-danger-soft) !important;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-delete:disabled {
    opacity: 0.4 !important;
    cursor: not-allowed;
  }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-delete .pp-icon { width: 13px; height: 13px; }
  body.pp-cart-v2 .pp-bulk-bar .pp-bulk-clear {
    background: transparent;
    border: 0;
    padding: 0;
    color: var(--c-ink-soft);
    font-family: var(--ff-cart);
    font-size: 13px;
    cursor: pointer;
    border-bottom: 1px dashed var(--c-border);
    text-decoration: none;
  }
  /* Zero-state bulk-bar: при selectedCount=0 показан только hint;
   * счётчик «Выбрано N из M», кнопка «Удалить выбранные», ссылка «Снять выделение» — скрыты.
   * (Согласовано с макетом page.jsx: `selectedCount > 0 ? <bulk> : <hint>`)
   * !important — потому что BUG-003 fix ставит `display: inline-flex !important`
   * на .pp-bulk-delete для перекрытия warehouse inline-CSS. */
  body.pp-cart-v2 .pp-bulk-bar:not(.is-selected) .pp-bulk-clear,
  body.pp-cart-v2 .pp-bulk-bar:not(.is-selected) .pp-bulk-delete,
  body.pp-cart-v2 .pp-bulk-bar:not(.is-selected) .pp-bulk-info { display: none !important; }
  body.pp-cart-v2 .pp-bulk-bar.is-selected .pp-bulk-hint { display: none !important; }

  /* ── Bucket section ────────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-bucket {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
    overflow: hidden;
    margin: 0 0 16px;
  }
  body.pp-cart-v2 .pp-bucket--empty { display: none; }

  body.pp-cart-v2 .pp-bucket__header {
    padding: 14px 20px;
    background: var(--b-bg);
    border-bottom: 1px solid var(--c-border);
  }
  body.pp-cart-v2 .pp-bucket__title-row {
    display: flex;
    align-items: center;
    gap: 10px;
  }
  body.pp-cart-v2 .pp-bucket__icon {
    width: 20px; height: 20px;
    color: var(--b-ink);
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-bucket__title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--b-ink);
    letter-spacing: -0.1px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-bucket__badge {
    display: inline-flex;
    align-items: center;
    height: 22px;
    padding: 0 8px;
    border-radius: var(--r-lg);
    background: var(--c-surface);
    color: var(--b-ink);
    border: 1px solid var(--b-ring);
    font-family: var(--ff-cart);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.2px;
    white-space: nowrap;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-bucket__spacer { flex: 1; }
  body.pp-cart-v2 .pp-bucket__counts {
    font-size: 13px;
    color: var(--b-ink);
    opacity: 0.85;
    white-space: nowrap;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-bucket__counts b { font-weight: 700; }
  body.pp-cart-v2 .pp-bucket__counts-request {
    margin-left: 6px;
    opacity: 0.85;
  }
  body.pp-cart-v2 .pp-bucket__hint {
    margin: 4px 0 0 30px;
    font-size: 13px;
    color: var(--b-ink);
    opacity: 0.85;
    line-height: 1.45;
  }

  /* ── Bucket body — список строк ───────────────────────────────────── */
  body.pp-cart-v2 .pp-bucket__items {
    list-style: none;
    margin: 0;
    padding: 0;
    background: var(--c-surface);
  }
  /* ── Чекбоксы строк + master (ALIGN-003 fix 2026-05-16) ──────────────
   * Нативный input + accent-color невидно на белом фоне при unchecked.
   * Custom checkbox с явной рамкой, заливкой при :checked, focus-visible для a11y.
   * !important — для перекрытия `accent-color` из inline warehouse CSS. */
  body.pp-cart-v2 .pp-row-check,
  body.pp-cart-v2 .pp-bulk-master {
    appearance: none !important;
    -webkit-appearance: none !important;
    width: 18px !important;
    height: 18px !important;
    border: 1.5px solid var(--c-border) !important;
    border-radius: 3px !important;
    background: var(--c-surface) !important;
    cursor: pointer;
    position: relative;
    transition: all 150ms;
    flex-shrink: 0;
    margin: 0;
    padding: 0;
    accent-color: var(--c-primary); /* fallback */
  }
  body.pp-cart-v2 .pp-row-check:hover,
  body.pp-cart-v2 .pp-bulk-master:hover {
    border-color: var(--c-primary) !important;
  }
  body.pp-cart-v2 .pp-row-check:checked,
  body.pp-cart-v2 .pp-bulk-master:checked,
  body.pp-cart-v2 .pp-bulk-master:indeterminate {
    background: var(--c-primary) !important;
    border-color: var(--c-primary) !important;
  }
  body.pp-cart-v2 .pp-row-check:checked::after,
  body.pp-cart-v2 .pp-bulk-master:checked::after {
    content: '';
    position: absolute;
    top: 1px; left: 4px;
    width: 4px; height: 9px;
    border: solid var(--c-surface);
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  body.pp-cart-v2 .pp-bulk-master:indeterminate::after {
    content: '';
    position: absolute;
    top: 7px; left: 3px;
    width: 9px; height: 2px;
    background: var(--c-surface);
    border-radius: 1px;
  }
  body.pp-cart-v2 .pp-row-check:focus-visible,
  body.pp-cart-v2 .pp-bulk-master:focus-visible {
    outline: 2px solid var(--c-primary) !important;
    outline-offset: 2px;
  }

  /* Совместимость: текущая разметка использует .basket-product (div), не <li>.
   * !important на padding — parent theme style.css имеет правило
   * `.basket .basket-product:first-child { padding-top: 0 }` со специфичностью
   * (0,2,1) > нашей (0,2,0). На первом ряду каждого bucket это даёт top=0
   * вместо 14 (расхождение со spec'ом мокапа bucket.jsx:110). */
  body.pp-cart-v2 .basket-product {
    /* 4-value padding: T R B L. Левый 36px = чекбокс-колонка из warehouse
     * (checkbox at left:9px + width:18px = 27, +9px gap до фото = 36). Раньше
     * `padding: 14px 20px !important` стирал warehouse'овский padding-left:36px
     * и фото съезжало влево на 16px, чекбокс налезал на картинку (gap=-7px). */
    padding: 14px 20px 14px 36px !important;
    border-bottom: 1px solid var(--c-border-soft);
    background: var(--c-surface);
    transition: opacity 200ms;
    /* Сброс родительских table-стилей */
    display: block;
    margin: 0;
  }
  body.pp-cart-v2 .basket-product.is-loading { opacity: 0.6; }
  body.pp-cart-v2 .basket-product:last-child { border-bottom: 0; }
  body.pp-cart-v2 .basket-product__wrap {
    display: flex;
    align-items: flex-start;
    gap: 16px;
    padding: 0;
    border: 0;
    background: transparent;
  }
  /* Чекбокс строки — выровнен по центру фото 64×64 (BUG fix 2026-05-16 v2).
   * Warehouse-плагин ставит чекбокс position:absolute с top:50% — это центр
   * ROW, а не центр фото. Когда строка содержит дополнительные элементы под
   * фото (pp-from-line, error, и т.п.), row становится выше фото на ~18px →
   * центр row уезжает вниз → визуальное смещение чекбокса. visual-contract-
   * check фиксировал diff=9px.
   *
   * Прибиваем чекбокс к центру фото: image начинается от row.top (paddingTop
   * фактически 0 из-за override'ов), image 64px → центр на 32px → чекбокс 18px →
   * top = 32 − 9 = 23px от row.top. */
  body.pp-cart-v2 .basket-product .pp-row-check {
    position: absolute !important;
    left: 9px !important;
    top: 23px !important;
    transform: none !important;
    align-self: auto !important;
    margin-top: 0 !important;
    flex-shrink: 0;
  }
  /* Фото 64×64 */
  body.pp-cart-v2 .basket-product__left {
    display: contents;
  }
  body.pp-cart-v2 .basket-product .basket-product__img {
    width: 64px; height: 64px;
    flex-shrink: 0;
    border-radius: var(--r-sm);
    overflow: hidden;
    border: 1px solid var(--c-border);
    background: var(--c-border-soft);
  }
  body.pp-cart-v2 .basket-product .basket-product__img img,
  body.pp-cart-v2 .basket-product .basket-product__img a {
    display: block;
    width: 100%; height: 100%;
    object-fit: cover;
  }
  /* Тело строки */
  body.pp-cart-v2 .basket-product__text {
    flex: 1;
    min-width: 0;
  }
  body.pp-cart-v2 .basket-product__name {
    display: block;
    font-size: 15px;
    font-weight: 700;
    color: var(--c-ink);
    line-height: 1.3;
    text-decoration: none;
  }
  body.pp-cart-v2 .basket-product__name:hover { color: var(--c-primary-hover); }
  body.pp-cart-v2 .pp-name-main { display: inline; }
  body.pp-cart-v2 .pp-name-modif {
    display: block;
    margin-top: 3px;
    font-size: 13px;
    font-weight: 400;
    color: var(--c-mute);
  }
  body.pp-cart-v2 .pp-from-line {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 6px;
    font-size: 12px;
    color: var(--c-ink-soft);
  }
  /* Pin-иконка: `pp_format_source_line()` из warehouse уже включает emoji 📍/🍃/🌱 в HTML
   * → свой ::before не нужен (был бы дубль). Оставляю empty rule на случай если
   * в будущем понадобится переопределить. */
  /* Inline error под строкой (stock-overshoot) */
  body.pp-cart-v2 .pp-row-error {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 8px;
    font-size: 12.5px;
    color: var(--c-danger);
  }
  body.pp-cart-v2 .pp-row-error .pp-icon { width: 13px; height: 13px; flex-shrink: 0; }

  /* Степпер (overrides существующего markup'а child cart.php) */
  body.pp-cart-v2 .basket-product__right {
    display: contents;
  }
  body.pp-cart-v2 .basket-product__counter { padding-top: 8px; }
  body.pp-cart-v2 .pp-stepper {
    display: inline-flex;
    align-items: center;
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
    background: var(--c-surface);
    overflow: hidden;
    height: 32px;
    /* Parent-theme `.counter` подмешивает padding/gap (см. warehouse
     * mu-plugin), что давало визуальный «frame > fill»: 32×32 кнопки
     * сидели внутри 152×32 контейнера с 10/9 паддингами и 4px gap'ами,
     * между ними и контейнером — пустые поля. Жёстко обнуляем. */
    padding: 0 !important;
    column-gap: 0 !important;
    gap: 0 !important;
  }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn {
    /* appearance: none — без этого Chrome рисует свой 3D-outset на <button>
     * поверх наших border'ов, что выглядит как «двойная граница» / «неполное
     * залитие». Фикс 2026-05-16. */
    appearance: none;
    -webkit-appearance: none;
    width: 32px; height: 32px;
    border: 0;
    background: transparent;
    color: var(--c-ink-soft);
    cursor: pointer;
    padding: 0;
    font-size: 16px;
    font-weight: 700;
    line-height: 1;
    display: grid;
    place-items: center;
    transition: background 150ms;
  }
  body.pp-cart-v2 .pp-stepper .pp-qty-minus { border-right: 1px solid var(--c-border); }
  body.pp-cart-v2 .pp-stepper .pp-qty-plus  { border-left: 1px solid var(--c-border); }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn:hover { background: var(--c-border-soft); }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn:disabled,
  body.pp-cart-v2 .pp-stepper .pp-qty-btn[aria-disabled="true"] {
    opacity: 0.4;
    cursor: not-allowed;
    background: transparent;
  }
  body.pp-cart-v2 .pp-stepper input.qty {
    width: 44px;
    height: 32px;
    border: 0;
    text-align: center;
    font-family: var(--ff-cart);
    font-size: 14px;
    font-weight: 700;
    color: var(--c-ink);
    background: transparent;
    appearance: textfield;
    -moz-appearance: textfield;
    padding: 0;
    /* Parent-theme .counter input может иметь margin (видел 0 8px на проде),
     * который разносит элементы степпера → frame > fill. Жёстко обнуляем. */
    margin: 0 !important;
  }
  body.pp-cart-v2 .pp-stepper input.qty::-webkit-outer-spin-button,
  body.pp-cart-v2 .pp-stepper input.qty::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  /* Цена строки (subtotal + цена/шт) — ALIGN-001 fix 2026-05-16
   * Внутри `.basket-product__info` рендерится:
   *  - WC subtotal: `<span class="woocommerce-Price-amount">…₽</span>`  (17px)
   *  - `.basket-product__count` с цена/шт внутри которого тоже Price-amount (12px)
   * Без override `.basket-product__count .woocommerce-Price-amount` наследует 17px
   * от первого селектора и обе цены выглядят одного размера. */
  body.pp-cart-v2 .basket-product__info {
    text-align: right;
    min-width: 130px;
    padding-top: 4px;
    flex-shrink: 0;
  }
  /* Subtotal — большой 17px (но НЕ внутри .basket-product__count).
   * Парент-тема оборачивает в `<div class="basket-product__price">` —
   * таргетируем именно этот wrapper + любой direct-child span/.amount fallback. */
  body.pp-cart-v2 .basket-product__info > .basket-product__price,
  body.pp-cart-v2 .basket-product__info > .basket-product__price *,
  body.pp-cart-v2 .basket-product__info > .basket-product__price .woocommerce-Price-amount,
  body.pp-cart-v2 .basket-product__info > .basket-product__price .woocommerce-Price-currencySymbol,
  body.pp-cart-v2 .basket-product__info > .basket-product__price bdi,
  body.pp-cart-v2 .basket-product__info > .woocommerce-Price-amount,
  body.pp-cart-v2 .basket-product__info > .product-subtotal {
    font-size: 17px !important;
    font-weight: 700 !important;
    color: var(--c-ink) !important;
    letter-spacing: -0.2px !important;
    white-space: nowrap;
    font-variant-numeric: tabular-nums;
  }
  body.pp-cart-v2 .basket-product__info > .basket-product__price {
    display: block;
  }
  /* Цена/шт — мелкий 12px, мутным, ВКЛЮЧАЯ внутренние Price-amount */
  body.pp-cart-v2 .basket-product__info .basket-product__count,
  body.pp-cart-v2 .basket-product__info .basket-product__count .woocommerce-Price-amount,
  body.pp-cart-v2 .basket-product__info .basket-product__count .woocommerce-Price-amount *,
  body.pp-cart-v2 .basket-product__info .basket-product__count bdi,
  body.pp-cart-v2 .basket-product__info .basket-product__count .woocommerce-Price-currencySymbol {
    display: inline;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: var(--c-mute) !important;
    letter-spacing: 0 !important;
  }
  body.pp-cart-v2 .basket-product__info .basket-product__count {
    display: block;
    margin-top: 2px;
    white-space: nowrap;
  }
  /* «По запросу» (когда товар имеет price_on_request meta) */
  body.pp-cart-v2 .basket-product.is-request .basket-product__info > span:first-child {
    font-size: 15px;
  }
  body.pp-cart-v2 .basket-product.is-request .basket-product__count {
    visibility: hidden; /* сохраняем место для выравнивания */
  }

  /* Кнопка удалить × */
  body.pp-cart-v2 .basket-product__delete {
    padding: 0;
    margin-top: 8px;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .basket-product__icon {
    width: 28px; height: 28px;
    border: 0;
    background: transparent;
    color: var(--c-mute);
    cursor: pointer;
    padding: 0;
    display: grid;
    place-items: center;
    border-radius: var(--r-sm);
    transition: all 150ms;
    text-decoration: none;
  }
  body.pp-cart-v2 .basket-product__icon:hover {
    color: var(--c-danger);
    background: var(--c-danger-soft);
  }
  body.pp-cart-v2 .basket-product__icon .svg { width: 16px; height: 16px; }
  body.pp-cart-v2 .basket-product__icon .pp-icon { width: 16px; height: 16px; }

  /* ── Bucket subtotal ──────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-bucket__subtotal {
    padding: 12px 20px;
    background: var(--c-surface);
    display: flex;
    justify-content: flex-end;
    font-family: var(--ff-cart);
    font-size: 13px;
    color: var(--c-mute);
    gap: 12px;
    white-space: nowrap;
    border-top: 1px solid var(--c-border-soft);
  }
  body.pp-cart-v2 .pp-bucket__subtotal-value {
    color: var(--c-ink-soft);
    font-weight: 700;
  }
  body.pp-cart-v2 .pp-bucket__subtotal-request {
    margin-left: 6px;
    font-weight: 400;
    color: var(--c-mute);
  }

  /* ── Hide WC-стандартные блоки в .basket__list при v2 ────────────── */
  body.pp-cart-v2 .basket__list .basket__button { display: none; }
  body.pp-cart-v2 .basket__list .coupon { display: none; } /* купоны out-of-scope */

  /* Parent-тема рендерит свой `h1.section__title` 48px в отдельном `<section>`
   * (main > section > .container > h1.section__title). У нас есть свой
   * `pp-cart-title` со счётчиком — скрываем parent-h1 при v2.
   * .breadcrumbs-wrap (короткий хлебокрошки) — оставляем видимым. */
  body.pp-cart-v2 h1.section__title { display: none; }

  /* WC backorder_notification («Доступно для предзаказа») избыточна в v2:
   * bucket-header «Поставка в Июне» / «Привезём из питомника» уже несёт эту
   * семантику. Прячем сообщение внутри строки товара. */
  body.pp-cart-v2 .basket-product .backorder_notification { display: none; }
  /* Скрыть пустой dom от do_action('woocommerce_cart_contents') если оттуда что-то лезет */
  body.pp-cart-v2 .basket__list > tr,
  body.pp-cart-v2 .basket__list > tbody,
  body.pp-cart-v2 .basket__list > thead { display: revert; } /* WC может вставить tr — пусть оно работает как есть */

  /* ── Sticky aside «Заказ» ─────────────────────────────────────────── */
  body.pp-cart-v2 .basket-aside .pp-aside {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
    padding: 20px;
    box-shadow: 0 1px 2px rgba(44, 51, 41, 0.04);
    font-family: var(--ff-cart);
  }
  body.pp-cart-v2 .pp-aside__title {
    margin: 0 0 6px;
    font-size: 16px;
    font-weight: 700;
    color: var(--c-ink);
  }
  body.pp-cart-v2 .pp-aside__sub {
    /* !important — parent style.css имеет правило
     * `.info__descr p:not(:last-child) { margin-bottom: 30px }` (0,2,1) которое
     * выигрывает у нашей (0,2,0) на p-элементе в aside (расхождение со spec
     * мокапа aside.jsx:77 marginBottom:8). */
    margin: 0 0 8px !important;
    font-size: 12px;
    color: var(--c-mute);
  }
  body.pp-cart-v2 .pp-aside__lines {
    margin: 4px -4px 12px;
    padding: 4px;
    border-top: 1px solid var(--c-border-soft);
  }
  body.pp-cart-v2 .pp-aside-line {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 0;
  }
  body.pp-cart-v2 .pp-aside-line__icon {
    width: 16px; height: 16px;
    color: var(--b-ink);
    flex-shrink: 0;
  }
  /* Применяем семейный цвет иконки внутри aside-line через data-family */
  body.pp-cart-v2 .pp-aside-line[data-family="instock"]       { --b-ink: var(--c-b1-ink); --b-bg: var(--c-b1-bg); }
  body.pp-cart-v2 .pp-aside-line[data-family="from_pitomnik"] { --b-ink: var(--c-b2-ink); --b-bg: var(--c-b2-bg); }
  body.pp-cart-v2 .pp-aside-line[data-family="from-pitomnik"] { --b-ink: var(--c-b2-ink); --b-bg: var(--c-b2-bg); }
  body.pp-cart-v2 .pp-aside-line[data-family="preorder"]      { --b-ink: var(--c-b3-ink); --b-bg: var(--c-b3-bg); }
  body.pp-cart-v2 .pp-aside-line[data-family="supply"]        { --b-ink: var(--c-b4-ink); --b-bg: var(--c-b4-bg); }
  body.pp-cart-v2 .pp-aside-line__body {
    flex: 1;
    min-width: 0;
  }
  body.pp-cart-v2 .pp-aside-line__title {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 13px;
    font-weight: 700;
    color: var(--c-ink);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.pp-cart-v2 .pp-aside-line__title-text {
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.pp-cart-v2 .pp-aside-line__badge {
    display: inline-flex;
    align-items: center;
    height: 16px;
    padding: 0 6px;
    border-radius: 8px;
    background: var(--b-bg);
    color: var(--b-ink);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2px;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-aside-line__qty {
    font-size: 12px;
    color: var(--c-mute);
    margin-top: 1px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  body.pp-cart-v2 .pp-aside-line__sum {
    font-size: 14px;
    font-weight: 700;
    color: var(--c-ink);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  body.pp-cart-v2 .pp-aside-line__sum--request {
    color: var(--c-mute);
    font-weight: 400;
    font-size: 12px;
  }

  body.pp-cart-v2 .pp-aside__shipping {
    border-top: 1px solid var(--c-border);
    padding: 12px 0;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 12px;
    font-size: 13px;
    color: var(--c-ink-soft);
  }
  body.pp-cart-v2 .pp-aside__shipping-label {
    color: var(--c-mute);
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  body.pp-cart-v2 .pp-aside__shipping-label .pp-icon { width: 14px; height: 14px; }
  body.pp-cart-v2 .pp-aside__shipping-value {
    color: var(--c-mute);
    text-align: right;
    line-height: 1.4;
  }

  body.pp-cart-v2 .pp-aside__total {
    border-top: 1px solid var(--c-border);
    padding-top: 14px;
    margin-bottom: 16px;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 8px;
  }
  body.pp-cart-v2 .pp-aside__total-label {
    font-size: 16px;
    font-weight: 700;
    color: var(--c-ink);
    white-space: nowrap;
  }
  body.pp-cart-v2 .pp-aside__total-value {
    font-size: 24px;
    font-weight: 700;
    color: var(--c-ink);
    letter-spacing: -0.5px;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    text-align: right;
  }
  body.pp-cart-v2 .pp-aside__total-request {
    display: block;
    margin-top: 2px;
    font-size: 11px;
    font-weight: 400;
    color: var(--c-mute);
    text-align: right;
  }

  body.pp-cart-v2 .pp-aside__cta {
    display: inline-flex;
    width: 100%;
    height: 48px;
    padding: 0 24px;
    background: var(--c-primary);
    color: var(--c-surface);
    border: 0;
    border-radius: var(--r-sm);
    font-family: var(--ff-cart);
    font-size: 16px;
    font-weight: 700;
    cursor: pointer;
    align-items: center;
    justify-content: center;
    gap: 8px;
    white-space: nowrap;
    text-decoration: none;
    transition: background 150ms;
  }
  body.pp-cart-v2 .pp-aside__cta:hover { background: var(--c-primary-hover); }
  body.pp-cart-v2 .pp-aside__cta:active { transform: translateY(1px); }
  body.pp-cart-v2 .pp-aside__cta:disabled,
  body.pp-cart-v2 .pp-aside__cta[aria-disabled="true"] {
    background: var(--c-mute-soft);
    opacity: 0.85;
    cursor: not-allowed;
  }
  body.pp-cart-v2 .pp-aside__cta .pp-icon { width: 18px; height: 18px; }

  body.pp-cart-v2 .pp-aside__disclaimer {
    margin: 12px 0 0;
    font-size: 11.5px;
    color: var(--c-mute);
    line-height: 1.5;
  }

  /* Hide WC-стандартные элементы в aside, которые не используются в v2 */
  body.pp-cart-v2 .basket-aside .basket-aside__wrap.cart_totals,
  body.pp-cart-v2 .basket-aside .basket-aside__title,
  body.pp-cart-v2 .basket-aside .basket-aside__info,
  body.pp-cart-v2 .basket-aside .basket-aside__total,
  body.pp-cart-v2 .basket-aside .wc-proceed-to-checkout {
    /* Эти элементы рендерятся cart-totals.php — в v2 шаблоне они есть, но скрыты, чтобы aside-сборка JS-engine'а не путалась */
    display: none;
  }
  body.pp-cart-v2 .basket-aside .pp-aside { display: block; }

  /* ── Empty state ──────────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-empty {
    background: var(--c-surface);
    border: 1px solid var(--c-border);
    border-radius: var(--r-md);
    padding: 64px 32px;
    text-align: center;
    font-family: var(--ff-cart);
    max-width: 720px;
    margin: 0 auto;
  }
  body.pp-cart-v2 .pp-empty__icon {
    width: 72px; height: 72px;
    margin: 0 auto 18px;
    border-radius: 50%;
    background: var(--c-b1-bg);
    color: var(--c-b1-ink);
    display: grid;
    place-items: center;
  }
  body.pp-cart-v2 .pp-empty__icon .pp-icon { width: 40px; height: 40px; }
  body.pp-cart-v2 .pp-empty__title {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    color: var(--c-ink);
  }
  body.pp-cart-v2 .pp-empty__text {
    margin: 8px auto 24px;
    max-width: 380px;
    font-size: 14px;
    color: var(--c-mute);
    line-height: 1.5;
  }
  body.pp-cart-v2 .pp-empty__cta {
    display: inline-flex;
    height: 40px;
    padding: 0 18px;
    background: var(--c-primary);
    color: var(--c-surface);
    border: 0;
    border-radius: var(--r-sm);
    font-family: var(--ff-cart);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    text-decoration: none;
    transition: background 150ms;
  }
  body.pp-cart-v2 .pp-empty__cta:hover { background: var(--c-primary-hover); }
  body.pp-cart-v2 .pp-empty__cta .pp-icon { width: 16px; height: 16px; }

  /* ── Mode-unset banner ────────────────────────────────────────────── */
  body.pp-cart-v2 .pp-mode-banner {
    background: var(--c-danger-soft);
    border: 1px solid var(--c-danger-border);
    border-radius: var(--r-md);
    padding: 14px 18px;
    margin-bottom: 16px;
    display: flex;
    align-items: center;
    gap: 14px;
    font-family: var(--ff-cart);
  }
  body.pp-cart-v2 .pp-mode-banner__icon {
    color: var(--c-danger);
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-mode-banner__icon .pp-icon { width: 22px; height: 22px; }
  body.pp-cart-v2 .pp-mode-banner__body { flex: 1; }
  body.pp-cart-v2 .pp-mode-banner__title {
    margin: 0 0 2px;
    font-size: 14px;
    font-weight: 700;
    color: var(--c-ink);
  }
  body.pp-cart-v2 .pp-mode-banner__text {
    margin: 0;
    font-size: 13px;
    color: var(--c-ink-soft);
    line-height: 1.4;
  }
  body.pp-cart-v2 .pp-mode-banner__cta {
    display: inline-flex;
    height: 40px;
    padding: 0 18px;
    background: var(--c-primary);
    color: var(--c-surface);
    border: 0;
    border-radius: var(--r-sm);
    font-family: var(--ff-cart);
    font-size: 15px;
    font-weight: 700;
    cursor: pointer;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    text-decoration: none;
    transition: background 150ms;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-mode-banner__cta:hover { background: var(--c-primary-hover); }
  body.pp-cart-v2 .pp-mode-banner__cta .pp-icon { width: 16px; height: 16px; }

  /* ── Focus accessibility ──────────────────────────────────────────── */
  body.pp-cart-v2 button:focus-visible,
  body.pp-cart-v2 a:focus-visible,
  body.pp-cart-v2 input[type="checkbox"]:focus-visible,
  body.pp-cart-v2 input[type="number"]:focus-visible {
    outline: 2px solid var(--c-primary);
    outline-offset: 2px;
    border-radius: var(--r-sm);
  }

  /* ── Глушим стили старого engine JS-перестройки внутри v2 ────────── */
  /* JS из pitomnik-cart-buckets-block.php создаёт .pp-bucket--family-* — но при v2 он не запустится (нет плоских .basket-product в .basket__list). На всякий случай: */
  body.pp-cart-v2 .basket-aside .pp-aside-bucket { display: none; }
  body.pp-cart-v2 .pp-orig-hidden { display: revert; }

  /* ── Bottom-bar: дефолт-скрыт на десктопе (показывается на мобайле) ── */
  body.pp-cart-v2 .pp-bottom-bar { display: none; }

} /* /@media min-width:768px */

/* ════════════════════════════════════════════════════════════════════
 * МОБИЛЬНЫЙ БЛОК — v3.0 + v3.1-compact (TZ от 2026-05-16)
 * Источники:
 *   - cart-redesign-handoff-v3/4-TZ-mobile.md (база v3.0)
 *   - 4-TZ-mobile-v3.1-compact.md (патч компактной плотности)
 *
 * Архитектура: десктоп = sticky-aside справа; мобайл = вертикальный
 * стек, aside СКРЫТ, bucket-subtotal СКРЫТ, под bottom-bar 88px резерв.
 * Class-name мэппинг ТЗ→прод (markup НЕ менялся):
 *   .pp-row              → .basket-product
 *   .pp-row__top         → .basket-product__wrap
 *   .pp-row__check       → .pp-row-check
 *   .pp-row__photo       → .basket-product__img
 *   .pp-row__body/name   → .basket-product__text / .basket-product__name
 *   .pp-row__meta        → .pp-from-line (location pin)
 *   .pp-row__delete      → .basket-product__delete  > a
 *   .pp-stepper__btn     → .pp-qty-btn
 *   .pp-row__price-total → .basket-product__price
 *   .pp-row__price-unit  → .basket-product__count
 * ════════════════════════════════════════════════════════════════════ */
@media (max-width: 767px) {
  body.pp-cart-v2 {
    /* ── Лейаут страницы ────────────────────────────────────────── */
    /* Прячем только содержимое aside, НЕ сам basket-aside —
     * pp-bottom-bar рендерится внутри cart-totals.php (внутри basket-aside),
     * если убить basket-aside целиком, fixed bottom-bar тоже не виден. */
    .pp-aside { display: none !important; }
    .basket-aside { position: static !important; height: 0; padding: 0 !important; margin: 0 !important; overflow: visible !important; }
    .basket-aside__wrap { display: none !important; }
    /* Контейнеры flex-row → column (на десктопе шли two-column cart+aside) */
    .basket__wrap,
    .basket__content,
    .woocommerce-cart-form,
    .shop_table_responsive { flex-direction: column !important; width: 100% !important; }
    /* Резерв под bottom-bar — 72px bar + 16px запас */
    .basket-section,
    .basket__content,
    main { padding-bottom: 88px; }
    /* Колонки → один поток. mobile-008 (2026-05-16): убран padding-left/right
     * 12px с woocommerce-cart-form — bucket-секции теперь fullbleed по ширине
     * экрана. Внутренний контент строки имеет свой `padding: 12px` через
     * `.basket-product` — это сохраняет читаемые отступы у фото/имени/цены. */
    .basket-section { padding-left: 0 !important; padding-right: 0 !important; }
    .container, .basket, .basket__wrap, .basket__content,
    .woocommerce-cart-form { padding-left: 0 !important; padding-right: 0 !important; max-width: 100% !important; }
  }
  /* ── Bucket section + header background (выносим из desktop @media) ─ */
  body.pp-cart-v2 section.pp-bucket {
    background: var(--c-surface) !important;
    border-radius: 4px;
    margin: 0 0 12px;
    overflow: hidden;
  }
  body.pp-cart-v2 .pp-bucket__header {
    background: var(--b-bg) !important;
    color: var(--b-ink) !important;
    border-bottom: 1px solid var(--c-border);
  }
  body.pp-cart-v2 .pp-bucket__title { color: var(--b-ink); }
  body.pp-cart-v2 .pp-bucket__icon  { color: var(--b-ink); }
  body.pp-cart-v2 .pp-bucket__hint  { color: var(--b-ink); opacity: 0.85; }
  body.pp-cart-v2 .pp-bucket__items { background: var(--c-surface); }

  /* ── Stepper styling (выносим из desktop @media) ─────────────────── */
  body.pp-cart-v2 .pp-stepper {
    background: var(--c-surface) !important;
    border: 1px solid var(--c-border) !important;
    overflow: hidden;
  }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn {
    appearance: none !important;
    -webkit-appearance: none !important;
    background: transparent !important;
    border: 0 !important;
    color: var(--c-ink-soft) !important;
    cursor: pointer;
    padding: 0 !important;
    margin: 0 !important;
    font-weight: 700;
    line-height: 1;
    display: grid !important;
    place-items: center;
  }
  body.pp-cart-v2 .pp-stepper .pp-qty-minus { border-right: 1px solid var(--c-border) !important; }
  body.pp-cart-v2 .pp-stepper .pp-qty-plus  { border-left:  1px solid var(--c-border) !important; }
  body.pp-cart-v2 .pp-stepper input.qty {
    background: transparent !important;
    border: 0 !important;
    text-align: center;
    color: var(--c-ink) !important;
    font-weight: 700;
    margin: 0 !important;
  }
  /* Чекбоксы — кастомный appearance */
  body.pp-cart-v2 .pp-row-check {
    appearance: none !important;
    -webkit-appearance: none !important;
    border: 1.5px solid var(--c-border) !important;
    border-radius: 3px !important;
    background: var(--c-surface) !important;
    accent-color: var(--c-primary);
  }
  body.pp-cart-v2 .pp-row-check:checked {
    background: var(--c-primary) !important;
    border-color: var(--c-primary) !important;
  }
  body.pp-cart-v2 .pp-row-check:checked::after {
    content: ''; position: absolute;
    top: 1px; left: 5px; width: 5px; height: 11px;
    border: solid var(--c-surface); border-width: 0 2px 2px 0;
    transform: rotate(45deg);
  }
  /* ── Bucket header — однострочный (v3.1 §2) ─────────────────────── */
  body.pp-cart-v2 .pp-bucket__header {
    padding: 10px 12px !important;
  }
  /* Title-row: ОДНА строка, no-wrap. counts уезжает вправо через flex-grow
   * на spacer'е (см. desktop) или margin-left:auto. title сжимается с
   * ellipsis если не помещается. BUG fix mobile-003 (2026-05-16). */
  body.pp-cart-v2 .pp-bucket__title-row {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 8px !important;
    min-width: 0 !important;
  }
  /* Title и counts — одинаковый line-height 20px, чтобы flex align-items:center
   * визуально выровнял их по центральной линии (не по baseline, который
   * сбивается из-за разного font-size 14 vs 11.5px). BUG fix mobile-005. */
  body.pp-cart-v2 .pp-bucket__title {
    font-size: 14px !important;
    line-height: 20px !important;
    margin: 0 !important;
    min-width: 0 !important;
    overflow: hidden;
    text-overflow: ellipsis;
    flex-shrink: 1 !important;
    /* baseline → middle: выравниваем по визуальному центру, не по baseline */
    display: flex !important;
    align-items: center !important;
  }
  body.pp-cart-v2 .pp-bucket__counts {
    font-size: 11.5px !important;
    line-height: 20px !important;
    margin-left: auto !important;
    flex-shrink: 0 !important;
    white-space: nowrap !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
  }
  body.pp-cart-v2 .pp-bucket__icon { width: 16px !important; height: 16px !important; flex-shrink: 0 !important; }
  body.pp-cart-v2 .pp-bucket__counts-request { display: none !important; /* экономим место на mobile */ }
  /* Parent-тема рендерит свой h1.section__title — на desktop он скрыт через
   * @media (min-width: 768px), на mobile дублирующий H1 был виден.
   * BUG fix mobile-004 (2026-05-16). */
  body.pp-cart-v2 h1.section__title { display: none !important; }
  body.pp-cart-v2 .pp-bucket__hint {
    margin-top: 4px !important;
    margin-left: 24px !important;
    font-size: 11.5px !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /* Без line-height множителя в header'е — компактнее */
    line-height: 1.35 !important;
  }
  /* Bucket subtotal — на мобайле дубль шапки, скрываем (v3.1 §3) */
  body.pp-cart-v2 .pp-bucket__subtotal { display: none !important; }

  /* ── Bucket-section внешний — без зазора ─────────────────────────── */
  body.pp-cart-v2 section.pp-bucket {
    border-radius: 0;
    margin: 0 0 12px;
  }

  /* ── Row layout: grid 2 ряда — top (chk+photo+text+×) + bottom (stepper+price)
   * через `display: contents` на __left и __right (плоский DOM) и
   * grid-template-areas на __wrap. Markup не трогаем. (v3.1 §1) */
  body.pp-cart-v2 .basket-product {
    padding: 12px !important;
    border-bottom: 1px solid var(--c-border-soft);
  }
  body.pp-cart-v2 .basket-product__left,
  body.pp-cart-v2 .basket-product__right {
    display: contents;
  }
  body.pp-cart-v2 .basket-product__wrap {
    display: grid !important;
    /* mobile-007 (2026-05-16): col4 = 72px только для row2 (цена). В row1
     * текст растягивается на col3+col4 (через grid-column: 3/span 2 ниже),
     * × ставим position:absolute в углу — не съедает ширину col3. */
    grid-template-columns: 22px 40px 1fr 72px;
    grid-template-rows: auto auto;
    column-gap: 10px;
    row-gap: 8px;
    align-items: start;
    width: 100%;
    position: relative !important;  /* anchor для absolute × */
  }
  /* Row 1: checkbox, photo, text-block, delete */
  body.pp-cart-v2 .basket-product .pp-row-check {
    grid-column: 1; grid-row: 1;
    width: 22px !important; height: 22px !important;
    margin-top: 10px !important;
    /* Сбрасываем десктопный position:absolute */
    position: static !important;
    left: auto !important;
    top: auto !important;
    transform: none !important;
  }
  body.pp-cart-v2 .basket-product .basket-product__img {
    grid-column: 2; grid-row: 1;
    width: 40px !important; height: 40px !important;
    margin: 0 !important;
    align-self: start !important;
    border-radius: 3px !important;
  }
  body.pp-cart-v2 .basket-product .basket-product__img img,
  body.pp-cart-v2 .basket-product .basket-product__img a {
    width: 100%; height: 100%; display: block;
  }
  body.pp-cart-v2 .basket-product .basket-product__text {
    grid-column: 3 / span 2 !important;  /* mobile-007: текст занимает col3+col4 для row 1 */
    grid-row: 1;
    min-width: 0;
    padding-right: 32px !important;  /* место под × absolute */
  }
  body.pp-cart-v2 .basket-product .basket-product__name {
    /* line-clamp 3 — компромисс между занимаемой высотой и сохранением
     * длинных названий типа «Сирень «Красавица Москвы» белая, махровая» (39 chars).
     * При 14px в колонке ~180px влезает ~13 chars/строка → 3 строки = ~39 chars. */
    display: -webkit-box !important;
    -webkit-line-clamp: 5;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.3 !important;
    color: var(--c-ink) !important;
    margin: 0 !important;
    /* Перенос длинных слов по слогам, если строка не разбивается пробелами */
    word-break: break-word;
    overflow-wrap: anywhere;
  }
  /* «3 года, 7.5л» — мета, под названием */
  body.pp-cart-v2 .basket-product .basket-product__name + * {
    font-size: 11.5px !important;
    color: var(--c-mute) !important;
    line-height: 1.35 !important;
    margin-top: 2px !important;
  }
  body.pp-cart-v2 .basket-product .pp-from-line {
    font-size: 11.5px !important;
    margin-top: 2px !important;
    /* Сокращаем — на мобайле одна строка с ellipsis */
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    column-gap: 4px !important;
  }
  /* Кнопка × — позиционирована absolute в правый верхний угол wrap'а
   * (mobile-007 2026-05-16): убрана из grid → текст занимает col3+col4,
   * имя длинных названий не обрезается из-за col4 reservation. */
  body.pp-cart-v2 .basket-product .basket-product__delete {
    position: absolute !important;
    top: 12px !important;
    right: 12px !important;
    margin: 0 !important;
    width: 24px !important;
    z-index: 1 !important;
  }
  body.pp-cart-v2 .basket-product .basket-product__delete .basket-product__icon,
  body.pp-cart-v2 .basket-product .basket-product__delete a {
    position: relative;
    display: grid !important;
    place-items: center;
    width: 24px !important; height: 24px !important;
    color: var(--c-mute-soft) !important;
    margin-top: -2px;
  }
  body.pp-cart-v2 .basket-product .basket-product__delete a::before {
    content: ''; position: absolute; inset: -10px;
  }
  /* Row 2: stepper + spacer + price */
  body.pp-cart-v2 .basket-product .basket-product__counter {
    grid-column: 2 / 4; grid-row: 2;
    padding-top: 0 !important;
    display: flex;
    align-items: center;
  }
  body.pp-cart-v2 .basket-product .basket-product__info {
    grid-column: 4; grid-row: 2;
    text-align: right;
    min-width: 0 !important;
    padding-top: 0 !important;
    /* BUG fix mobile-002d (2026-05-16): flex column физически кладёт
     * детей в столбик. Любой `display: inline-*` на детях не влияет на
     * flex-расположение. Это надёжнее чем `display: block !important`
     * на детях, который может быть перебит другими `inline-block`. */
    display: flex !important;
    flex-direction: column !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;  /* mobile-006: prices ближе к верху row 2, к × выше */
    gap: 2px !important;
  }

  /* ── Stepper 32×32 + hit-area (v3.1 §5) ────────────────────────── */
  body.pp-cart-v2 .pp-stepper { height: 32px !important; border-radius: 3px !important; }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn {
    width: 32px !important; height: 32px !important;
    font-size: 16px !important;
    position: relative;
  }
  body.pp-cart-v2 .pp-stepper .pp-qty-btn::before {
    content: ''; position: absolute; inset: -6px;
  }
  body.pp-cart-v2 .pp-stepper input.qty {
    width: 32px !important;
    min-width: 32px !important;
    padding: 0 4px !important;
    font-size: 14px !important;
  }

  /* ── Цены: total 15px / unit 11px, столбиком (v3.1 §1) ─────────────
   * BUG fix mobile-002 (2026-05-16): desktop ALIGN-001 ставит
   * `.basket-product__count { display: inline }` чтобы subtotal/per-unit
   * стояли друг под другом в desktop info. На mobile это тащит обе цены
   * inline в одну строку, схлопывая колонку имени. Принудительно block. */
  /* Defensive: более специфичные селекторы (0,4,1) гарантируют что
   * desktop ALIGN-001 `display: inline !important` (0,3,1) НЕ перебивает.
   * Mobile-002b (2026-05-16): добавлен `.basket-product` в селектор. */
  body.pp-cart-v2 .basket-product .basket-product__info > .basket-product__price,
  body.pp-cart-v2 .basket-product__info > .basket-product__price {
    display: block !important;
  }
  body.pp-cart-v2 .basket-product .basket-product__info > .basket-product__count,
  body.pp-cart-v2 .basket-product__info > .basket-product__count {
    display: block !important;
    margin-top: 2px !important;
  }
  body.pp-cart-v2 .basket-product__info > .basket-product__price,
  body.pp-cart-v2 .basket-product__info > .basket-product__price *,
  body.pp-cart-v2 .basket-product__info > .basket-product__price .woocommerce-Price-amount {
    font-size: 15px !important;
    font-weight: 700 !important;
    letter-spacing: -0.2px !important;
  }
  body.pp-cart-v2 .basket-product__info .basket-product__count,
  body.pp-cart-v2 .basket-product__info .basket-product__count * {
    font-size: 11px !important;
  }

  /* ── Bulk-bar — fixed bottom, поверх bottom-bar (v3.0 §6) ───────── */
  body.pp-cart-v2 #pp-bulk-bar.pp-bulk-bar {
    position: fixed !important;
    left: 0; right: 0; bottom: 72px;
    margin: 0 !important;
    border-radius: 0;
    padding: 10px 16px 10px 36px !important;
    box-shadow: 0 -2px 8px rgba(44,51,41,0.05);
    z-index: 29;
  }
  /* На мобайле скрываем хинт при 0 выбранных полностью (экономия места) */
  body.pp-cart-v2 .pp-bulk-bar:not(.is-selected) { display: none !important; }

  /* ── Pp-cart-title — компактнее ──────────────────────────────────── */
  /* mobile-009 (2026-05-16): H1 «Корзина N товаров» убран целиком на mobile —
   * экономия вертикального места, счётчик дублируется в bottom-bar и в шапке
   * сайта через mini-cart fragment. На desktop H1 остаётся (см. блок выше). */
  body.pp-cart-v2 .pp-cart-title { display: none !important; }

  /* ── Page-level reset для full-width ─────────────────────────────── */
  /* basket-aside ОСТАВЛЯЕМ видимым (но height: 0) — bottom-bar лежит внутри.
   * Hidden display: none на aside ломал position:fixed на bottom-bar
   * (display:none на ancestor отключает rendering). */

  /* ── Bottom-bar (v3.0 §3) ─────────────────────────────────────────── */
  body.pp-cart-v2 .pp-bottom-bar {
    position: fixed; left: 0; right: 0; bottom: 0;
    height: 72px;
    background: var(--c-surface);
    border-top: 1px solid var(--c-border);
    padding: 0 16px;
    display: flex !important;
    align-items: center;
    gap: 12px;
    font-family: var(--ff-cart);
    box-shadow: 0 -4px 14px rgba(44,51,41,0.08);
    z-index: 30;
  }
  body.pp-cart-v2 .pp-bottom-bar__total {
    flex: 1; min-width: 0;
  }
  body.pp-cart-v2 .pp-bottom-bar__sum {
    font-size: 20px; font-weight: 700; color: var(--c-ink);
    letter-spacing: -0.4px; line-height: 1.1;
    font-variant-numeric: tabular-nums; white-space: nowrap;
  }
  body.pp-cart-v2 .pp-bottom-bar__meta {
    font-size: 11.5px; color: var(--c-mute);
    margin-top: 2px;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  body.pp-cart-v2 .pp-bottom-bar__cta {
    height: 48px; padding: 0 18px;
    background: var(--c-primary); color: var(--c-surface) !important;
    border: 0; border-radius: var(--r-sm);
    font-size: 15px; font-weight: 700; line-height: 1;
    display: inline-flex !important;
    align-items: center; gap: 8px;
    white-space: nowrap;
    cursor: pointer;
    text-decoration: none;
    flex-shrink: 0;
  }
  body.pp-cart-v2 .pp-bottom-bar__cta:hover,
  body.pp-cart-v2 .pp-bottom-bar__cta:focus { background: var(--c-primary-hover, #5e9a4f); color: var(--c-surface); }
  body.pp-cart-v2 .pp-bottom-bar__cta:disabled,
  body.pp-cart-v2 .pp-bottom-bar__cta[aria-disabled="true"] {
    background: var(--c-mute-soft);
    cursor: not-allowed; opacity: 0.85;
  }
  body.pp-cart-v2 .pp-bottom-bar__cta .pp-icon { width: 16px; height: 16px; }
}

/* ── Toast (вне @media — работает и на мобиле) ─────────────────────── */
body.pp-cart-v2 .pp-toast-stack {
  position: fixed;
  bottom: 24px;
  right: 24px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  z-index: 9999;
  pointer-events: none;
}
body.pp-cart-v2 .pp-toast {
  background: var(--c-ink);
  color: var(--c-surface);
  padding: 12px 18px;
  border-radius: var(--r-md);
  font-family: var(--ff-cart);
  font-size: 14px;
  font-weight: 400;
  box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  pointer-events: auto;
  transform: translateY(20px);
  opacity: 0;
  transition: transform 200ms ease, opacity 200ms ease;
  max-width: 360px;
}
body.pp-cart-v2 .pp-toast.is-visible {
  transform: translateY(0);
  opacity: 1;
}
body.pp-cart-v2 .pp-toast.is-error {
  background: var(--c-danger);
}