/* ============================================================
   Корзина и оформление заказа (cart.html).

   Язык — тот же, что у лендинга и верхнего меню: кремовый фон,
   белые плитки с волосяной рамкой, скругление 16, зелёный
   #5C7355 для действия, заголовки Onest, текст Manrope.

   Принципы этой переверстки (14.09.2026):
   · одна ось действия — главная кнопка шага всегда в правой
     колонке (на телефоне — в нижней панели .co-bar), а не
     кочует между сайдбаром и низом формы;
   · один вид сводки заказа на шагах 1–4: те же строки, тот же
     итог, та же кнопка, та же подсказка под ней;
   · шаги — один сегментированный трек рядом с заголовком, а не
     четыре таблетки с линиями под ним;
   · плитки одного веса: белая рамка без тени; тень только у
     сводки, чтобы она читалась как «документ к оплате»;
   · служебные пояснения (ТСР, паспорт, подъём) — текстом, без
     собственных коробок, чтобы не спорить с товаром.

   ВСЁ под .az-checkout (класс на <main> страницы cart.html) —
   ни одно правило не протекает на другие страницы. Файл
   подключается ПОСЛЕ components.css и восстанавливает раскладку
   каждого компонента целиком, чтобы старые .cart-* / .checkout-*
   из components.css не просвечивали.
   ============================================================ */

.az-checkout {
  --co-line: #E4DECE;            /* рамка плитки — как у кнопок меню */
  --co-line-soft: #EFEAE0;       /* разделитель внутри плитки */
  --co-green: #3F5239;           /* заливка активного шага = активный пункт меню */
  --co-act: #5C7355;             /* действие: кнопка «Найти» в шапке */
  --co-act-hover: #4C6146;
  --co-muted: #6E6E64;
  --co-faint: #9A9A90;
  --co-ring: 0 0 0 4px rgba(92, 115, 85, .12);
  --co-shadow-lift: 0 18px 36px -20px rgba(43, 43, 38, .22);
  --co-r: 16px;                  /* плитка */
  --co-r-in: 12px;               /* вложенная плашка, поле, карточка выбора */
  --co-r-ctl: 10px;              /* кнопка-таблетка, сегмент количества */
  --co-pad: 24px;
  /* Шапка сайта липкая целиком (полоса 44 + строка 74 + меню 60) —
     липкая колонка итога должна вставать под неё, а не под неё уезжать. */
  --co-sticky: 196px;
  padding-bottom: var(--gap-xl);
  color: var(--ink);
}

/* ── Шапка страницы: крошки, заголовок и шаги одной полосой ─── */
.az-checkout .co-head { padding: 22px 0 0; }
.az-checkout .breadcrumbs { margin-bottom: 10px; font-size: 13.5px; }
.az-checkout .co-head__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px 28px;
  flex-wrap: wrap;
  margin-bottom: 22px;
}
.az-checkout .info-page { padding: 0 0 var(--gap-md); }
.az-checkout .info-page__title {
  font: 600 clamp(26px, 3vw, 32px)/1.1 'Onest', 'Manrope', sans-serif;
  letter-spacing: -0.015em;
  margin: 0;
}
.az-checkout .co-head__steps:empty { display: none; }

/* ── Шаги: один трек из четырёх сегментов ──────────────────── */
.az-checkout .checkout-stepper {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  margin: 0;
  padding: 4px;
  background: #fff;
  border: 1px solid var(--co-line);
  border-radius: 999px;
  flex-wrap: nowrap;
  max-width: 100%;
}
.az-checkout .checkout-stepper__line { display: none; }
.az-checkout .checkout-stepper__step {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 36px;
  padding: 0 14px 0 6px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  font: 700 13.5px 'Manrope', sans-serif;
  color: var(--co-faint);
  white-space: nowrap;
  transition: background .16s, color .16s;
}
.az-checkout .checkout-stepper__num {
  width: 24px;
  height: 24px;
  border: 0;
  border-radius: 999px;
  background: rgba(43, 43, 38, .07);
  color: inherit;
  font: 700 12px 'Manrope', sans-serif;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: none;
}
.az-checkout .checkout-stepper__label,
.az-checkout .checkout-stepper__step.completed .checkout-stepper__label,
.az-checkout .checkout-stepper__step.reachable .checkout-stepper__label { text-decoration: none; color: inherit; }
.az-checkout .checkout-stepper__step.reachable .checkout-stepper__num { color: var(--ink); border: 0; }
.az-checkout .checkout-stepper__step.active {
  background: var(--co-green);
  color: #fff;
}
.az-checkout .checkout-stepper__step.active .checkout-stepper__num {
  background: rgba(255, 255, 255, .22);
  color: #fff;
}
.az-checkout .checkout-stepper__step.completed {
  color: var(--co-green);
  cursor: pointer;
}
.az-checkout .checkout-stepper__step.completed .checkout-stepper__num {
  background: var(--sage-light);
  color: var(--co-green);
}
.az-checkout .checkout-stepper__step.reachable {
  color: var(--ink);
  cursor: pointer;
}
.az-checkout .checkout-stepper__step.completed:hover,
.az-checkout .checkout-stepper__step.reachable:hover {
  background: #F1F6EE;
  color: var(--co-green);
  opacity: 1;
}
.az-checkout .checkout-stepper__step.completed:hover .checkout-stepper__label,
.az-checkout .checkout-stepper__step.reachable:hover .checkout-stepper__label {
  text-decoration: none;
  color: inherit;
}

/* ── Сетка ─────────────────────────────────────────────────── */
.az-checkout .checkout-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 360px;
  gap: 28px;
  align-items: start;
}
.az-checkout .checkout-grid > div { min-width: 0; }
/* Липкой сводке нужна высота ряда, иначе ехать некуда. На шаге 1 сводка сама
   ячейка сетки (её область — весь ряд, липнет), а на шагах 2–4 она лежит
   внутри обычной обёртки, и та при `align-items:start` ровно её высоты: до
   15.09 на «Данных» приходилось мотать страницу вверх, чтобы нажать
   «Продолжить» (владелец: «это глупость»). Обёртки тянем на весь ряд,
   сами сводки оставляем по содержимому. */
.az-checkout .checkout-grid > div { align-self: stretch; }
.az-checkout .checkout-grid > .checkout-side { align-self: start; }
.az-checkout .checkout-side {
  position: sticky;
  top: var(--co-sticky);
  /* Своей прокрутки у сводки больше нет (владелец 25.09.2026: «скроллить
     отдельно страницу и отдельно блок справа — полная жесть»). Сводка выше
     экрана идёт в потоке — класс is-tall ставит cart.html::fitSide, а кнопка
     шага всегда есть и внизу страницы (.checkout-actions__next). */
}
.az-checkout .checkout-side.is-tall { position: static; }

/* ── Плитки одного веса ────────────────────────────────────── */
.az-checkout .checkout-section,
.az-checkout .review-block,
.az-checkout .cart-table,
.az-checkout .co-tile {
  background: #fff;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r);
  box-shadow: none;
  padding: var(--co-pad);
  margin: 0 0 16px;
}
.az-checkout .checkout-section:last-child,
.az-checkout .review-block:last-child { margin-bottom: 0; }
.az-checkout .checkout-section__title,
.az-checkout .review-block__title {
  display: block;
  font: 600 17px/1.25 'Onest', 'Manrope', sans-serif;
  letter-spacing: -0.01em;
  margin: 0 0 16px;
  color: var(--ink);
}
.az-checkout .checkout-section__lead {
  font-size: 13.5px;
  line-height: 1.5;
  color: var(--co-muted);
  margin: -8px 0 16px;
}
.az-checkout .checkout-section__foot {
  font-size: 13px;
  line-height: 1.5;
  color: var(--co-muted);
  margin: 14px 0 0;
}
/* Строка «Нужна помощь? WhatsApp · Telegram · MAX» под заголовком контактов */
.az-checkout .checkout-call {
  font-size: 13px;
  line-height: 1.5;
  color: var(--co-muted);
  margin: -8px 0 16px;
}
.az-checkout .checkout-call a { color: var(--co-act); font-weight: 700; text-decoration: none; }
.az-checkout .checkout-call a:hover { text-decoration: underline; text-underline-offset: 3px; }

