/* dm-cart.css
   [2026-10-01] v1 — страница корзины по макету редизайна.

   Таблицу корзины рисует скрипт темы (Vue), шаблона для правки нет, поэтому
   всё оформление — стилями по его разметке: .cart-page, .td-image, .td-name,
   .td-qty, .td-total, .td-remove, .cart-total, .buttons, .panel-coupon.

   На телефоне таблица была 710 px в окне 430 и уезжала вбок: цена, количество
   и кнопка удаления прятались в прокрутке. Здесь каждая строка становится
   карточкой, как в карточках товара. */

/* [2026-10-05 dm-footer-2026-10-05] Телефон на странице корзины вернули И в
   шапку, И в подвал: обе части обязаны быть одинаковыми на всём сайте
   (решение Светланы 05.10.2026). Прежнее правило от 01.10 прятало оба, потому
   что связь ушла в липкую полосу внизу, - но полоса только на телефоне, и на
   десктопе корзина оставалась единственной страницей без номера.
   Правило удалено целиком, своих селекторов здесь больше нет. */

/* ---------- общая рамка страницы ---------- */

body.dm-frame-on .cart-page {
  max-width: 1240px;
  margin: 0 auto;
}

body.dm-frame-on .cart-page .table-responsive {
  overflow: visible;   /* внутренняя прокрутка больше не нужна */
  border: 0;
}

/* [2026-10-01] Серая панель вокруг купона, итогов и кнопок — единственный
   блок с прямыми углами среди скруглённых карточек. Скругляем везде. */
body.dm-frame-on .cart-page .cart-bottom {
  border-radius: 16px;
}

/* ---------- строки товаров: карточки ---------- */

body.dm-frame-on .cart-page .cart-table .table,
body.dm-frame-on .cart-page .cart-table .table > tbody,
body.dm-frame-on .cart-page .cart-table .table > tbody > tr,
body.dm-frame-on .cart-page .cart-table .table > tbody > tr > td {
  display: block;
  width: auto;
  border: 0;
  background: none;
}

body.dm-frame-on .cart-page .cart-table .table > thead {
  display: none;   /* подписи колонок на карточках не нужны */
}

body.dm-frame-on .cart-page .cart-table .table > tbody > tr {
  position: relative;
  display: grid;
  grid-template-columns: 92px minmax(0, 1fr) auto;
  grid-column-gap: 14px;
  grid-row-gap: 6px;
  align-items: start;
  background: #FFFFFF;
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 10px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
}

body.dm-frame-on .cart-page .td-image {
  grid-column: 1;
  grid-row: 1 / span 3;
  padding: 0;
}

body.dm-frame-on .cart-page .td-image img {
  width: 92px;
  height: 92px;
  object-fit: contain;
  border: 0;
  border-radius: 10px;
  background: #F7F6F3;
  padding: 4px;
}

body.dm-frame-on .cart-page .td-name,
body.dm-frame-on .cart-page .td-product {
  grid-column: 2 / span 2;
  grid-row: 1;
  padding: 0 28px 0 0;   /* место под крестик */
  text-align: start;
}

body.dm-frame-on .cart-page .td-name a,
body.dm-frame-on .cart-page .td-product a {
  color: #1C2529;
  font-size: 16px;
  font-weight: 600;
  line-height: 1.35;
  text-decoration: none;
}

body.dm-frame-on .cart-page .td-name small,
body.dm-frame-on .cart-page .td-product small {
  display: block;
  color: #5C6A72;
  font-size: 14px;
  line-height: 1.5;
  margin-top: 2px;
}

/* [2026-10-01] Три строки вместо пяти: карточка была слишком высокой.
   Цена за штуку стоит в одной строке с количеством, сумма — под ней. */
body.dm-frame-on .cart-page .td-qty {
  grid-column: 2;
  grid-row: 3 / span 2;
  align-self: center;
  color: #5C6A72;
  font-size: 15px;
  padding: 0;
  text-align: start;
}

/* цена за штуку — напротив счётчика, с подписью, чтобы два числа
   в карточке не путались между собой */
body.dm-frame-on .cart-page .td-price {
  grid-column: 3;
  grid-row: 3;
  align-self: end;
  color: #5C6A72;
  font-size: 14px;
  padding: 0;
  text-align: end;
  white-space: nowrap;
}

