/*
 * cart_v2_overrides.css — iter-20 δ-D fix-2 (2026-06-12)
 *
 * Назначение: МИНИМАЛЬНЫЙ scoped CSS для module=cart, чтобы:
 *   1) кнопка .cart-empty .btn.btn--primary.btn--lg рендерилась как
 *      orange pill (без подключения целого iter-04-homepage.css);
 *   2) cart_v2.css имел доступ к токенам --c-surface, --ls-smallcaps
 *      (для .atc-card / .atc-product__brand letter-spacing на cart-page).
 *
 * Background (Codex audit 2026-06-12_08-44-01 REJECT):
 *   Предыдущий δ-D fix просто расширил conditional на iter-04-homepage.css,
 *   чтобы получить .btn-семью. Но iter-04 содержит layout-правила:
 *     .v2-container { max-width: 1820; padding-inline: 32px; margin-inline: auto }
 *   которые сжимают cart-shell с принятого baseline (width 1200, grid 784/384)
 *   до width 1088, grid 672/384 — регрессия δ-D GRID STATUS.
 *
 * Это файл — NARROW fix: только .btn family + tokens, БЕЗ layout-overrides.
 * Не подключается на других модулях.
 *
 * См. memory/feedback_codex_narrow_fix_discipline.md — урок discipline'ы.
 */

/* ── Tokens (для cart_v2.css .atc-card / .atc-product__brand) ── */
:root {
  --c-surface:    #FFFFFF;
  --ls-smallcaps: 0.06em;
  /* iter-20 δ-P (2026-06-12): добавили --c-success — vendored cart_v2.css
     использует его для .atc-badge success state (зелёный круг). Без
     токена color-mix() invalid → круг не рендерится (Codex audit). */
  --c-success:    #16A34A;
}

/* iter-20 δ-P (2026-06-12) — explicit fallback на .atc-badge background
   (color-mix() в vendored CSS не работал из-за отсутствия --c-success). */
.atc-badge {
  background: #DCFCE7 !important; /* green-100 fallback */
  color: #16A34A !important;
}

/* ════════════════════════════════════════════════════
   BUTTON SYSTEM — 1-в-1 копия из iter-04-homepage.css:208-311
   (см. cart_v2.html .cart-empty CTA «Перейти в каталог»).
   ════════════════════════════════════════════════════ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-2);
  height: 44px;
  padding: 0 var(--sp-5);
  border-radius: var(--r-pill);
  font-family: var(--ff-body);
  font-size: var(--fs-body);
  font-weight: 600;
  line-height: 1;
  letter-spacing: 0.01em;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition:
    background var(--dur-fast) var(--ease-out),
    box-shadow var(--dur-fast) var(--ease-out),
    transform var(--dur-fast) var(--ease-out),
    color var(--dur-fast) var(--ease-out);
}
.btn:focus-visible {
  outline: 2px solid var(--c-blue);
  outline-offset: 2px;
}
@media (prefers-reduced-motion: reduce) {
  .btn { transition: none; }
}

/* Primary — orange CTA (используется .cart-empty CTA) */
.btn.btn--primary {
  background: var(--c-orange);
  color: #fff;
}
.btn.btn--primary:hover,
.btn.btn--primary:focus-visible {
  background: var(--c-orange-dk);
  box-shadow: 0 4px 14px rgba(243,96,18,.35);
  transform: translateY(-1px);
  color: #fff;
}
.btn.btn--primary:focus-visible {
  outline-color: var(--c-orange);
  box-shadow: 0 0 0 3px rgba(243,96,18,.25);
  transform: none;
}

/* Secondary — blue */
.btn.btn--secondary {
  background: var(--c-blue);
  color: #fff;
}
.btn.btn--secondary:hover {
  background: var(--c-blue-dark);
  box-shadow: 0 4px 14px rgba(14,148,200,.3);
  transform: translateY(-1px);
  color: #fff;
}

/* Outline */
.btn.btn--outline {
  background: transparent;
  border: 1.5px solid var(--c-blue);
  color: var(--c-blue);
}
.btn.btn--outline:hover {
  background: var(--c-blue-light);
}

/* Ghost */
.btn.btn--ghost {
  background: transparent;
  color: var(--c-text);
}
.btn.btn--ghost:hover {
  background: var(--c-bg-soft);
}