/* Сводка на шаге проверки: заголовок + «Изменить» */
.az-checkout .review-block__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}
.az-checkout .review-block__title { margin: 0; }
.az-checkout .review-block__edit {
  height: 30px;
  padding: 0 12px;
  border: 1px solid var(--co-line);
  border-radius: 9px;
  background: #fff;
  color: var(--co-muted);
  font: 700 12.5px 'Manrope', sans-serif;
  cursor: pointer;
  transition: border-color .16s, color .16s, background .16s;
}
.az-checkout .review-block__edit:hover {
  border-color: var(--co-act);
  background: #F1F6EE;
  color: var(--co-green);
}
.az-checkout .review-block__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 8px 0;
  border-top: 1px solid var(--co-line-soft);
  font-size: 14px;
  line-height: 1.4;
}
.az-checkout .review-block__row:first-of-type { border-top: 0; }
.az-checkout .review-block__row--sub { font-size: 13px; }
.az-checkout .review-block__label { color: var(--co-muted); flex: none; }
.az-checkout .review-block__value { font-weight: 600; text-align: right; min-width: 0; overflow-wrap: anywhere; }

/* ── Чипы ──────────────────────────────────────────────────── */
.az-checkout .co-chip {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 22px;
  padding: 0 9px;
  border-radius: 999px;
  font: 700 11.5px 'Manrope', sans-serif;
  white-space: nowrap;
}
.az-checkout .co-chip--stock { background: var(--sage-light); color: var(--co-green); }
.az-checkout .co-chip--order { background: #FBF1DD; color: #8A6414; }
.az-checkout .co-chip--muted { background: var(--sand); color: var(--co-muted); }

/* ── Список товаров (шаг 1) ────────────────────────────────── */
.az-checkout .cart-table { padding: 4px var(--co-pad); }
.az-checkout .cart-item {
  display: grid;
  grid-template-columns: 96px minmax(0, 1fr) auto 112px 32px;
  grid-template-areas: "thumb main qty money remove";
  align-items: center;
  gap: 18px;
  padding: 18px 0;
  border-bottom: 1px solid var(--co-line-soft);
}
.az-checkout .cart-item:last-child { border-bottom: 0; }
.az-checkout .cart-item__thumb {
  grid-area: thumb;
  width: 96px;
  height: 96px;
  border-radius: var(--co-r-in);
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  display: grid;
  place-items: center;
  padding: 6px;
  flex: none;
  overflow: hidden;
}
.az-checkout .cart-item__thumb img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
  mix-blend-mode: multiply;
}
.az-checkout .cart-item__main { grid-area: main; min-width: 0; }
.az-checkout .cart-item__name {
  display: block;
  font: 700 15px/1.35 'Manrope', sans-serif;
  color: var(--ink);
  text-decoration: none;
}
.az-checkout .cart-item__name:hover { color: var(--co-act); }
.az-checkout .cart-item__meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 6px;
}
.az-checkout .cart-item__sku { font-size: 12.5px; color: var(--co-muted); }

/* Служебная строка ТСР: нужна для сверки с выпиской, но кричать не должна —
   текст с иконкой, без собственной коробки */
.az-checkout .cart-item__tsr {
  display: flex;
  align-items: flex-start;
  gap: 7px;
  max-width: 100%;
  margin-top: 8px;
  padding: 0;
  background: none;
  border: 0;
  font-size: 12px;
  line-height: 1.45;
  color: var(--co-muted);
}
.az-checkout .cart-item__tsr img { width: 15px; height: 15px; margin-top: 2px; flex: none; opacity: .85; }
.az-checkout .cart-item__tsr b { color: var(--ink); font-weight: 700; }
.az-checkout .cart-item__tsr > span { min-width: 0; }
.az-checkout .cart-item__tsr-hint { color: var(--co-faint); }
.az-checkout .cart-item__tsr code {
  font-family: ui-monospace, 'SF Mono', Menlo, Consolas, monospace;
  font-size: 11px;
  color: var(--co-muted);
  background: none;
  padding: 0;
  /* код ТРУ — одна длинная цифровая строка: на телефоне вылезала за плитку */
  overflow-wrap: anywhere;
  word-break: break-all;
}
/* Выбранная конфигурация (Caterwil) — и в строке корзины, и в мини-списке */
.az-checkout .co-cfg {
  margin-top: 5px;
  font-size: 12.5px;
  line-height: 1.45;
  color: var(--co-muted);
}