/* Подпись стоит в строку с числом — так карточка не растёт.
   На иврите подпись и число в одной строке держать нельзя: шекель
   перескакивает внутрь числа, поэтому там подпись уходит строкой выше. */
body.dm-frame-on .cart-page .td-price::before,
body.dm-frame-on .cart-page .td-total::before {
  display: inline;
  direction: ltr;
  unicode-bidi: isolate;
}

/* [2026-10-01] На иврите строки «плясали»: подпись уходила блоком влево,
   число вставало по другому краю. Держим весь столбец по правому краю —
   направление страницы, а число внутри остаётся слитным куском слева
   направо, поэтому шекель не влезает внутрь цифр. */
html[lang="he"] body.dm-frame-on .cart-page .td-price::before,
html[lang="he"] body.dm-frame-on .cart-page .td-total::before,
html[dir="rtl"] body.dm-frame-on .cart-page .td-price::before,
html[dir="rtl"] body.dm-frame-on .cart-page .td-total::before {
  display: inline;
  direction: rtl;
  unicode-bidi: normal;
}

html[dir="rtl"] body.dm-frame-on .cart-page .td-name,
html[dir="rtl"] body.dm-frame-on .cart-page .td-product,
html[dir="rtl"] body.dm-frame-on .cart-page .td-model {
  direction: rtl;
  unicode-bidi: isolate;
  text-align: start;   /* справа, по краю названия */
}

/* цены стоят по внешнему краю карточки — на иврите это левый край,
   подпись и число одной строкой, как на русском */
html[dir="rtl"] body.dm-frame-on .cart-page .td-price,
html[dir="rtl"] body.dm-frame-on .cart-page .td-total {
  direction: rtl;
  unicode-bidi: isolate;
  text-align: end;
  white-space: nowrap;
}

body.dm-frame-on .cart-page .td-price::before {
  content: 'Цена за шт. ';
}

html[lang="he"] body.dm-frame-on .cart-page .td-price::before,
html[dir="rtl"] body.dm-frame-on .cart-page .td-price::before {
  content: 'מחיר ליחידה ';
}

html[lang="en"] body.dm-frame-on .cart-page .td-price::before {
  content: 'Price each ';
}

body.dm-frame-on .cart-page .td-total::before {
  content: 'Итого ';
  color: #5C6A72;
  font-size: 14px;
  font-weight: 400;
}

html[lang="he"] body.dm-frame-on .cart-page .td-total::before,
html[dir="rtl"] body.dm-frame-on .cart-page .td-total::before {
  content: 'סה״כ ';
}

html[lang="en"] body.dm-frame-on .cart-page .td-total::before {
  content: 'Total ';
}

body.dm-frame-on .cart-page .td-total {
  grid-column: 3;
  grid-row: 4;
  align-self: end;
  color: #1C2529;
  font-size: 19px;
  font-weight: 700;
  padding: 0;
  text-align: end;
  white-space: nowrap;
  direction: ltr;          /* цена не ломается на иврите */
  unicode-bidi: isolate;
}

/* [2026-10-01] Артикул стоит сразу под названием и подписан словом «Модель»:
   внизу напротив цены он читался как ещё одно число. Подпись — через языки
   страницы, потому что разметку корзины рисует скрипт темы. */
body.dm-frame-on .cart-page .td-model {
  grid-column: 2 / span 2;
  grid-row: 2;
  color: #8A969C;
  font-size: 13px;
  padding: 0;
  text-align: start;
}

body.dm-frame-on .cart-page .td-model:not(:empty)::before {
  content: 'Модель ';
}

html[lang="he"] body.dm-frame-on .cart-page .td-model:not(:empty)::before,
html[dir="rtl"] body.dm-frame-on .cart-page .td-model:not(:empty)::before {
  content: 'דגם ';
}

html[lang="en"] body.dm-frame-on .cart-page .td-model:not(:empty)::before {
  content: 'Model ';
}

/* выбранные опции шли через <br> и растягивали карточку на пять строк */
body.dm-frame-on .cart-page .td-name br,
body.dm-frame-on .cart-page .td-product br {
  display: none;
}

body.dm-frame-on .cart-page .td-name small,
body.dm-frame-on .cart-page .td-product small {
  margin-top: 1px;
  line-height: 1.4;
}

/* ---------- количество ---------- */

body.dm-frame-on .cart-page .td-qty .input-group {
  display: flex;
  align-items: center;
  gap: 12px;   /* [2026-10-01] на экране кнопки стояли слипшись */
  max-width: none !important;
}

