/* ============================================================================
   v3 · 04 Корзина (Figma 30:2). Разметка — views/cart.js под isV3().
   Вкладка нижнего меню → тёмная шапка. Карточки 20, фото 16, поле экрана 16.
   Селекторы с html.dv2.dv3 — там, где перебиваем правила v2 той же формы.
   ========================================================================== */

/* Высота нижнего меню v3 (11-nav.css): 6 сверху + кнопка 48 + max(8, safe-area) снизу. Было 52 без
   safe-area — плашка «Оформить» заезжала под меню на 10 px, на iPhone — ещё и на полоску «домой». */
html.dv3{ --v3-nav-h:calc(54px + max(8px, env(safe-area-inset-bottom, 0px))); }

/* ── Шапка ─────────────────────────────────────────────────────────────── */
html.dv3 .v3c-head{
  display:flex; align-items:flex-start; justify-content:space-between; gap:12px;
  background:var(--head); color:var(--on-head); padding:20px 16px 18px;
  padding-top:calc(20px + env(safe-area-inset-top, 0px));   /* PWA: не под статус-баром */
}
/* Оттяжка вниз на iPhone (резиновый скролл) открывала над шапкой светлый фон страницы — часы и
   батарея белым по светлому пропадали (02.10.2026). Над шапкой — её же цвет на экран вверх. */