/* Количество — единый сегмент на песочном фоне */
.az-checkout .cart-item__qty {
  grid-area: qty;
  display: inline-flex;
  align-items: center;
  background: var(--sand);
  border: 1px solid transparent;
  border-radius: var(--co-r-ctl);
  overflow: hidden;
  flex: none;
}
.az-checkout .cart-item__qty button {
  width: 34px;
  height: 36px;
  border: 0;
  background: none;
  color: var(--ink);
  font-size: 17px;
  line-height: 1;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background .15s, color .15s;
}
.az-checkout .cart-item__qty button:hover { background: var(--sand-deep); color: var(--co-green); }
.az-checkout .cart-item__qty-val {
  min-width: 30px;
  text-align: center;
  font: 700 14px 'Manrope', sans-serif;
}
.az-checkout .cart-item__money { grid-area: money; min-width: 0; text-align: right; }
.az-checkout .cart-item__sum { font: 800 16px 'Manrope', sans-serif; white-space: nowrap; }
.az-checkout .cart-item__unit {
  margin-top: 3px;
  font-size: 12px;
  color: var(--co-muted);
  white-space: nowrap;
}
.az-checkout .cart-item__remove {
  grid-area: remove;
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 9px;
  background: none;
  color: #B4B4AA;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background .15s, color .15s;
}
.az-checkout .cart-item__remove:hover { background: #FBECE7; color: var(--coral); }

/* Строка под списком: каталог / очистить */
.az-checkout .cart-underline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--gap-sm);
  margin-top: 16px;
  flex-wrap: wrap;
}
.az-checkout .cart-underline__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 38px;
  padding: 0 14px;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-ctl);
  background: #fff;
  font: 700 13.5px 'Manrope', sans-serif;
  color: var(--ink);
  text-decoration: none;
  transition: border-color .16s, background .16s, color .16s;
}
.az-checkout .cart-underline__back:hover { border-color: var(--co-act); background: #F1F6EE; color: var(--co-green); }
.az-checkout .cart-underline__clear {
  border: 0;
  background: none;
  padding: 0;
  font: 600 13px 'Manrope', sans-serif;
  color: var(--co-muted);
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 3px;
  transition: color .15s;
}
.az-checkout .cart-underline__clear:hover { color: var(--coral); }

/* ── «Бесплатно к заказу»: второстепенная плитка на слоновой кости ── */
.az-checkout .co-svc {
  background: var(--ivory);
  border-color: var(--co-line-soft);
  padding: 20px var(--co-pad);
}
.az-checkout .co-svc .checkout-section__title { font-size: 15.5px; margin-bottom: 4px; }
.az-checkout .co-svc__lead {
  font-size: 13px;
  line-height: 1.5;
  color: var(--co-muted);
  margin: 0 0 6px;
}
.az-checkout .co-svc__list { display: block; }
.az-checkout .co-svc__item {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 11px 0;
  border: 0;
  border-top: 1px solid var(--co-line);
  border-radius: 0;
  background: none;
  font-size: 13.5px;
  line-height: 1.45;
  color: var(--co-muted);
  cursor: pointer;
  transition: color .16s;
}
.az-checkout .co-svc__item:first-child { border-top: 0; }
.az-checkout .co-svc__item:hover,
.az-checkout .co-svc__item:has(input:checked) { color: var(--ink); background: none; border-color: var(--co-line); }
.az-checkout .co-svc__item input {
  width: 17px;
  height: 17px;
  margin: 1px 0 0;
  accent-color: var(--co-act);
  flex: none;
  cursor: pointer;
}

/* ── Сводка заказа: одна плитка на всех шагах ──────────────── */
.az-checkout .co-summary,
.az-checkout .checkout-side.checkout-section {
  background: #fff;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r);
  box-shadow: var(--co-shadow-lift);
  padding: var(--co-pad);
  margin: 0;
}
.az-checkout .co-summary__row,
.az-checkout .order-totals__row {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  font-size: 14px;
  padding: 5px 0;
  margin: 0;
}
.az-checkout .co-summary__row span,
.az-checkout .order-totals__row > span:first-child { color: var(--co-muted); }
.az-checkout .co-summary__row b,
.az-checkout .order-totals__row > span:last-child { font-weight: 700; color: var(--ink); white-space: nowrap; }
.az-checkout .order-totals__row--discount > span { color: var(--co-act); }
.az-checkout .co-summary__total,
.az-checkout .order-totals__row--grand {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-top: 10px;
  padding: 14px 0 0;
  border-top: 1px solid var(--co-line-soft);
}
.az-checkout .co-summary__total span,
.az-checkout .order-totals__row--grand > span:first-child {
  font: 700 15px 'Manrope', sans-serif;
  color: var(--ink);
}
.az-checkout .co-summary__total b,
.az-checkout .order-totals__price {
  font: 800 26px/1.1 'Manrope', sans-serif;
  letter-spacing: -0.01em;
  color: var(--ink);
  white-space: nowrap;
}
.az-checkout .co-summary__cta { width: 100%; margin-top: 18px; }
.az-checkout .co-summary__hint,
.az-checkout .checkout-consent {
  margin: 10px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--co-muted);
  text-align: center;
}
.az-checkout .checkout-consent a { color: var(--co-muted); text-decoration: underline; text-underline-offset: 2px; }
.az-checkout .checkout-consent a:hover { color: var(--co-green); }
.az-checkout .co-summary__ship {
  margin: 14px 0 0;
  font-size: 12.5px;
  line-height: 1.5;
  color: var(--co-muted);
}
.az-checkout .co-summary__ship:empty { display: none; }

/* Мини-список позиций в сводке (шаги 2–4): без коробок, через волосяные линии */
.az-checkout .order-items { display: block; margin: 0 0 8px; }
.az-checkout .order-item {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 10px 0;
  border: 0;
  border-top: 1px solid var(--co-line-soft);
  border-radius: 0;
  background: none;
  text-decoration: none;
  color: inherit;
}
.az-checkout .order-item:first-child { border-top: 0; padding-top: 0; }
.az-checkout .order-item__img {
  width: 48px;
  height: 48px;
  border-radius: 9px;
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  object-fit: contain;
  padding: 3px;
  mix-blend-mode: multiply;
}
.az-checkout .order-item__info { min-width: 0; }
.az-checkout .order-item__name {
  font: 600 13px/1.35 'Manrope', sans-serif;
  color: var(--ink);
  white-space: normal;
  overflow: hidden;
  text-overflow: clip;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
a.order-item:hover .order-item__name { color: var(--co-act); }
.az-checkout .order-item__meta { font-size: 12px; color: var(--co-muted); margin-top: 2px; }
.az-checkout .order-item__price { font: 800 13.5px 'Manrope', sans-serif; white-space: nowrap; }
.az-checkout .order-totals { margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--co-line-soft); }
.az-checkout .order-totals__note { margin: 6px 0 0; font-size: 12px; line-height: 1.45; color: var(--co-muted); }
.az-checkout .order-totals__row--grand .order-totals__price { color: var(--ink); }