body.dm-frame-on .cart-page .td-qty .stepper {
  position: relative;
  display: flex;
  align-items: center;
  flex: 0 0 104px;
  width: 104px;   /* [2026-10-01] было 86: цифра упиралась в стрелки */
  height: 42px;
  border: 1px solid #D7DEE1;
  /* полукруглая, как просила Светлана 01.10 */
  border-radius: 999px;
  background: #FFFFFF;
  overflow: hidden;
}

/* цифра стоит по центру поля, а не прижата к краю: отступы одинаковые с двух
   сторон, высота во всю коробку — иначе она «висела» у верхней стрелки */
body.dm-frame-on .cart-page .td-qty .stepper input.form-control {
  width: 100%;
  height: 100%;
  border: 0;
  box-shadow: none;
  background: none;
  color: #1C2529;
  font-size: 17px;
  font-weight: 600;
  line-height: 1;
  text-align: center;
  padding-block: 0;
  padding-inline: 26px;
  direction: ltr;
}

/* стрелки темы стоят absolute на 70 px — на иврите они накрывали цифру */
body.dm-frame-on .cart-page .td-qty .stepper > span {
  position: absolute;
  inset-inline-end: 0;
  top: 0;
  left: auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  width: 24px;
  height: 100%;
  border-inline-start: 1px solid #ECEFF1;
}

body.dm-frame-on .cart-page .td-qty .stepper > span .fa {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #5C6A72;
  font-size: 13px;
  cursor: pointer;
}

body.dm-frame-on .cart-page .td-qty .input-group-btn {
  display: flex;
  gap: 6px;
}

body.dm-frame-on .cart-page .td-qty .input-group-btn .btn {
  width: 42px;
  height: 42px;
  min-height: 0;
  border: 1px solid #D7DEE1;
  /* !important: общее правило кнопок темы ставит свой радиус */
  border-radius: 50% !important;
  background: #FFFFFF;
  color: #5C6A72;
  font-size: 14px;
  padding: 0;
}

body.dm-frame-on .cart-page .td-qty .input-group-btn {
  gap: 10px;
}

body.dm-frame-on .cart-page .td-qty .input-group-btn .btn-primary {
  border-color: #146678;
  background: #146678;
  color: #FFFFFF;
}

body.dm-frame-on .cart-page .td-qty .input-group-btn .btn-danger {
  background: #FFFFFF;
  border-color: #E6D2D0;
  color: #C8372D;
}

/* крестик — в угол карточки, как у значков на карточках товара */
body.dm-frame-on .cart-page .td-remove {
  position: absolute;
  top: 10px;
  inset-inline-end: 10px;
  padding: 0;
}

body.dm-frame-on .cart-page .td-remove button,
body.dm-frame-on .cart-page .cart-remove {
  width: 30px;
  height: 30px;
  border: 0;
  border-radius: 50%;
  background: #F2F4F5;
  color: #5C6A72;
  font-size: 14px;
  line-height: 30px;
  padding: 0;
}

body.dm-frame-on .cart-page .td-remove button:hover,
body.dm-frame-on .cart-page .cart-remove:hover {
  background: #FDECEC;
  color: #C8372D;
}

/* ---------- купон и подарочный сертификат ---------- */

body.dm-frame-on .cart-page .cart-panels .panel {
  background: #FFFFFF;
  border: 0;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  margin-bottom: 10px;
}

body.dm-frame-on .cart-page .cart-panels .panel-heading {
  background: none;
  border: 0;
  padding: 0;
}

body.dm-frame-on .cart-page .cart-panels .panel-title > a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 16px;
  color: #1C2529;
  font-size: 16px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  text-decoration: none;
}

body.dm-frame-on .cart-page .cart-panels .panel-body {
  border-top: 1px solid #ECEFF1;
  padding: 14px 16px 16px;
}

/* ---------- итоги ---------- */

body.dm-frame-on .cart-page .cart-total {
  background: #FFFFFF;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  padding: 6px 16px;
  margin: 0 0 12px;
}

/* [2026-10-01] У темы таблица с классом table-bordered: внутри белой карточки
   получалась вторая серая рамка вокруг «Суммы» и «Итого». Снимаем её целиком. */