/* Size variants */
.btn.btn--sm {
  height: 36px;
  padding: 0 var(--sp-4);
  font-size: var(--fs-sm);
}
.btn.btn--lg {
  height: 52px;
  padding: 0 var(--sp-6);
  font-size: var(--fs-h4);
}

/* Disabled */
.btn:disabled,
.btn[aria-disabled="true"] {
  opacity: .5;
  cursor: not-allowed;
  pointer-events: none;
}

/* Full-width modifier */
.btn.btn--full { width: 100%; }

/* ════════════════════════════════════════════════════
   δ-F (2026-06-12) — Cart item quantity stepper.
   Vendored cart_v2.css references base .hv2-qty class (от components.css),
   но мы загружаем только cart_v2.css. Минимальная имплементация для
   .cart-qty markup, который рендерит products.html.
   ════════════════════════════════════════════════════ */
.cart-qty {
  display: inline-flex;
  align-items: stretch;
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  background: var(--c-bg, #fff);
  height: 36px;
  overflow: hidden;
}
.cart-qty__btn {
  width: 32px;
  border: 0;
  background: transparent;
  font: 600 18px/1 var(--ff-body);
  color: var(--c-text);
  cursor: pointer;
  display: grid;
  place-items: center;
  transition: background var(--dur-fast) var(--ease-out);
}
.cart-qty__btn:hover {
  background: var(--c-bg-soft);
}
.cart-qty__btn:disabled,
.cart-qty__btn.link_disabled {
  opacity: .35;
  cursor: not-allowed;
}
.cart-qty__input {
  width: 44px;
  border: 0;
  border-left: 1px solid var(--c-border-soft);
  border-right: 1px solid var(--c-border-soft);
  text-align: center;
  font: 600 14px/1 var(--ff-body);
  color: var(--c-text);
  background: var(--c-bg, #fff);
  -moz-appearance: textfield;
  appearance: textfield;
}
.cart-qty__input::-webkit-outer-spin-button,
.cart-qty__input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.cart-qty__input:focus {
  outline: 2px solid var(--c-blue);
  outline-offset: -2px;
}
/* hidden recalc «Пересчитать» link — показывается JS'ом */
.qty_recalc.hidden { display: none; }
.qty_recalc:not(.hidden) a {
  color: var(--c-blue);
  text-decoration: underline;
}

/* legacy class .d-none is used in promocode toggle */
.d-none { display: none !important; }
.sv-invalid-comb.hidden { display: none; }

/* Reset: убираем margin у h3.cart-item__name (Smarty default стиль h3) */
.cart-item__name { margin: 0; }

/* iter-20 δ-F (2026-06-12) — guard от horizontal overflow.
   .cart-main находится в grid track minmax(0, 1fr). Если у child'а
   (legacy form table с fixed width, или новый .cart-item с длинным
   названием) min-content > track, grid expandит → overflow.
   min-width: 0 + overflow-x: clip — стандартный fix. */
.cart-main {
  min-width: 0;
  overflow-x: clip;
}
.cart-card,
.cart-card * {
  max-width: 100%;
  box-sizing: border-box;
}
/* Конкретно для legacy form внутри .cart-main — table-layout fixed
   + ширина 100% чтобы не расти за грид-track. */
.cart-main .cart_pers_container { max-width: 100% !important; margin-right: 0 !important; }
.cart-main table.cart-making-order { width: 100% !important; max-width: 100% !important; }

/* iter-20 δ-G (2026-06-12) — grid-track guard для .cart-addons / .cart-xsell-grid.
   Vendored cart_v2.css ставит `grid-template-columns: 1fr 1fr` без min-width:0,
   из-за чего tracks expand под intrinsic content (длинное название addon'а
   с padding/icon/price = 443px вместо 362px @ cart-main 784).
   Fix: minmax(0, 1fr) + overflow-wrap для текста. */
.cart-main .cart-addons { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important; }
.cart-addon__title,
.cart-addon__sub { overflow-wrap: break-word; word-break: normal; }

/* iter-20 δ-I (2026-06-12) — .v2-input минимальная имплементация.
   Vendored cart_v2.css ссылается на base .v2-input (от components.css которого
   мы не грузим). Для всех <input> в .cart-form. */
.v2-input {
  display: block;
  width: 100%;
  height: 44px;
  padding: 0 var(--sp-4);
  border: 1px solid var(--c-border);
  border-radius: var(--r-md);
  background: var(--c-bg, #fff);
  font: 400 var(--fs-sm) / 1 var(--ff-body);
  color: var(--c-text);
  box-sizing: border-box;
  transition: border-color var(--dur-fast) var(--ease-out), box-shadow var(--dur-fast) var(--ease-out);
}
.v2-input:focus {
  outline: 2px solid var(--c-blue);
  outline-offset: -1px;
  border-color: var(--c-blue);
}
.v2-input::placeholder { color: var(--c-text-3, #8B95A1); }
.v2-input[type="email"],
.v2-input[type="text"] { font-size: var(--fs-body, 17px); }

/* 7.3 (Owner 2026-06-26): все поля ввода корзины — белая заливка.
   На /cart/ токен --c-bg резолвится в серый #F7FAFB (white-override живёт в
   product_v2.css :root, который на корзине не грузится) → поля казались disabled.
   Явный #fff только для полей, без глобального изменения токена. */
.v2-input,
.cart-textarea,
.cart-promo__form input,
.cart-form input[type="text"],
.cart-form input[type="tel"],
.cart-form input[type="email"],
.cart-form input[type="number"],
.cart-form textarea,
.cart-form select { background-color: #fff; }

/* iter-20 δ-I — grid-track guard для .cart-field__row (telephone+name etc.). */
.cart-main .cart-field__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.cart-field { min-width: 0; }

/* ════════════════════════════════════════════════════
   iter-20 δ-L (2026-06-12) — RESPONSIVE ≤1280 / ≤1080 / ≤720
   ════════════════════════════════════════════════════
   Проблема: глобальный `.container1 { width: 1200px }` (styles_modern.css:1052)
   на cart-странице форсит horizontal scroll @ viewport < 1200. Vendored
   cart_v2.css (lines 366-378) имеет правила @1080/@720, но они срабатывают
   ТОЛЬКО когда контейнер уже fluid.

   Fix: scoped fluid-layout для `.container1.fixMinMaxWidth` НА cart-page через
   `:has(.cart-grid)` (narrow scope — не touches других страниц). Делаем
   container fluid на ≤1280, добавляем padding-inline.

   См. memory/feedback_codex_narrow_fix_discipline.md — scoped fallback. */

/* ════════════════════════════════════════════════════
   iter-20 δ-N fix (2026-06-12) — guards для iter-04-homepage.css
   ════════════════════════════════════════════════════
   Codex δ-N 2026-06-12_15-57-35 REJECT: hv2-header/footer DOM был, но
   стили не применялись потому что `iter-04-homepage.css` не подключался
   на module=cart. Подключение iter-04 регрессирует cart-shell baseline:
   - .v2-container { max-width: 1820; padding-inline: 50 } → cart-shell
     сжимается на 100px (regression δ-D fix-1).
   - body.has-footer .container1.fixMinMaxWidth { width:auto; max-width:1280;
     padding:0 24 } → container 1200 + padding 48 → cart-grid 1152 вместо 1200.
   Решение: scoped overrides ниже. Применяются ТОЛЬКО когда cart-shell
   (cart-grid) присутствует на странице — header/footer styling не затронут. */

/* ════════════════════════════════════════════════════
   iter-20 δ-N polish #2 (2026-06-12) — PIVOT: desktop-only cart как на homepage
   ════════════════════════════════════════════════════
   Owner 2026-06-12: «И на главной у нас же нормально работает хэдер.
   Почему мы в корзине имеем проблему с размерами?»

   До этого pivot: на cart я переопределял `body { min-width: 0 }` чтобы
   responsive ≤1199 работал (δ-L). Это сжимало body до viewport и hv2-header
   overflowил (hv2-actions=891 @720 vs container=720).

   После pivot: cart рендерится 1-в-1 как homepage — body min-width:1200,
   horizontal scroll на ≤1199 viewport, hv2-header in-bounds (right=1168 inside
   container=1200). Tablet/desktop users видят desktop layout с horizontal
   scroll (mobile/User-Agent — отдельный шаблон).

   Чтобы предотвратить странный mix vendored responsive @1080/@720 с
   body=1200, neutralize vendored responsive для cart-shell. */

/* ════════════════════════════════════════════════════
   iter-20 δ-N polish #3 (2026-06-12) — ALIGN cart-shell с footer/header
   ════════════════════════════════════════════════════
   Owner 2026-06-12: «Ты почему-то ужал содержимое корзины. Должно быть
   выровнено четко по футеру.»

   До этого pivot: cart container1 = 1200px fixed. Header/footer .v2-container
   = max-width:1820 + padding-inline:50 (fluid). На viewport > 1200 cart был
   уже header/footer (видимые поля по краям).

   После: cart container1 копирует .v2-container pattern (max-width:var(--
   layout-max) [1820], padding-inline:var(--layout-gutter) [50], width:auto,
   margin:auto). Cart-grid использует vendored fluid `minmax(0,1fr) 384px` —
   summary 384 fixed, main flex.

   Baselines δ-D…δ-K cart-grid '784px 384px' изменены на fluid '<flex>px 384px'.
   На viewport 1200 (body forced 1200): container = 1200-100 = 1100; cart-main
   = 1100-32-384 = 684; summary = 384. На viewport 1820+: container = 1720;
   cart-main = 1304; summary = 384. */

/* Cart container1 — копия .v2-container pattern: fluid + padding-inline 50. */
body.has-footer .container1.fixMinMaxWidth:has(.cart-grid) {
  width: auto !important;
  max-width: var(--layout-max) !important; /* 1820 */
  padding-inline: var(--layout-gutter) !important; /* 50 */
  margin-inline: auto !important;
  padding-block: 0 !important;
  box-sizing: border-box !important;
}

/* Cart-shell внутренние .v2-container (breadcrumbs + cart-top + cart-grid band) —
   убираем второй padding-inline (родитель container1 уже даёт padding 50). */
body:has(.cart-grid) #main .v2-container,
body:has(.cart-grid) #main > .v2-band > .v2-container {
  max-width: none !important;
  padding-inline: 0 !important;
}

/* Neutralize vendored cart_v2.css @1080 responsive — keep 2-col fluid + sticky
   summary даже на узких viewport (body forced 1200, scroll horizontal). */
@media (max-width: 1080px) {
  .cart-grid { grid-template-columns: minmax(0, 1fr) 384px !important; gap: var(--sp-6) !important; }
  .cart-summary { position: sticky !important; top: 16px !important; width: 384px !important; max-width: 384px !important; }
  .cart-xsell-grid { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
}

/* Neutralize vendored cart_v2.css @720 responsive. */
@media (max-width: 720px) {
  .cart-item { grid-template-columns: 104px minmax(0,1fr) auto !important; }
  .cart-item__media { width: 104px !important; height: 104px !important; }
  .cart-item__aside { grid-column: auto !important; flex-direction: column !important; align-items: flex-end !important; justify-content: flex-start !important; }
  .cart-main .cart-addons { grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; }
  .cart-main .cart-field__row { grid-template-columns: minmax(0,1fr) minmax(0,1fr) !important; }
}

/* ════════════════════════════════════════════════════
   iter-20 δ-N polish (2026-06-12) — MINIMAL CHECKOUT FOOTER
   ════════════════════════════════════════════════════
   Owner: «футер минимальным, чтобы не отвлекал от корзины». Используем
   footer_minimal_v2.html (отдельный partial) со scoped .hv2-footer--minimal
   стилями. Reuses .hv2-footer dark bg + text color tokens из iter-04. */

.hv2-footer.hv2-footer--minimal {
  padding-block: var(--sp-5); /* 24px */
}
.hv2-footer.hv2-footer--minimal .hv2-footer__minimal-inner {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1.2fr);
  gap: var(--sp-6); /* 32 */
  align-items: center;
}
.hv2-footer__minimal-brand {
  display: flex;
  align-items: center;
  gap: var(--sp-4); /* 16 */
  min-width: 0;
}
.hv2-footer__minimal-logo {
  display: inline-flex;
  flex-shrink: 0;
}
.hv2-footer__minimal-logo img {
  height: 30px;
  width: auto;
  /* footer dark — invert logo если он чёрный */
  filter: brightness(0) invert(1);
  opacity: .9;
}
.hv2-footer__minimal-meta {
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-size: var(--fs-sm, 13px);
  color: rgba(255, 255, 255, .78);
  min-width: 0;
}
.hv2-footer__minimal-meta a {
  color: rgba(255, 255, 255, .92);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.hv2-footer__minimal-meta a:hover { color: #fff; }
.hv2-footer__minimal-tel { font-weight: 600; }

.hv2-footer__minimal-links {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: var(--fs-sm, 13px);
  min-width: 0;
}
.hv2-footer__minimal-links a {
  color: rgba(255, 255, 255, .78);
  text-decoration: none;
  transition: color var(--dur-fast) var(--ease-out);
}
.hv2-footer__minimal-links a:hover {
  color: #fff;
  text-decoration: underline;
}

.hv2-footer__minimal-pay {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: var(--sp-2); /* 8 */
  min-width: 0;
}
.hv2-footer__minimal-pay-label {
  font-size: 12px;
  color: rgba(255, 255, 255, .6);
  text-transform: uppercase;
  letter-spacing: .04em;
}
.hv2-footer__minimal-pay-list {
  display: flex;
  align-items: center;
  gap: var(--sp-3); /* 12 */
  flex-wrap: wrap;
  justify-content: flex-end;
}
.hv2-footer__minimal-pay-list img {
  height: 20px;
  width: auto;
  background: #fff;
  padding: 3px 5px;
  border-radius: 4px;
  display: block;
}

/* Responsive */
@media (max-width: 900px) {
  .hv2-footer.hv2-footer--minimal .hv2-footer__minimal-inner {
    grid-template-columns: 1fr;
    gap: var(--sp-4);
    text-align: left;
  }
  .hv2-footer__minimal-pay { align-items: flex-start; }
  .hv2-footer__minimal-pay-list { justify-content: flex-start; }
}
@media (max-width: 540px) {
  .hv2-footer__minimal-brand { flex-direction: column; align-items: flex-start; gap: var(--sp-3); }
}

/* δ-N polish #2 (2026-06-12): @540 font-size overrides УДАЛЕНЫ. Cart на
   узких viewport теперь рендерится desktop-layout (body forced 1200) —
   font-sizes должны быть desktop baseline. */

/* iter-20 δ-N polish #4 (2026-06-12) — hide legacy h1 «Корзина Продолжить
   покупки». Источник: cart_v2.html:115 включает cart_legacy_items.html
   который wrapит #sv-products-content в headless_center_block.html с
   title='Ваша корзина'. Тот шаблон рендерит legacy h1.title.new_cart
   (см. headless_center_block.html:14-19) — визуально дублирует наш
   .cart-top__title h1 «Корзина» (cart_v2.html:44).
   Owner 2026-06-12: «двойная надпись хлебные крошки: КорзинаПродолжить покупки».
   Скрываем CSS'ом — НЕ трогаем legacy template chain (риск сломать AJAX
   через #sv-products-content). */
body:has(.cart-grid) .headless-center-block.new_cart_container > h1.title.new_cart { display: none !important; }

/* ════════════════════════════════════════════════════
   Аудит-пакет РАУНД 2 (2026-06-27) — корзина 1.2 / 1.3
   ════════════════════════════════════════════════════ */

/* 1.2 (#51): textarea «Комментарий к заказу» — legacy `#sv-order-comment-textarea`
   (styles.css:1404, ID-специфичность) форсит border-radius:3px поверх класса
   .cart-textarea (--r-md). Возвращаем единый радиус как у select/полей.
   Узкий ID+class селектор (1,1,0) перебивает legacy ID (1,0,0), legacy не трогаем. */
#sv-order-comment-textarea.cart-textarea { border-radius: var(--r-md); }

/* 1.3 (#52): H1 «Корзина» — выровнять по сетке на линию с ЛОГО.
   Лого центрирован в 260px-колонке бренда → его левый край = край контейнера
   (.v2-container, 32px) + (260−220)/2 = +20px. Сдвигаем заголовок на те же 20px,
   чтобы «Корзина» встала в линию с лого и контентом карточки «Ваши покупки». */
.cart-top__title { margin-left: 20px; }

/* 1.1 (#50): кастомный дропдаун для «Область / город».
   Нативный <option>-popup браузер рисует сам — border-radius на него CSS не
   действует (острые углы). Скрываем нативный <select.cart-select> (он остаётся
   для сабмита name="country" и inline onchange — вся CartLoad*-логика цела),
   рисуем скруглённый триггер + скруглённую панель опций. Эстетика — как у
   .kato-suggestions ниже (общий язык дропдаунов корзины). */
.cart-cselect { position: relative; }
.cart-cselect__native {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
/* Триггер наследует вид .cart-select (высота/паддинг/радиус/шеврон/фокус). */
.cart-cselect__trigger {
  display: flex; align-items: center; text-align: left;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.cart-cselect.is-open .cart-cselect__trigger {
  outline: 2px solid var(--c-blue); border-color: var(--c-blue);
}
.cart-cselect__panel {
  position: absolute; top: calc(100% + 4px); left: 0; right: 0; z-index: 9999;
  background: #fff; border: 1px solid var(--c-border, #DDE5EA);
  border-radius: var(--r-md, 12px); box-shadow: var(--sh-md, 0 4px 14px rgba(31,45,61,.08));
  padding: 4px; overflow: hidden auto; max-height: 260px;
}
.cart-cselect__panel[hidden] { display: none; }
.cart-cselect__opt {
  display: block; width: 100%; text-align: left; cursor: pointer;
  padding: 9px 12px; border: 0; background: none; border-radius: var(--r-sm, 8px);
  font: 400 var(--fs-sm, 15px)/1.4 var(--ff-body); color: var(--c-text);
}
.cart-cselect__opt:hover, .cart-cselect__opt.is-active { background: var(--c-blue-light, #EBF7FA); }
.cart-cselect__opt.is-selected { color: var(--c-blue-dark); font-weight: 600; }

/* iter-20 δ-S (2026-06-13) — скрыть нереализованные функции.
   Owner 2026-06-13: «эти два пункта пока скрываем (убираем) — сейчас это
   не реализованно. Бесплатная доставка и промокод».

   1. .cart-ship — free-ship прогресс bar (хардкод порог 150000 ₸, не
      привязан к реальной системе доставки).
   2. .cart-promo — toggle «У меня есть промокод» (не подключён к
      реальной discount-coupon backend).

   DOM остаётся для будущей реализации — просто display:none. JS hooks
   preserved (sv-cart-promo-toggle/form). */
body:has(.cart-grid) .cart-ship,
body:has(.cart-grid) .cart-promo { display: none !important; }

/* ════════════════════════════════════════════════════
   iter-20 δ-O (2026-06-12) — наползание текста при увеличении размера
   ════════════════════════════════════════════════════
   Owner 2026-06-12: «Нужно убрать наползание текста при увеличении размера».
   2 источника overflow на cart-странице:
     1. .cart-item__size select имел fixed-ish width — длинные размеры
        (160x200, 180x200) не помещались, chevron перекрывал текст.
     2. .cart-xs__foot был flex-row (price + «Добавить» button) — на узких
        xsell tracks (~152px) цена «66 500 ₸» переносилась на 2 строки. */

/* (1) Size dropdown — auto grow с разумным min/max */
.cart-main .cart-item__size select {
  min-width: 96px;
  width: auto;
  max-width: 140px;
}

/* iter-20 δ-P (2026-06-12) — leading icons в cart-card__head.
   Per Codex parity audit 2026-06-12_17-36-50 — handoff Cart.jsx имеет
   leading icons перед h2. Добавлен <span class="cart-card__head-icon">
   обёрткой в cart_v2.html / cart_v2_userdata.html / cart_v2_shippay.html. */
.cart-card__head { display: flex; align-items: center; gap: var(--sp-3); }
.cart-card__head-icon {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px;
  border-radius: 8px;
  background: var(--c-blue-light, #EBF7FA);
  color: var(--c-blue, #0E94C8);
  flex-shrink: 0;
}
.cart-card__head-icon svg { width: 18px; height: 18px; }
.cart-card__head h2 { margin: 0; }
/* Note осталось справа (margin-left:auto в δ-I cart-seg) */
.cart-card__head-note { margin-left: auto; }

/* (2) Xsell footer — stack column (цена сверху, кнопка снизу) */
.cart-main .cart-xs__foot {
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 8px !important;
}
.cart-main .cart-xs__price {
  text-align: center;
  white-space: nowrap;
  font-size: 17px;
}
.cart-main .cart-xs__add {
  justify-content: center;
  width: 100%;
}

/* ════════════════════════════════════════════════════
   7 (Owner 2026-06-26, #39) — убрать legacy-рамку обёртки .headless-center-block.
   Она даёт двойной фрейм вокруг «Ваши покупки» + инсет left:48 (padding 20px) +
   неравный зазор (margin-bottom 20px поверх flex-gap .cart-main). Карточки внутри
   сохраняют свою рамку → один аккуратный фрейм, выровненный по левому краю (left:32),
   зазоры = единый flex-gap .cart-main. Scoped body:has(.cart-grid). */
body:has(.cart-grid) .headless-center-block,
body:has(.cart-grid) .headless-center-block.new_cart {
  border: 0 !important;
  border-radius: 0 !important;
  background: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

/* 7.2 (Owner 2026-06-26, #40/#41) — вернуть стандартный зазор между «Ваши данные»
   и «Доставка и оплата». Обе .cart-card лежат в одном <form#sv-cart-acc-form> без
   gap (вне flex-gap .cart-main) → склеивались. Делаем форму flex-колонкой с тем же
   var(--sp-5), что и .cart-main → единый зазор между всеми секциями. */
body:has(.cart-grid) #sv-cart-acc-form {
  display: flex;
  flex-direction: column;
  gap: var(--sp-5);
}

/* 7.4 (Owner 2026-06-26, #42) — колоночный зазор = вертикальному (var(--sp-5)/24px),
   «все зазоры одного размера». Было var(--sp-6)/32px. */
body:has(.cart-grid) .cart-grid { column-gap: var(--sp-5); }

/* ════════════════════════════════════════════════════
   Корзина — доработки Owner 2026-06-26 (раунд 2)
   ════════════════════════════════════════════════════ */
/* 1 (#44): белый фон ВСЕМ заполняемым полям. Видимый размер-контрол — size-picker
   .sz-dd__btn (native select скрыт), количество — .cart-qty; оба резолвили
   --c-bg=серый на /cart/. Плюс чекбоксы допуслуг. */
body:has(.cart-grid) .cart-item__size select,
body:has(.cart-grid) .cart-item__size .sz-dd__btn,
body:has(.cart-grid) .cart-qty,
body:has(.cart-grid) .cart-qty__input,
body:has(.cart-grid) .cart-addon__check { background-color: #fff; }

/* 2 (#45): «Физ.лицо/Юр.лицо» — явный сегмент-контрол. Был track=--c-bg-soft
   (= цвету карты → невидим) + active белый. Делаем track белым с бордером
   (видимый pill) + active синий-залитый (явно выбран). */
body:has(.cart-grid) .cart-seg {
  background: #fff;
  border: 1px solid var(--c-border);
}
body:has(.cart-grid) .cart-seg button.is-on {
  background: var(--c-blue);
  color: #fff;
  box-shadow: none;
}

/* 3 (#46): в «от X ₸/мес» крупнее + красным (под цвет Kaspi-лого) — ТОЛЬКО число X.
   «от» и «₸/мес» остаются как были (15px, --c-text). */
body:has(.cart-grid) .cart-sum__kaspi-txt b #sv-cart-kaspi-monthly {
  font-size: 20px;
  color: var(--c-kaspi);
}

/* #48: зазор СНИЗУ под платёжными лого = зазору СВЕРХУ (20px). Было: лого
   прижаты к низу карты (.cart-sum padding-bottom:0). 4px (paywall) + 16px = 20px. */
body:has(.cart-grid) .cart-sum { padding-bottom: var(--sp-4); }

/* ════════════════════════════════════════════════════
   Owner 2026-07-28: «Спасибо за заказ» / пустая корзина (.cart-empty) —
   legacy-каркас рендерил #left-column (дерево каталога) рядом с
   центрированной карточкой → «поехавшая» страница. Сайдбар прячем,
   грид в одну колонку.
   ════════════════════════════════════════════════════ */
body:has(#main .cart-empty) .container1.fixMinMaxWidth:has(> #left-column + #main) {
  grid-template-columns: 1fr;
}
body:has(#main .cart-empty) #left-column { display: none !important; }