html.dv3 .v3c-head{ position:relative; }
html.dv3 .v3c-head::before{ content:''; position:absolute; left:0; right:0; bottom:100%; height:100vh; background:var(--head); pointer-events:none; }
html.dv3 .v3c-head-txt{ min-width:0; flex:1; }
html.dv3 .v3c-head h1{ margin:0; font-size:24px; font-weight:700; line-height:1.15; color:var(--on-head); }
html.dv3 .v3c-head-sub{
  margin-top:4px; font-size:12px; color:var(--on-head-2);
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
html.dv3 .v3c-head-sub:empty{ display:none; }
html.dv3 .v3c-wipe{
  flex:none; min-height:40px; margin:-6px -4px 0 0; padding:0 4px; border:0; background:none;
  font:inherit; font-size:13px; font-weight:500; color:var(--on-head-2); cursor:pointer;
}
html.dv3 .v3c-wipe[hidden]{ display:none; }
html.dv3 .v3c-wipe:disabled{ opacity:.5; }
html.dv3 .v3c-wipe:focus-visible{ outline:2px solid var(--on-head); outline-offset:2px; border-radius:8px; }

/* ── Районная доставка ─────────────────────────────────────────────────── */
html.dv3 .v3c-district{
  display:flex; align-items:flex-start; gap:12px; margin:10px 16px 0; padding:12px 16px;
  border-radius:var(--v3-r-card); background:var(--green-soft); color:var(--ink);
}
html.dv3 .v3c-district > .v3-i{ width:22px; height:22px; margin-top:1px; color:var(--ink); }
html.dv3 .v3c-district b{ display:block; font-size:13px; font-weight:700; color:var(--green); line-height:1.3; }
html.dv3 .v3c-district span{ display:block; font-size:12px; line-height:1.35; margin-top:2px; }

/* ── Карточка магазина ─────────────────────────────────────────────────── */
html.dv2.dv3 [data-view="cart"] .cart-list{ margin:0; }
html.dv3 .v3c-shop{ margin:10px 16px 0; padding:16px 16px 6px; }
html.dv3 .v3c-shop-head{ display:flex; align-items:center; gap:12px; margin-bottom:6px; }
html.dv3 .v3c-logo{
  flex:none; width:40px; height:40px; border-radius:12px; object-fit:contain;
  background:var(--v3-photo); padding:2px;
}
html.dv3 .v3c-shop-txt{ min-width:0; flex:1; }
html.dv3 .v3c-shop-name{
  display:inline-flex; align-items:center; gap:2px; max-width:100%;
  font-size:15px; font-weight:600; color:var(--ink); text-decoration:none; line-height:1.25;
}
html.dv3 .v3c-shop-name .v3-i{ width:16px; height:16px; color:var(--muted); }
html.dv3 .v3c-shop-txt .v3-sub{ margin-top:2px; font-variant-numeric:tabular-nums; }

/* ── Строка товара ─────────────────────────────────────────────────────── */
html.dv2.dv3 [data-view="cart"] .ci-swipe{ margin:0; }
html.dv2.dv3 [data-view="cart"] .ci-swipe .ci{
  background:var(--paper); border:0; margin:0; padding:10px 0; gap:12px; align-items:center;
}
html.dv3 [data-view="cart"] .ci-swipe-action{ background:var(--red); }
html.dv3 [data-view="cart"] .ci-del-btn .v3-i{ width:22px; height:22px; color:#fff; }

/* Чекбокс 22, радиус 7, зелёный. Зона нажатия — вся метка 28×40. */
html.dv3 .v3c-pick{ position:relative; flex:none; display:grid; place-items:center; width:28px; height:40px; margin-left:-3px; cursor:pointer; }
html.dv3 .v3c-pick input{
  -webkit-appearance:none; appearance:none; margin:0; width:22px; height:22px; cursor:pointer;
  border:2px solid var(--line); border-radius:7px !important; background:var(--paper);
}
html.dv3 .v3c-pick input:checked{ background:var(--green); border-color:var(--green); }
html.dv3 .v3c-pick input:focus-visible{ outline:2px solid var(--green); outline-offset:2px; }
html.dv3 .v3c-pick span{ position:absolute; inset:0; display:grid; place-items:center; pointer-events:none; opacity:0; color:#fff; }
html.dv3 .v3c-pick span .v3-i{ width:14px; height:14px; stroke-width:3; }
html.dv3 .v3c-pick input:checked + span{ opacity:1; }

/* Фото крупнее (72) и от края до края: без полей и рамки, скругление контейнера режет фото */
html.dv2.dv3 [data-view="cart"] .ci-img{
  flex:none; width:72px; height:72px; padding:0; border:0; border-radius:var(--v3-r-photo);
  background:var(--v3-photo); font-size:32px;
}
html.dv2.dv3 [data-view="cart"] .ci-img img{ display:block; width:100%; height:100%; object-fit:cover; border:0; border-radius:0; }
html.dv3 .v3c-svc-ico{ display:grid; place-items:center; width:100%; height:100%; background:var(--green-soft); color:var(--green); }
html.dv3 .v3c-svc-ico .v3-i{ width:24px; height:24px; }

html.dv3 [data-view="cart"] .ci-body{ flex:1; min-width:0; }
html.dv2.dv3 [data-view="cart"] .ci-name{
  font-size:14px; font-weight:500; line-height:1.3; color:var(--ink);
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
html.dv2.dv3 [data-view="cart"] .ci-unit{ font-size:12px; color:var(--v3-sub); margin-top:2px; }
html.dv2.dv3 [data-view="cart"] .ci-unit.is-svc{ color:var(--green); }
html.dv2.dv3 [data-view="cart"] .ci-price{ margin-top:4px; font-size:15px; line-height:1.2; font-variant-numeric:tabular-nums; }
html.dv3 .v3c-now{ font-weight:700; color:var(--ink); white-space:nowrap; }   /* «2 778 ₽» не рвётся перед ₽ */
html.dv3 .v3c-each{ margin-left:6px; font-size:11px; font-weight:400; color:var(--v3-sub); white-space:nowrap; }

/* Зелёный степпер справа */
html.dv2.dv3 [data-view="cart"] .ci-step{
  flex:none; align-self:center; display:flex; align-items:center; height:40px; padding:0;
  background:var(--green-soft); border-radius:var(--v3-r-ctl); color:var(--green);
}
html.dv2.dv3 [data-view="cart"] .ci-step button{
  position:relative; width:40px; height:40px; border:0; border-radius:var(--v3-r-ctl); background:transparent;
  color:var(--green); display:grid; place-items:center; font-size:0; cursor:pointer;
  -webkit-tap-highlight-color:transparent; transition:transform .25s cubic-bezier(.34,1.56,.64,1);
}
html.dv3 [data-view="cart"] .ci-step button:active{ transform:scale(.82); transition-duration:.06s; }
html.dv3 [data-view="cart"] .ci-step button .v3-i{ width:16px; height:16px; stroke-width:2.5; }
html.dv3 [data-view="cart"] .ci-step button:focus-visible{ outline:2px solid var(--green); outline-offset:0; }
html.dv2.dv3 [data-view="cart"] .ci-step b{ display:inline-block; min-width:18px; text-align:center; font-size:15px; font-weight:700; color:var(--green); font-variant-numeric:tabular-nums; }

/* Снятый галочкой: приглушён, подпись «Приедет в следующей доставке» */
html.dv3 .v3c-later{ display:none; margin-top:2px; font-size:11px; color:var(--v3-sub); }
html.dv3 .ci-swipe.is-off .v3c-later{ display:block; }
html.dv3 .ci-swipe.is-off :is(.ci-img, .ci-name, .ci-unit, .ci-price, .ci-step){ opacity:.45; }

/* Закончилось */
html.dv3 [data-view="cart"] .ci-gone{ margin-top:4px; font-size:12px; line-height:1.35; color:var(--terra); }
html.dv3 .v3c-gone-act{ display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
html.dv3 .v3c-gone-act button{
  min-height:32px; padding:0 12px; border:0; border-radius:var(--v3-r-ctl);
  background:var(--bg); color:var(--ink); font:inherit; font-size:13px; font-weight:600; cursor:pointer;
}
html.dv3 .v3c-gone-act button.js-gone-alt{ background:var(--green-soft); color:var(--green); }
html.dv3 .v3c-svc-off{
  flex:none; min-height:40px; padding:0 4px; border:0; background:none;
  font:inherit; font-size:13px; color:var(--muted); cursor:pointer;
}

/* Подсказка про галочки */
html.dv3 .v3c-hint{
  display:flex; align-items:flex-start; gap:8px; margin:6px 0 10px; padding:10px 12px;
  border-radius:var(--v3-r-ctl); background:var(--bg); font-size:12px; line-height:1.4; color:var(--muted);
}
html.dv3 .v3c-hint .v3-i{ width:16px; height:16px; margin-top:1px; }

/* ── «Добавить к заказу?» — лента плиток 84 ───────────────────────────── */
html.dv3 .v3c-upsell{ margin:10px 16px 0; padding:16px 0; border-radius:var(--v3-r-card); background:var(--paper); }
html.dv3 .v3c-up-title{ padding:0 16px; margin-bottom:12px; font-size:17px; font-weight:700; color:var(--ink); }
html.dv3 .v3c-up-row{
  display:flex; gap:10px; overflow-x:auto; padding:0 16px; scrollbar-width:none;
  -webkit-overflow-scrolling:touch; scroll-padding:0 16px;
}
html.dv3 .v3c-up-row::-webkit-scrollbar{ display:none; }
html.dv3 .v3c-up{ flex:0 0 84px; width:84px; min-width:0; cursor:pointer; }
html.dv3 .v3c-up .cu-tile-img{
  width:84px; height:84px; display:grid; place-items:center; font-size:36px; line-height:1;
}
html.dv3 .v3c-up .v3-plus{ position:absolute; right:4px; bottom:4px; width:32px; height:32px; cursor:pointer; }
html.dv3 .v3c-up .v3-plus::after{ content:""; position:absolute; inset:-6px; }   /* зона 44×44 */
html.dv3 .v3c-up .v3-plus .v3-i{ width:18px; height:18px; stroke-width:2.5; }
html.dv3 .v3c-up .v3-plus:focus-visible{ outline:2px solid var(--green); outline-offset:1px; }
html.dv3 .v3c-up-off{ position:absolute; left:4px; top:4px; }
html.dv3 .v3c-up-price{ margin-top:6px; font-size:13px; font-variant-numeric:tabular-nums; color:var(--ink); }
html.dv3 .v3c-up-price b{ font-weight:700; }
html.dv3 .v3c-up-price b.is-deal{ color:var(--red); }
html.dv3 .v3c-up-name{ margin-top:2px; font-size:12px; color:var(--ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }

/* Услуга к корзинке — в стиле карточки */
html.dv3 [data-view="cart"] .svc-offers{ margin:10px 16px 0 !important; }
html.dv3 [data-view="cart"] .svc-offer{ border:0 !important; border-radius:var(--v3-r-card) !important; padding:16px !important; }
html.dv3 [data-view="cart"] .svc-offer .v3-i{ width:20px; height:20px; color:var(--green); }
html.dv3 [data-view="cart"] .js-svc-add{ border-radius:var(--v3-r-ctl) !important; min-height:40px; }

/* ── Итоги ─────────────────────────────────────────────────────────────── */
html.dv2.dv3 [data-view="cart"] .order-totals.v3c-tot{
  margin:10px 16px 0 !important; padding:14px 16px; border:0; border-radius:var(--v3-r-card); background:var(--paper);
}
html.dv2.dv3 [data-view="cart"] .v3c-tot .ot-row{ padding:4px 0; }
html.dv2.dv3 [data-view="cart"] .v3c-tot :is(.ot-label, .ot-value){ font-size:13px; color:var(--ink); }
html.dv2.dv3 [data-view="cart"] .v3c-tot .ot-value{ font-weight:500; white-space:nowrap; }
html.dv2.dv3 [data-view="cart"] .v3c-tot .ot-row.total{ margin-top:8px; padding-top:10px; border-top:1px solid var(--line); }
html.dv2.dv3 [data-view="cart"] .v3c-tot .ot-row.total :is(.ot-label, .ot-value){ font-size:15px; font-weight:700; }

/* ── «Живость»: нажатие кнопок пружинкой (только transform; числа — v3/delight.js) ── */
html.dv3 .v3c-up .v3-plus{ transition:transform .25s cubic-bezier(.34,1.56,.64,1); }
html.dv3 .v3c-up .v3-plus:active{ transform:scale(.85); transition-duration:.06s; }
html.dv3 :is(.v3c-bar, .v3co-bar, .v3o-ps, .v3pay) .v3-btn{ transition:transform .3s cubic-bezier(.34,1.56,.64,1), filter .15s; -webkit-tap-highlight-color:transparent; }
html.dv3 :is(.v3c-bar, .v3co-bar, .v3o-ps, .v3pay) .v3-btn:not(:disabled):active{ transform:scale(.97); filter:brightness(.95); transition-duration:.08s; }
/* Главная кнопка экрана — наш сочный зелёный, а не чёрный */
html.dv3:not(.dk) :is(.v3c-bar, .v3co-bar, .v3o-ps, .v3pay) .v3-btn:not(.is-soft){
  background:linear-gradient(135deg, oklch(.6 .16 150), var(--green)); color:#fff;
  box-shadow:0 8px 20px -10px color-mix(in oklab, var(--green) 80%, transparent); }
@media (prefers-reduced-motion:reduce){
  html.dv3 [data-view="cart"] .ci-step button, html.dv3 :is(.v3c-bar, .v3co-bar) .v3-btn, html.dv3 .v3c-up .v3-plus{ transition:none; }
}

/* ── Нижняя плашка с кнопкой (над нижним меню) ─────────────────────────── */
html.dv3 .v3c-bar{
  position:sticky; z-index:5; bottom:var(--v3-nav-h);
  margin-top:14px;
  /* низ body (78 + safe-area под меню v2) выше меню v3 — в конце прокрутки под плашкой была серая щель */
  margin-bottom:calc(var(--v3-nav-h, 62px) - 78px - var(--safe-bottom, 0px)); padding:10px 12px;
}
html.dv3 .v3c-bar .v3-btn{ width:100%; font-family:inherit; font-variant-numeric:tabular-nums; }
html.dv3 .v3c-bar .v3-btn:disabled{ opacity:.5; cursor:default; justify-content:center; }
html.dv3 .v3c-bar .v3-btn:focus-visible{ outline:2px solid var(--green); outline-offset:2px; }

/* ── Пусто / отложенное ────────────────────────────────────────────────── */
html.dv3 [data-view="cart"] .cart-empty .em{ color:var(--muted); }
html.dv3 [data-view="cart"] .cart-empty .em .v3-i{ width:56px; height:56px; stroke-width:1.5; }
/* Пустая корзина: иконка в мягком зелёном круге с лёгким покачиванием, главная кнопка — зелёная */
html.dv3 .v3c-empty{ padding:56px 24px 24px; text-align:center; }
html.dv3 .v3c-empty .em{ display:grid; place-items:center; width:112px; height:112px; margin:0 auto 18px; border-radius:50%;
  background:var(--green-soft); color:var(--green) !important; }
html.dv3 .v3c-empty .em .v3-i{ width:52px !important; height:52px !important; animation:v3cSway 2.8s ease-in-out infinite; transform-origin:50% 90%; }
@keyframes v3cSway{ 0%,100%{ transform:rotate(0); } 20%{ transform:rotate(-8deg); } 40%{ transform:rotate(6deg); } 60%{ transform:rotate(0); } }
html.dv3 .v3c-empty h2{ margin:0 0 6px; font-size:20px; font-weight:700; color:var(--ink); }
html.dv3 .v3c-empty p{ margin:0 auto 22px; max-width:280px; font-size:14px; line-height:1.45; color:var(--muted); }
html.dv3 .v3c-empty .v3-btn{ width:100%; max-width:280px; margin:0 auto; font-family:inherit; color:#fff;
  background:linear-gradient(135deg, oklch(.6 .16 150), var(--green)); }
@media (prefers-reduced-motion:reduce){ html.dv3 .v3c-empty .em .v3-i{ animation:none; } }
html.dv3 [data-view="cart"] .cart-empty .btn{ border-radius:var(--v3-r-ctl); }
html.dv3 [data-view="cart"] .js-unpark{ border-radius:var(--v3-r-ctl) !important; }

/* Плашка «Набранное раньше отложено»: светлый фон из инлайна в тёмной теме давал светлый текст на светлом */
html.dv3.dk .parked-banner{ background:var(--terra-soft) !important; color:var(--ink) !important; }

/* Плашка «Оформить» всегда прижата к меню: короткая корзина не оставляет её висеть посреди экрана
   с пустым полем ниже. Под неё — запас в конце списка. Десктоп — своя колонка (90-desktop). */
@media (max-width:1023px){
  html.dv3 .v3c-bar{ position:fixed; left:0; right:0; bottom:var(--v3-nav-h); max-width:480px; margin:0 auto; z-index:20; }
  html.dv3 [data-view="cart"] .js-body:has(.v3c-bar){ padding-bottom:calc(var(--v3-nav-h) + 84px - 78px - var(--safe-bottom, 0px)); }
}

/* ── КБЖУ корзины: мягкая сводка, свёрнута по умолчанию (views/cart.js → kbjuV3) ── */
html.dv3 .v3c-kbju{ margin:10px 16px 0; padding:0 16px; border-radius:var(--v3-r-card); background:var(--paper); }
html.dv3 .v3c-kbju > summary{
  display:flex; align-items:center; gap:10px; min-height:52px; list-style:none; cursor:pointer;
  -webkit-tap-highlight-color:transparent; font-size:14px; color:var(--ink);
}
html.dv3 .v3c-kbju > summary::-webkit-details-marker{ display:none; }
html.dv3 .v3c-kbju > summary > .v3-i:first-child{ width:20px; height:20px; flex:none; color:var(--green); }
html.dv3 .v3c-kbju-t{ flex:none; }
html.dv3 .v3c-kbju-t b{ font-weight:700; font-variant-numeric:tabular-nums; }
/* Полоска долей Б/Ж/У по калориям — цвета колец карточки товара (30-product.css). */
html.dv3 .v3c-kbju-s{ display:flex; gap:2px; width:56px; height:6px; margin-left:auto; flex:none; border-radius:99px; overflow:hidden; }
html.dv3 .v3c-kbju-s i{ min-width:3px; }
html.dv3 .v3c-kbju-s .is-p{ background:#e0648a; }
html.dv3 .v3c-kbju-s .is-f{ background:#e9a23b; }
html.dv3 .v3c-kbju-s .is-c{ background:#4f9fd9; }
html.dv3 .v3c-kbju-chev{ width:18px; height:18px; flex:none; color:var(--v3-sub); transition:transform .2s; }
html.dv3 .v3c-kbju[open] .v3c-kbju-chev{ transform:rotate(180deg); }
html.dv3 .v3c-kbju[open] .v3c-kbju-s{ visibility:hidden; }
html.dv3 .v3c-kbju > summary:focus-visible{ outline:2px solid var(--green); outline-offset:2px; border-radius:10px; }
html.dv3 .v3c-kbju .v3-pd-nutr{ padding:2px 0 0; }
html.dv3 .v3c-kbju-note{ margin:10px 0 14px; font-size:12px; line-height:1.4; color:var(--v3-sub); }
@media (prefers-reduced-motion: reduce){ html.dv3 .v3c-kbju-chev{ transition:none; } }