body.dm-frame-on .cart-page .cart-total .table,
body.dm-frame-on .cart-page .cart-total tbody,
body.dm-frame-on .cart-page .cart-total tr {
  display: block;
  width: 100%;
  margin: 0;
  background: none;
}

body.dm-frame-on .cart-page .cart-total .table,
body.dm-frame-on .cart-page .cart-total .table-bordered,
body.dm-frame-on .cart-page .cart-total .table > tbody > tr,
body.dm-frame-on .cart-page .cart-total .table > tbody > tr > td,
body.dm-frame-on .cart-page .cart-total .table-bordered > tbody > tr > td {
  border: 0 !important;
}

body.dm-frame-on .cart-page .cart-total tr {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 0;
}

body.dm-frame-on .cart-page .cart-total td {
  border: 0;
  padding: 0;
  color: #5C6A72;
  font-size: 15px;
  text-align: start;
}

body.dm-frame-on .cart-page .cart-total td:last-child {
  color: #1C2529;
  font-size: 17px;
  font-weight: 600;
  text-align: end;
  direction: ltr;
  unicode-bidi: isolate;
}

body.dm-frame-on .cart-page .cart-total td strong {
  font-weight: 500;
}

/* последняя строка — «Итого»: крупно, это главное число страницы */
body.dm-frame-on .cart-page .cart-total tr:last-child td {
  color: #1C2529;
  font-size: 17px;
  font-weight: 700;
}

body.dm-frame-on .cart-page .cart-total tr:last-child td:last-child {
  font-size: 24px;
}

/* ---------- кнопки ---------- */

body.dm-frame-on .cart-page .buttons {
  display: flex;
  flex-direction: column-reverse;   /* главная кнопка сверху */
  gap: 10px;
  margin-top: 4px;
}

body.dm-frame-on .cart-page .buttons .pull-left,
body.dm-frame-on .cart-page .buttons .pull-right {
  float: none;
  width: 100%;
}

body.dm-frame-on .cart-page .buttons .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 54px;
  border-radius: 12px;
  font-size: 17px;
  font-weight: 600;
  letter-spacing: 0;
  text-transform: none;
  padding: 0 18px;
}

body.dm-frame-on .cart-page .buttons .btn-primary {
  background: #146678;
  border: 0;
  color: #FFFFFF;
}

body.dm-frame-on .cart-page .buttons .btn-primary:hover {
  background: #0F5260;
}

body.dm-frame-on .cart-page .buttons .btn-default {
  background: #FFFFFF;
  border: 1px solid #D7DEE1;
  color: #1C2529;
}

/* ---------- калькулятор доставки на странице корзины ---------- */

body.dm-frame-on .cart-page .dmc-wrap {
  background: #FFFFFF;
  border-radius: 14px;
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05);
  padding: 16px;
  margin-bottom: 12px;
}

/* ---------- телефон ---------- */