/* ── Кнопки ────────────────────────────────────────────────── */
.az-checkout .btn { border-radius: 11px; }
.az-checkout .btn--primary {
  height: 48px;
  padding: 0 24px;
  background: var(--co-act);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
}
.az-checkout .btn--primary:hover { background: var(--co-act-hover); }
.az-checkout .btn--primary:disabled,
.az-checkout .btn--primary[disabled] { background: #B9C2B4; opacity: 1; cursor: not-allowed; }
.az-checkout .btn--outline {
  height: 48px;
  padding: 0 22px;
  border: 1px solid var(--co-line);
  background: #fff;
  color: var(--ink);
  font-weight: 700;
}
.az-checkout .btn--outline:hover { border-color: var(--co-act); background: #F1F6EE; color: var(--co-green); }

/* Нижний ряд: только «Назад» — вперёд ведёт кнопка в сводке */
.az-checkout .checkout-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: 20px;
}
.az-checkout .checkout-actions__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 16px;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-ctl);
  background: #fff;
  font: 700 13.5px 'Manrope', sans-serif;
  color: var(--co-muted);
  cursor: pointer;
  transition: border-color .16s, background .16s, color .16s;
}
.az-checkout .checkout-actions__back:hover { border-color: var(--co-act); background: #F1F6EE; color: var(--co-green); }
.az-checkout .checkout-actions__next { min-width: 200px; }

/* ── Формы ─────────────────────────────────────────────────── */
.az-checkout .form-row { margin-bottom: 14px; }
.az-checkout .checkout-section > .form-row:last-child,
.az-checkout .form-row-2 > .form-row,
.az-checkout .form-row-3 > .form-row { margin-bottom: 0; }
.az-checkout .form-row label,
.az-checkout .form-label {
  display: block;
  font: 700 12.5px 'Manrope', sans-serif;
  color: var(--co-muted);
  margin-bottom: 6px;
}
.az-checkout .form-label__count { color: var(--co-faint); font-weight: 500; }
.az-checkout .required { color: var(--coral); }
.az-checkout .form-row-2,
.az-checkout .form-row-3 { display: grid; gap: 12px; }
.az-checkout .form-row-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.az-checkout .form-row-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.az-checkout .form-input {
  display: block;
  width: 100%;
  height: 46px;
  padding: 0 14px;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  font: 500 14.5px 'Manrope', sans-serif;
  color: var(--ink);
  transition: border-color .16s, box-shadow .16s, background .16s;
}
.az-checkout textarea.form-input { height: auto; min-height: 96px; padding: 12px 14px; line-height: 1.5; resize: vertical; }
.az-checkout .form-input::placeholder { color: #A6A69C; }
.az-checkout .form-input:focus { border-color: var(--co-act); box-shadow: var(--co-ring); outline: none; }
.az-checkout .form-input:disabled { background: var(--ivory); color: #A6A69C; }
.az-checkout .form-row.has-error .form-input { border-color: var(--coral); }
.az-checkout .form-error { display: none; font-size: 12px; color: var(--coral); margin-top: 5px; }
.az-checkout .form-row.has-error .form-error { display: block; }
.az-checkout .form-hint { font-size: 12.5px; line-height: 1.5; color: var(--co-muted); }
.az-checkout .city-selected-hint { margin-top: 5px; }

.az-checkout .form-checkbox {
  display: inline-flex;
  align-items: center;
  gap: 9px;
  font: 600 14px 'Manrope', sans-serif;
  color: var(--ink);
  cursor: pointer;
  margin: 0;
  padding: 0;
}
.az-checkout .form-checkbox input[type="checkbox"] {
  width: 17px;
  height: 17px;
  margin: 0;
  accent-color: var(--co-act);
}

/* Подсказки автодополнения города и улицы */
.az-checkout .city-autocomplete { position: relative; }
.az-checkout .city-autocomplete__dropdown {
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 50;
  margin-top: 6px;
  max-height: 240px;
  overflow-y: auto;
  background: #fff;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  box-shadow: 0 18px 40px rgba(43, 43, 38, .12);
}
.az-checkout .city-autocomplete__item {
  padding: 9px 14px;
  font-size: 14px;
  cursor: pointer;
  transition: background .15s;
}
.az-checkout .city-autocomplete__item:hover,
.az-checkout .city-autocomplete__item.is-active { background: var(--sage-light); }
.az-checkout .city-autocomplete__region { color: var(--co-muted); font-size: .85em; }

/* ── Карточки выбора: способ доставки ──────────────────────── */
.az-checkout .delivery-types {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  gap: 10px;
  margin-bottom: 16px;
}
.az-checkout .delivery-type {
  position: relative;
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  grid-template-areas: "icon name" "icon desc" "icon price";
  column-gap: 12px;
  row-gap: 1px;
  align-items: center;
  padding: 12px 14px;
  margin: 0;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  cursor: pointer;
  text-align: left;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.az-checkout .delivery-type input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.az-checkout .delivery-type:hover { border-color: var(--co-act); }
.az-checkout .delivery-type.active {
  border-color: var(--co-act);
  background: var(--sage-light);
  box-shadow: var(--co-ring);
}
.az-checkout .delivery-type__icon {
  grid-area: icon;
  width: 40px;
  height: 40px;
  margin: 0;
  border-radius: 10px;
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  display: grid;
  place-items: center;
  color: var(--co-green);
}
.az-checkout .delivery-type.active .delivery-type__icon { background: #fff; }
.az-checkout .delivery-type__icon svg { width: 20px; height: 20px; }
.az-checkout .delivery-type__name { grid-area: name; font: 700 14px/1.3 'Manrope', sans-serif; margin: 0; }
.az-checkout .delivery-type__desc { grid-area: desc; font-size: 12.5px; line-height: 1.35; color: var(--co-muted); margin: 0; }

/* Цена прямо на плитке способа доставки. До 16.09.2026 её здесь не было:
   покупатель выбирал «до двери» вслепую и узнавал сумму только шагом позже. */
.az-checkout .delivery-type__price {
  grid-area: price;
  margin: 4px 0 0;
  font: 700 15px/1.2 'Manrope', sans-serif;
  color: var(--co-green);
}
.az-checkout .delivery-type__price:empty { display: none; }
.az-checkout .delivery-type__price--wait { font-weight: 500; font-size: 12.5px; color: var(--co-muted); }
.az-checkout .delivery-type__price small {
  display: block;
  margin-top: 1px;
  font: 400 12px/1.3 'Manrope', sans-serif;
  color: var(--co-muted);
}

/* Объяснение цены под плитками способа доставки */
.az-checkout .co-preview { position: relative; margin: -6px 0 16px; }
.az-checkout .co-preview__wait { font-size: 12.5px; line-height: 1.5; color: var(--co-muted); }
/* Пересчёт после правки адреса или галочки подъёма: содержимое остаётся на
   месте (иначе блок теряет высоту и страницу дёргает), метка рисуется поверх и
   в поток не попадает. */
.az-checkout .co-preview--busy > * { opacity: .45; transition: opacity .15s; }
.az-checkout .co-preview--busy::after {
  content: 'Пересчитываем…';
  position: absolute;
  top: 10px;
  right: 12px;
  padding: 2px 10px;
  border-radius: 999px;
  border: 1px solid var(--co-line-soft);
  background: var(--ivory, #FBFAF5);
  font-size: 12px;
  color: var(--co-muted);
}
.az-checkout .delivery-type__price--stale { opacity: .45; }
.az-checkout .co-preview__box {
  padding: 14px 16px;
  border: 1px solid var(--co-line-soft);
  border-radius: var(--co-r-in);
  background: var(--ivory);
}
.az-checkout .co-preview__title { font: 700 13.5px/1.3 'Manrope', sans-serif; margin: 0 0 6px; }
.az-checkout .co-preview__title--sub { margin-top: 12px; }
.az-checkout .co-preview__p { margin: 0 0 8px; font-size: 13px; line-height: 1.55; }
.az-checkout .co-preview__p:last-of-type { margin-bottom: 0; }
.az-checkout .co-preview__list { margin: 0; padding-left: 18px; font-size: 13px; line-height: 1.55; }
.az-checkout .co-preview__list li { margin-bottom: 5px; }
.az-checkout .co-preview__foot { margin: 10px 0 0; font-size: 12px; line-height: 1.5; color: var(--co-muted); }
.az-checkout .co-preview__facts { margin-bottom: 10px; }

/* Заполненный город — нежно-зелёным (владелец 16.09.2026). Поле часто
   заполняется само (по прошлому выбору или по IP), и подсветка показывает
   «мы за вас вписали, поправьте если что» без ещё одной строки текста. */
.az-checkout .form-input.is-filled {
  background: var(--sage-light);
  border-color: var(--co-act);
}
.az-checkout .form-input.is-filled:focus {
  background: #fff;
}

/* «Почему столько» — под кнопку. Блок разросся до семи абзацев, и владелец
   16.09.2026 сказал прямо: слишком много текста. Сразу видно только то, что
   помогает решить (что за груз и чем заплатить меньше), остальное — по клику. */
.az-checkout .co-preview__more { margin-top: 10px; }
.az-checkout .co-preview__more > summary {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  cursor: pointer;
  list-style: none;
  font: 600 13px/1.3 'Manrope', sans-serif;
  color: var(--co-act);
  padding: 4px 0;
}
.az-checkout .co-preview__more > summary::-webkit-details-marker { display: none; }
.az-checkout .co-preview__more > summary::after {
  content: '';
  width: 7px; height: 7px;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg) translate(-1px, -1px);
  transition: transform .16s;
}
.az-checkout .co-preview__more[open] > summary::after { transform: rotate(-135deg) translate(-2px, -2px); }
.az-checkout .co-preview__more > summary:hover { color: var(--co-act-hover); }
.az-checkout .co-preview__more-body { padding-top: 6px; }
.az-checkout .co-preview__more-body .co-preview__p:last-child { margin-bottom: 0; }

/* Снятая разгрузка на тяжёлом грузе — предупреждение весомее обычного */
.az-checkout .co-extra__warn--danger {
  border-color: #D9B08C;
  background: #FDF3EA;
}

/* Служебные пояснения внутри плиток — текстом, без коробок */
.az-checkout .delivery-passport-note,
.az-checkout .payment-note,
.az-checkout .co-note,
.az-checkout .shipment-notice {
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  border-radius: var(--co-r-in);
  padding: 11px 14px;
  font-size: 12.5px;
  line-height: 1.55;
  color: var(--co-muted);
  margin: 0;
}
.az-checkout .delivery-passport-note { margin-top: 16px; }
.az-checkout .payment-note { margin-top: 0; }
/* Кому уходят деньги — блок в сводке под кнопкой (карта / СБП / сертификат) */
.az-checkout .pay-recipient {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--co-line-soft);
  display: flex;
  flex-direction: column;
  gap: 3px;
  font-size: 13px;
  line-height: 1.5;
  color: var(--ink);
}
.az-checkout .pay-recipient[hidden] { display: none; }
.az-checkout .pay-recipient__label { color: var(--co-muted); }
.az-checkout .pay-recipient__req { color: var(--co-muted); font-size: 12.5px; }
.az-checkout .pay-recipient__foot {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 4px 12px;
  margin-top: 6px;
  color: var(--co-muted);
}
.az-checkout .pay-recipient__foot span { display: inline-flex; align-items: center; gap: 6px; }
.az-checkout .pay-recipient a { color: var(--co-act); text-decoration: underline; text-underline-offset: 2px; }
.az-checkout .co-note { font-size: 13.5px; }
.az-checkout .shipment-notice { margin-bottom: 14px; font-size: 13px; }

/* Подъём на этаж (шаг 2): галочка и пояснение под ней одной колонкой */
.az-checkout .delivery-extras {
  display: block;
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--co-line-soft);
}
.az-checkout .delivery-extras__hint { margin: 6px 0 0 26px; }
.az-checkout .co-elevator { margin-top: 8px; }

/* ── Пункты выдачи ─────────────────────────────────────────── */
.az-checkout .terminal-loading {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 0;
  font-size: 13.5px;
  color: var(--co-muted);
}
.az-checkout .terminal-loading__spinner,
.az-checkout .delivery-calc-status__spinner {
  width: 18px;
  height: 18px;
  border: 2px solid var(--co-line);
  border-top-color: var(--co-act);
  border-radius: 999px;
  animation: co-spin .9s linear infinite;
  flex: none;
}
.az-checkout .terminal-empty { padding: 4px 0; }
.az-checkout .terminal-search { margin-bottom: 10px; font-size: 14px; }
.az-checkout .terminal-list {
  display: grid;
  gap: 8px;
  max-height: 360px;
  overflow-y: auto;
  padding-right: 2px;
}
.az-checkout .terminal-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  padding: 12px 14px;
  margin: 0;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  cursor: pointer;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.az-checkout .terminal-option input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--co-act); }
.az-checkout .terminal-option:hover { border-color: var(--co-act); }
.az-checkout .terminal-option.active { border-color: var(--co-act); background: var(--sage-light); box-shadow: var(--co-ring); }
.az-checkout .terminal-option__info { min-width: 0; }
.az-checkout .terminal-option__carrier {
  display: inline-block;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--sand);
  color: var(--co-muted);
  font: 700 11px 'Manrope', sans-serif;
  margin-bottom: 5px;
}
.az-checkout .terminal-option__carrier--dellin { background: #FBECE7; color: #B4462A; }
.az-checkout .terminal-option__carrier--cdek { background: var(--sage-light); color: var(--co-green); }
.az-checkout .terminal-option__carrier--pek { background: #E9EEF7; color: #3C5A99; }
.az-checkout .terminal-option__carrier--kit { background: #FBF1DD; color: #8A6414; }
.az-checkout .terminal-option__name { font: 700 13.5px/1.35 'Manrope', sans-serif; }
.az-checkout .terminal-option__note { font-weight: 500; color: var(--co-muted); }
.az-checkout .terminal-option__address { font-size: 12.5px; line-height: 1.4; color: var(--co-muted); margin-top: 2px; }

/* ── Расчёт доставки (шаг 3) ───────────────────────────────── */
.az-checkout .delivery-calc-status {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  font-size: 14px;
  color: var(--co-muted);
}
.az-checkout .delivery-calc-result {
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  border-radius: var(--co-r-in);
  padding: 14px 16px;
}
.az-checkout .delivery-calc-result--warn { background: #FBF6EA; border-color: #EEDFC0; }
.az-checkout .delivery-calc-result__msg { font-size: 14.5px; line-height: 1.5; margin: 0 0 4px; }
.az-checkout .delivery-calc-result__msg:last-child { margin-bottom: 0; }
.az-checkout .delivery-calc-result__sub { font-size: 13px; line-height: 1.5; color: var(--co-muted); margin: 0; }
.az-checkout .delivery-calc-result__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 16px;
  padding: 5px 0;
  font-size: 14px;
}
.az-checkout .delivery-calc-result__row > span:first-child { color: var(--co-muted); }
.az-checkout .delivery-calc-result__row > span:last-child { text-align: right; font-weight: 700; white-space: nowrap; }
.az-checkout .delivery-calc-result__row--price {
  font-size: 15px;
  margin-top: 8px;
  padding-top: 10px;
  border-top: 1px solid var(--co-line-soft);
}
.az-checkout .delivery-calc-result__row--price > span:last-child { font: 800 18px 'Manrope', sans-serif; }
.az-checkout .delivery-calc-result__note { font-size: 12.5px; line-height: 1.45; color: var(--co-muted); margin-top: 6px; }
.az-checkout .delivery-term-hint { margin-bottom: 12px; }

/* Выбор перевозчика при нескольких вариантах */
.az-checkout .delivery-options { display: grid; gap: 8px; }
.az-checkout .delivery-option {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr) auto;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  margin: 0;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  cursor: pointer;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.az-checkout .delivery-option input { width: 17px; height: 17px; margin: 0; accent-color: var(--co-act); }
.az-checkout .delivery-option:hover { border-color: var(--co-act); }
.az-checkout .delivery-option.active { border-color: var(--co-act); background: var(--sage-light); box-shadow: var(--co-ring); }
.az-checkout .delivery-option__info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.az-checkout .delivery-option__carrier { font: 700 14px 'Manrope', sans-serif; }
.az-checkout .delivery-option__days { font-size: 12.5px; color: var(--co-muted); }
.az-checkout .delivery-option__price { font: 800 15px 'Manrope', sans-serif; white-space: nowrap; }

.az-checkout .shipment-group {
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  padding: 14px;
  margin-bottom: 12px;
}
.az-checkout .shipment-group__title {
  font: 700 12.5px 'Manrope', sans-serif;
  color: var(--co-green);
  margin-bottom: 10px;
}
.az-checkout .shipment-group__title em { font-style: normal; font-weight: 500; color: var(--co-muted); }

/* Платная услуга перевозчика по выбору покупателя (разгрузка) */
.az-checkout .delivery-calc-result + .delivery-extras,
.az-checkout .delivery-options + .delivery-extras,
.az-checkout .shipment-group + .delivery-extras { margin-top: 14px; }
.az-checkout .co-extra {
  display: flex;
  gap: 11px;
  align-items: flex-start;
  padding: 12px 14px;
  margin: 0;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  cursor: pointer;
  transition: border-color .16s, background .16s;
}
.az-checkout .co-extra:hover { border-color: var(--co-act); }
.az-checkout .co-extra:has(input:checked) { background: var(--sage-light); border-color: var(--co-act); }
.az-checkout .co-extra input { width: 17px; height: 17px; margin: 2px 0 0; accent-color: var(--co-act); flex: none; }
.az-checkout .co-extra__body { flex: 1; min-width: 0; }
.az-checkout .co-extra__head { display: flex; justify-content: space-between; gap: 12px; }
.az-checkout .co-extra__name { font-weight: 700; font-size: 14px; }
.az-checkout .co-extra__price { font-weight: 800; white-space: nowrap; font-size: 14px; }
.az-checkout .co-extra__desc { display: block; margin-top: 4px; font-size: 12.5px; line-height: 1.45; color: var(--co-muted); }
/* Вторая строка услуги (подъём на этаж) — та же сетка «название — цена»,
   но потише: это уточнение к разгрузке, а не отдельный выбор. */
.az-checkout .co-extra--plain { cursor: default; background: var(--sage-light); }
.az-checkout .co-extra--plain:hover { border-color: var(--co-line); }
.az-checkout .co-extra__head--sub { margin-top: 4px; font-size: 13px; opacity: .85; }
.az-checkout .co-extra__head--sub .co-extra__name,
.az-checkout .co-extra__head--sub .co-extra__price { font-size: 13px; font-weight: 600; }
/* Предупреждение о тяжёлом грузе. Стоит НАД галочкой и не выключается:
   покупатель должен узнать про вес до дня доставки, а не от водителя. */
.az-checkout .co-extra__warn {
  margin: 0 0 8px;
  padding: 10px 12px;
  border: 1px solid #e3c88a;
  border-left-width: 3px;
  border-radius: var(--co-r-in);
  background: #fdf7e8;
  font-size: 12.5px;
  line-height: 1.5;
  color: #6b5320;
}
.az-checkout .co-extra input:disabled { opacity: .55; cursor: not-allowed; }
.az-checkout .co-extra:has(input:disabled) { cursor: default; }

.az-checkout .delivery-totals {
  margin-top: 14px;
  padding-top: 14px;
  border-top: 1px solid var(--co-line-soft);
}
.az-checkout .delivery-totals__row { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.az-checkout .delivery-totals__name { font-weight: 700; font-size: 14.5px; }
.az-checkout .delivery-totals__price { font: 800 18px 'Manrope', sans-serif; white-space: nowrap; }
.az-checkout .delivery-totals__note { font-size: 12.5px; color: var(--co-muted); margin-top: 5px; line-height: 1.45; }
.az-checkout .delivery-totals__note--discount { color: var(--co-act); font-weight: 600; }

/* Метки «дешевле» / «быстрее» — в песочно-зелёной палитре сайта */
.az-checkout .delivery-label {
  display: inline-block;
  margin-left: 6px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  text-transform: none;
  letter-spacing: 0;
  vertical-align: middle;
}
.az-checkout .delivery-label--cheapest { background: var(--sage-light); color: var(--co-green); }
.az-checkout .delivery-label--fastest { background: #FBF1DD; color: #8A6414; }

/* Расчёт «в тени» для сравнения вариантов — вне экрана, но в потоке для JS */
.az-checkout .co-offscreen { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* ── Способ оплаты (шаг 4) ─────────────────────────────────── */
.az-checkout .payment-methods { display: grid; gap: 10px; }
.az-checkout .payment-option {
  display: grid;
  grid-template-columns: 18px 40px minmax(0, 1fr);
  gap: 14px;
  align-items: center;
  padding: 13px 16px;
  margin: 0;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r-in);
  background: #fff;
  cursor: pointer;
  transition: border-color .16s, background .16s, box-shadow .16s;
}
.az-checkout .payment-option input { width: 17px; height: 17px; margin: 0; accent-color: var(--co-act); }
.az-checkout .payment-option:hover { border-color: var(--co-act); }
.az-checkout .payment-option.active { border-color: var(--co-act); background: var(--sage-light); box-shadow: var(--co-ring); }
.az-checkout .payment-option__icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  display: grid;
  place-items: center;
  color: var(--co-green);
  overflow: hidden;
}
.az-checkout .payment-option.active .payment-option__icon { background: #fff; }
.az-checkout .payment-option__icon svg { width: 20px; height: 20px; }
.az-checkout .payment-option__icon img { max-width: 28px; max-height: 28px; }
.az-checkout .payment-option__logo { width: 28px; height: auto; display: block; }
.az-checkout .payment-option__info { min-width: 0; }
.az-checkout .payment-option__name { font: 700 14px/1.3 'Manrope', sans-serif; }
/* Плашка у СБП — короткая метка «Рекомендуем». Было «Рекомендуем · −10% на
   доставку» (владелец 16.09: длинно, а «·» у минуса читался как точка у знака),
   потом сумма «−1 608 ₽». Итог: в плашке слово, деньги — строкой ниже. */
.az-checkout .payment-option__badge {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px 3px;
  border-radius: 999px;
  background: var(--co-act);
  color: #fff;
  font: 700 11px/1.3 'Manrope', sans-serif;
  letter-spacing: .01em;
  vertical-align: 2px;
  white-space: nowrap;
}
/* На телефоне плашка «Рекомендуем» в строку с заголовком не влезает ни при
   каком кегле: сам заголовок занимает 176 px из 225 доступных, плашке нужно 99.
   Она переносилась и забирала себе целую строку под заголовком (замечание
   владельца 17.09.2026). Укорачиваем ЗАГОЛОВОК, а не плашку: слово «оплата»
   в разделе способов оплаты ничего не добавляет, и без него «СБП по QR-коду»
   с плашкой встают в одну строку даже на 360 px. На компе заголовок полный. */
@media (max-width: 640px) {
  .az-checkout .payment-option__nameopt { display: none; }
  .az-checkout .payment-option__badge { margin-left: 6px; }
}
/* 25.09.2026 (владелец): «Рекомендуем» — справа от названия, не под ним;
   значки крупнее и заливкой, а не тонкой обводкой. */
.az-checkout .payment-option { grid-template-columns: 18px 48px minmax(0, 1fr); }
.az-checkout .payment-option__icon { width: 48px; height: 48px; border-radius: 12px; color: var(--co-green); }
.az-checkout .payment-option__icon svg { width: 26px; height: 26px; }
.az-checkout .payment-option__icon img { max-width: 34px; max-height: 34px; }
.az-checkout .payment-option__logo { width: 34px; }
.az-checkout .payment-option { position: relative; }
.az-checkout .payment-option__name { display: flex; align-items: center; flex-wrap: wrap; gap: 4px 8px; }
.az-checkout .payment-option__ttl { min-width: 0; }
/* Бейдж — в правом верхнем углу плитки на любой ширине: в строке названия
   на телефоне ему не хватало места, и он падал под название. */
.az-checkout .payment-option__badge { position: absolute; top: 12px; right: 12px; margin: 0; }
.az-checkout .payment-option[data-payment="sbp"] .payment-option__name { padding-right: 104px; }
@media (max-width: 640px) {
  .az-checkout .payment-option__badge { top: 11px; right: 10px; padding: 2px 7px 3px; font-size: 10.5px; }
  .az-checkout .payment-option[data-payment="sbp"] .payment-option__name { padding-right: 92px; }
}
/* Состав заказа над способами оплаты — только на телефоне (см. goodsStripHTML) */
.az-checkout .co-goods { display: none; }
@media (max-width: 960px) {
  .az-checkout .co-goods { display: block; margin: 0 0 16px; padding: 2px 12px 10px; border: 1px solid var(--co-line-soft); border-radius: var(--co-r-in); background: var(--ivory); }
  .az-checkout .co-goods .order-items { margin: 0; }
  .az-checkout .co-goods .order-item { padding: 10px 0; }
  .az-checkout .co-goods .order-item:first-child { padding-top: 10px; }
  .az-checkout .co-goods__sum { display: flex; justify-content: space-between; gap: 12px; padding-top: 8px; border-top: 1px solid var(--co-line-soft); font: 600 13px/1.3 'Manrope', sans-serif; color: var(--co-muted); }
  .az-checkout .co-goods__sum b { font-weight: 800; color: var(--ink); }
}
.az-checkout .payment-option__desc { font-size: 12.5px; line-height: 1.45; color: var(--co-muted); margin-top: 3px; }
.az-checkout .payment-option__cards { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.az-checkout .payment-option__cards img { display: block; height: 12px; width: auto; }
.az-checkout .payment-option__cards img[src*="mastercard"] { height: 16px; }
.az-checkout .payment-option__cards img[src*="tpay"] { height: 15px; }

/* Вид ТСР по сертификату (в сводке шага 4) */
.az-checkout .co-cert {
  margin-top: 14px;
  padding: 12px 14px;
  border: 1px solid var(--co-line-soft);
  border-radius: var(--co-r-in);
  background: var(--ivory);
}
.az-checkout .co-cert__title { font: 700 13.5px 'Manrope', sans-serif; margin-bottom: 4px; }
.az-checkout .co-cert__lead { font-size: 12.5px; line-height: 1.45; color: var(--co-muted); margin-bottom: 10px; }
.az-checkout .co-cert__item { margin-bottom: 8px; font-size: 12.5px; }
.az-checkout .co-cert__item:last-child { margin-bottom: 0; }
.az-checkout .co-cert__name { font-weight: 600; }
.az-checkout .co-cert__select {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 5px 0;
  padding: 7px 10px;
  border: 1px solid var(--co-line);
  border-radius: 9px;
  background: #fff;
  font: 500 12.5px 'Manrope', sans-serif;
  color: var(--ink);
}

/* ── Экраны результата ─────────────────────────────────────── */
.az-checkout .order-success {
  max-width: 680px;
  margin: 0 auto;
  background: #fff;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r);
  box-shadow: var(--co-shadow-lift);
  padding: 44px 32px;
  text-align: center;
}
.az-checkout .order-success__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 18px;
  border-radius: 999px;
  background: var(--sage-light);
  color: var(--co-green);
  display: grid;
  place-items: center;
}
.az-checkout .order-success__icon svg { width: 30px; height: 30px; }
.az-checkout .order-success__title {
  font: 600 clamp(22px, 2.4vw, 28px)/1.2 'Onest', 'Manrope', sans-serif;
  letter-spacing: -0.01em;
  margin: 0 0 12px;
}
.az-checkout .order-success__number {
  display: inline-block;
  padding: 5px 14px;
  margin-bottom: 20px;
  background: var(--sage-light);
  border-radius: 999px;
  color: var(--co-green);
  font: 700 15px 'Manrope', sans-serif;
}
.az-checkout .order-success__info {
  text-align: left;
  background: var(--ivory);
  border: 1px solid var(--co-line-soft);
  border-radius: var(--co-r-in);
  padding: 16px 18px;
  margin: 0 0 22px;
}
.az-checkout .order-success__info p { font-size: 14px; line-height: 1.55; margin: 0 0 8px; }
.az-checkout .order-success__info p:last-child { margin-bottom: 0; }
.az-checkout .order-success__info a.js-phone { color: var(--co-act); font-weight: 700; text-decoration: none; }
.az-checkout .order-success__actions {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
}
.az-checkout .order-success__actions .btn { height: 44px; padding: 0 20px; }

/* Оплата по СБП: QR и ожидание */
.az-checkout .sbp-pay {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 14px;
  margin: 20px 0;
}
.az-checkout .sbp-pay__discount { color: var(--co-act); font-weight: 700; margin: 0; }
.az-checkout .sbp-pay__qr {
  width: 248px;
  height: 248px;
  padding: 14px;
  border: 1px solid var(--co-line);
  border-radius: var(--co-r);
  background: #fff;
}
.az-checkout .sbp-pay__text { font-size: 14px; line-height: 1.5; color: var(--co-muted); max-width: 440px; margin: 0; }
.az-checkout .sbp-pay__alt { font-size: 13.5px; color: var(--co-act); text-decoration: underline; text-underline-offset: 3px; }
.az-checkout .sbp-pay__wait {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 14px;
  color: var(--co-muted);
}
.az-checkout .co-spin { animation: co-spin 1.1s linear infinite; }
@keyframes co-spin { to { transform: rotate(360deg); } }

/* Пустая корзина и ошибка загрузки */
.az-checkout .co-empty { text-align: center; padding: var(--gap-xl) 0; color: var(--co-muted); }
.az-checkout .co-empty svg { width: 48px; height: 48px; color: var(--co-green); opacity: .8; }
.az-checkout .co-empty__title {
  font: 600 24px 'Onest', 'Manrope', sans-serif;
  color: var(--ink);
  margin: 14px 0 6px;
}
.az-checkout .co-empty__text { color: var(--co-muted); margin: 0 0 var(--gap-md); }

/* ── Нижняя панель на телефоне: итог + главная кнопка шага ─── */
/* Рисуется JS (mountMobileBar): зеркалит подпись и disabled настоящей
   кнопки в сводке, а клик пробрасывает ей же — логики шага не дублирует.
   На ПК не показывается; прячется и на телефоне, когда настоящая
   кнопка сама в кадре. */
.az-checkout .co-bar {
  display: none;
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1001;
  align-items: center;
  gap: 14px;
  padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
  background: rgba(255, 255, 255, .96);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  border-top: 1px solid var(--co-line);
  box-shadow: 0 -10px 30px rgba(43, 43, 38, .08);
  transform: translateY(0);
  transition: transform .2s ease, opacity .2s ease;
}
.az-checkout .co-bar.is-off { transform: translateY(110%); opacity: 0; pointer-events: none; }
.az-checkout .co-bar__total { display: flex; flex-direction: column; min-width: 0; }
.az-checkout .co-bar__label { font-size: 11.5px; color: var(--co-muted); line-height: 1.2; }
.az-checkout .co-bar__sum { font: 800 19px/1.15 'Manrope', sans-serif; white-space: nowrap; letter-spacing: -0.01em; }
.az-checkout .co-bar__btn { flex: 1 1 auto; height: 46px; padding: 0 18px; margin: 0; white-space: nowrap; }

/* ── Планшет и телефон ─────────────────────────────────────── */
@media (max-width: 1200px) {
  .az-checkout .checkout-grid { grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; }
  .az-checkout .cart-item { grid-template-columns: 88px minmax(0, 1fr) auto 104px 32px; gap: 14px; }
  .az-checkout .cart-item__thumb { width: 88px; height: 88px; }
}
/* Ниже ~1060px строке товара в пять колонок тесно (слева колонка итога):
   название целиком справа от фото, количество и сумма под ним. */
@media (max-width: 1060px) {
  .az-checkout .cart-item {
    grid-template-columns: 88px minmax(0, 1fr) 32px;
    grid-template-areas:
      "thumb main  remove"
      "thumb qty   money";
    gap: 12px 14px;
    padding: 16px 0;
  }
  .az-checkout .cart-item__thumb { align-self: start; }
  .az-checkout .cart-item__qty { justify-self: start; }
  .az-checkout .cart-item__money { justify-self: end; }
  .az-checkout .cart-item__remove { align-self: start; }
}
@media (max-width: 960px) {
  .az-checkout { padding-bottom: 104px; } /* место под .co-bar */
  .az-checkout .checkout-grid { grid-template-columns: minmax(0, 1fr); }
  /* На телефоне колонка идёт в поток: ни липкости, ни своей прокрутки —
     иначе сводка получила бы внутренний скролл на весь экран. */
  .az-checkout .checkout-side { position: static; max-height: none; overflow: visible; }
  .az-checkout .co-bar { display: flex; }
  /* Мини-список в сводке на телефоне не нужен: товары только что были перед глазами */
  .az-checkout .checkout-side .order-items { display: none; }
  .az-checkout .checkout-side .order-totals { border-top: 0; padding-top: 0; }
}
/* Плавающие кнопки сайта (корзина, звонок, мессенджеры, помощник) считают
   свой bottom от --az-buybar-h — той же переменной, которой панель покупки
   на карточке товара их поднимает. Панель корзины делает то же самое. */
@media (max-width: 960px) {
  body.has-co-bar { --az-buybar-h: 78px; }
}
@media (max-width: 760px) {
  .az-checkout { --co-pad: 16px; }
  .az-checkout .co-head { padding-top: 16px; }
  .az-checkout .co-head__row { margin-bottom: 16px; gap: 12px; }
  .az-checkout .info-page { padding-bottom: var(--gap-sm); }
  .az-checkout .cart-table { padding: 2px var(--co-pad); }
  .az-checkout .cart-item { grid-template-columns: 72px minmax(0, 1fr) 32px; gap: 10px 12px; }
  .az-checkout .cart-item__thumb { width: 72px; height: 72px; padding: 4px; }
  .az-checkout .cart-item__name { font-size: 14px; }
  /* Пальцем: сегмент количества не меньше 40px, поле — 16px, чтобы iOS не зумил */
  .az-checkout .cart-item__qty button { width: 40px; height: 40px; }
  .az-checkout .form-input { font-size: 16px; }
  .az-checkout .checkout-stepper__step { height: 34px; }
  .az-checkout .co-summary__total b,
  .az-checkout .order-totals__price { font-size: 23px; }
  .az-checkout .form-row-3 { grid-template-columns: minmax(0, 1fr); }
  .az-checkout .form-row-3 .form-row,
  .az-checkout .form-row-2 .form-row { margin-bottom: 0; }
  .az-checkout .form-row-3 { margin-bottom: 14px; }
  .az-checkout .delivery-types { grid-template-columns: minmax(0, 1fr); }
  .az-checkout .order-success { padding: 32px 18px; }
  .az-checkout .checkout-actions { margin-top: 16px; }
}
@media (max-width: 480px) {
  /* На узком экране подписи шагов не влезают — остаются номера, подпись
     только у активного шага (components.css гасит её целиком — возвращаем). */
  .az-checkout .checkout-stepper__step:not(.active) .checkout-stepper__label { display: none; }
  .az-checkout .checkout-stepper__step:not(.active) { padding: 0 6px; }
  .az-checkout .checkout-stepper__step.active .checkout-stepper__label { display: inline; }
  .az-checkout .form-row-2 { grid-template-columns: minmax(0, 1fr); }
  .az-checkout .form-row-2 .form-row { margin-bottom: 14px; }
  .az-checkout .form-row-2 .form-row:last-child { margin-bottom: 0; }
  /* Чип «Под заказ — срок подтвердит менеджер» шире колонки — пусть переносится */
  .az-checkout .co-chip { height: auto; min-height: 22px; padding: 3px 9px; white-space: normal; line-height: 1.3; }
  .az-checkout .cart-underline { flex-direction: column; align-items: stretch; }
  .az-checkout .cart-underline__back { justify-content: center; }
  .az-checkout .cart-underline__clear { align-self: center; }
}

@media (prefers-reduced-motion: reduce) {
  .az-checkout * { transition-duration: .01ms !important; animation-duration: .01ms !important; }
}

/* ── Окно отказа при оформлении ───────────────────────────────────────────
   Живёт в <body>, а не под .az-checkout (диалог кладётся туда же, где ловит
   Esc и клик по фону), поэтому единственные правила файла без общего префикса.
   Появилось 15.09 взамен системного alert'а: тот выглядел как ошибка браузера
   и не давал покупателю выхода — только «ОК» и та же закрытая дверь. */
.co-issue {
  position: fixed;
  inset: 0;
  z-index: 1200;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
  background: rgba(43, 43, 38, .52);
  backdrop-filter: blur(2px);
  animation: coIssueIn .16s ease-out;
}
.co-issue__card {
  width: min(440px, 100%);
  background: #FFF;
  border: 1px solid #E4DECE;
  border-radius: 16px;
  box-shadow: 0 24px 48px -24px rgba(43, 43, 38, .45);
  padding: 24px;
  animation: coIssueRise .18s ease-out;
}
.co-issue__head { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.co-issue__ic {
  flex: 0 0 auto;
  width: 38px;
  height: 38px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: rgba(92, 115, 85, .12);
  color: #3F5239;
}
.co-issue__ic svg { width: 21px; height: 21px; }
.co-issue__title { margin: 0; font: 700 18px/1.25 'Onest', 'Manrope', sans-serif; color: #2B2B26; }
.co-issue__text { margin: 0 0 20px; font-size: 14.5px; line-height: 1.5; color: #6E6E64; }
.co-issue__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.co-issue__acts .btn { flex: 1 1 160px; justify-content: center; }
@keyframes coIssueIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes coIssueRise { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) {
  .co-issue, .co-issue__card { animation: none; }
}
/* ── Помощь на оформлении: «оставьте телефон — перезвоним» (25.09.2026) ──
   Трое почти-покупателей 24.09 ушли из корзины без контакта. Блок живёт в
   сводке шагов «Корзина» и «Данные», форму подхватывает site.js. */
.co-help { margin-top: 14px; padding: 14px 16px; border: 1px dashed rgba(92,115,85,.45); border-radius: 14px; background: #F6F8F3; }
.co-help__t { font-weight: 700; font-size: 14.5px; color: #2B2B26; margin: 0 0 4px; }
.co-help__d { font-size: 13px; line-height: 1.45; color: #5D6660; margin: 0 0 10px; }
.co-help__row { display: flex; gap: 8px; }
.co-help__row input { flex: 1 1 auto; min-width: 0; height: 42px; border: 1px solid rgba(43,43,38,.18); border-radius: 10px; padding: 0 12px; font: inherit; font-size: 15px; background: #fff; }
.co-help__row input:focus { outline: none; border-color: #5C7355; box-shadow: 0 0 0 3px rgba(92,115,85,.15); }
.co-help__row .btn { flex: 0 0 auto; height: 42px; padding: 0 14px; border-radius: 10px; white-space: nowrap; font-size: 14px; }
.co-help .az-consent--note { margin: 8px 0 0; font-size: 11.5px; line-height: 1.4; color: #8A8A80; }
.co-help .info-page__contact-form-success { padding: 4px 0 0; font-size: 13px; }
.co-help__call { font-size: 13px; color: #5D6660; margin: 10px 0 0; }
.co-help__call a { color: #3F5239; font-weight: 700; text-decoration: none; white-space: nowrap; }
@media (max-width: 480px) { .co-help__row { flex-direction: column; } .co-help__row .btn { width: 100%; } }

/* ── Кнопка шага внизу страницы (25.09.2026) ── */
.az-checkout .checkout-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.az-checkout .checkout-actions__back { order: 1; }
.az-checkout .checkout-actions__next { order: 2; margin-left: auto; min-width: 220px; }
.az-checkout .checkout-actions--single { justify-content: flex-end; margin-top: 18px; }
/* «Вид ТСР по сертификату» под способами оплаты, а не в сводке */
.az-checkout #certVidGate { margin-top: 14px; }
@media (max-width: 960px) { .az-checkout .checkout-actions__next { display: none; } } /* на телефоне кнопку даёт .co-bar */

/* ── Оформление без помех (владелец 30.09.2026) ────────────────────────────
   Запись Вебвизора 29.09: телефон 320×591, на шаге «Данные» шапка, поиск и
   полоса шагов съедали экран над клавиатурой, а плавающие «позвонить» и «?»
   налезали на «Итого» и «Продолжить». Помощь остаётся строкой в самой форме
   (WhatsApp · Telegram · MAX) и телефоном в шапке. */
body.page-checkout #azCallFab,
body.page-checkout #azHelpBtn,
body.page-checkout #floatingCart { display: none !important; }
@media (max-width: 767px) {
  body.page-checkout .az-topbar,
  body.page-checkout #siteHeader .cats-nav,
  body.page-checkout #siteHeader .az-head__search { display: none !important; }
}
.form-optional { font-weight: 400; color: #6E6E64; font-size: .85em; }