@media (max-width: 767px) {
  body.dm-frame-on .cart-page {
    padding-inline: 16px;
  }

  /* [2026-10-01] На телефоне коробку счётчика ужимало до 40 px чужое правило
     из общей части, и цифра упиралась в стрелки. Держим свой размер — но
     скромнее, чем на экране: вся группа должна влезать рядом с фото. */
  body.dm-frame-on .cart-page .cart-table .td-qty {
    min-width: 0;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .input-group {
    gap: 6px;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .stepper {
    flex: 0 0 88px !important;   /* в гибкой строке коробку сжимало до 36 px */
    width: 88px !important;
    min-width: 88px !important;
    height: 40px !important;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .stepper input.form-control {
    height: 100% !important;
    font-size: 16px !important;
    /* отступы одинаковые: цифра стоит по центру поля */
    padding-inline: 22px !important;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .stepper > span {
    width: 22px;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .input-group-btn .btn {
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 50%;
  }

  body.dm-frame-on .cart-page .cart-table .td-qty .input-group {
    gap: 8px;
  }

  /* [2026-10-01] На телефоне счётчик и цены в одной строке не умещались —
     группа наезжала на числа. Цена за штуку уходит своей строкой,
     внизу остаются счётчик и сумма позиции. */
  body.dm-frame-on .cart-page .cart-table .table > tbody > tr {
    grid-template-columns: 82px auto minmax(0, 1fr);
  }

  body.dm-frame-on .cart-page .td-price {
    grid-column: 2 / span 2;
    grid-row: 3;
    align-self: start;
    text-align: start;
  }

  body.dm-frame-on .cart-page .td-qty {
    grid-column: 2;
    grid-row: 4;
    align-self: center;
  }

  /* рядом со счётчиком «Итого» обрезалось — даём ему свою строку */
  body.dm-frame-on .cart-page .td-total {
    grid-column: 2 / span 2;
    grid-row: 5;
    align-self: center;
    text-align: end;
  }

  body.dm-frame-on .cart-page .td-image img {
    width: 82px;
    height: 82px;
  }

  /* липкая полоса связи не должна накрывать последнюю кнопку */
  body.dm-frame-on .cart-page {
    padding-bottom: 86px;
  }
}

/* ---------- широкий экран: товары слева, итоги справа ---------- */

@media (min-width: 992px) {
  body.dm-frame-on .cart-page {
    display: grid;
    grid-template-columns: minmax(0, 1fr) 380px;
    grid-column-gap: 24px;
    align-items: start;
  }

  body.dm-frame-on .cart-page .cart-table {
    grid-column: 1;
  }

  body.dm-frame-on .cart-page .cart-bottom {
    grid-column: 2;
    position: sticky;
    top: 96px;
    /* [2026-10-01] серая панель вокруг итогов была с прямыми углами —
       единственный острый блок на странице среди скруглённых карточек */
    border-radius: 16px;
    overflow: hidden;
  }

  body.dm-frame-on .cart-page .cart-bottom .panels-total,
  body.dm-frame-on .cart-page .cart-bottom .row {
    width: 100%;
    margin: 0;
  }

  body.dm-frame-on .cart-page .cart-table .table > tbody > tr {
    grid-template-columns: 110px minmax(0, 1fr) auto;
    padding: 16px 18px;
  }

  body.dm-frame-on .cart-page .td-image img {
    width: 110px;
    height: 110px;
  }
}


/* ==================================================================
   [2026-10-05 dm-mobcart-2026-10-05] Телефонная корзина: воздух и единый кегль.

   Было: в одной карточке соседствовали 12.5, 17, 22.5, 24 и 28.5 px — страница
   выглядела рваной, кадр прижимался к названию, «Итого» наезжало на кнопки.
   Кегли раздувал множитель 1.5 из dm-mobile-type.css, поэтому здесь !important.
   Правила живут только на странице корзины (body.checkout-cart) и только до
   767 px — десктоп не трогаем.
   ================================================================== */
@media (max-width: 767px) {

  /* кадр и название: раздвигаем */
  body.checkout-cart .cart-page .cart-table .td-image,
  body.checkout-cart .cart-page tbody td.td-image {
    padding-inline-end: 14px !important;
  }

  body.checkout-cart .cart-page tbody tr {
    padding: 14px !important;
  }

  /* единый средний кегль: название чуть крупнее, всё остальное одинаково */
  body.checkout-cart .cart-page tbody td,
  body.checkout-cart .cart-page tbody td a,
  body.checkout-cart .cart-page tbody td span,
  body.checkout-cart .cart-page tbody td small,
  body.checkout-cart .cart-page .cart-total td,
  body.checkout-cart .cart-page .cart-total span {
    font-size: 15px !important;
    line-height: 1.45 !important;
  }

  body.checkout-cart .cart-page tbody td.td-name > a,
  body.checkout-cart .cart-page tbody td.td-name a:first-child {
    font-size: 16px !important;
    line-height: 1.35 !important;
  }

  /* «Итого» в строке товара: своя строка с отступом, чтобы не лезло под кнопки */
  body.checkout-cart .cart-page tbody td.text-right,
  body.checkout-cart .cart-page tbody td.td-total {
    font-size: 16px !important;
    margin-top: 10px !important;
    clear: both;
  }

  /* заголовки серых панелей (купон, расчёт доставки) были 28.5 px */
  body.checkout-cart .cart-page .panel-coupon .panel-title,
  body.checkout-cart .cart-page .panel-heading,
  body.checkout-cart .cart-page .panel-title,
  body.checkout-cart .cart-page .panel-title a,
  body.checkout-cart .cart-page .accordion-toggle {
    font-size: 17px !important;
    line-height: 1.35 !important;
  }

  /* строка количества и кнопки: не слипаются */
  body.checkout-cart .cart-page tbody td.td-qty,
  body.checkout-cart .cart-page tbody .stepper-group {
    gap: 10px !important;
    margin-top: 10px !important;
  }
}