/* ============================================================
   VeloSaratov — доработки оформления заказа и корзины. v1.0, 2026-10-25
   Подключается на /order/ и /basket/ (см. init_snippet.php).
   Все новые классы с префиксом vs-, чужие стили не переопределяются,
   кроме явно перечисленных блоков оформления.
   ============================================================ */

/* ---------- согласие на обработку ПДн ---------- */
/* тумблер скрыт: согласие даётся нажатием кнопки «Оформить заказ»,
   текст об этом добавляется скриптом рядом с каждой кнопкой */
.license_order_wrap .licence_block.onoff { display: none !important; }

.vs-consent-note {
  font-size: 12px;
  color: #8a8a8a;
  line-height: 1.4;
  margin: 8px 0 0;
}
.vs-consent-note a { color: #8a8a8a; text-decoration: underline; }

/* ---------- нумерация шагов ---------- */
.vs-step-num { color: #d9232e; font-weight: 700; }

/* ---------- подсветка незаполненного поля ---------- */
.vs-field-err {
  border-color: #d9232e !important;
  box-shadow: 0 0 0 2px rgba(217, 35, 46, 0.18) !important;
}

/* ---------- предупреждение о недоступных товарах в корзине ---------- */
.vs-unav-note {
  background: #fff6e8;
  border: 1px solid #f0c48a;
  color: #8a5a00;
  padding: 10px 14px;
  border-radius: 4px;
  margin: 12px 0;
  font-size: 13px;
  line-height: 1.4;
}

/* ---------- липкая нижняя панель ---------- */
#vs-sticky { display: none; }

@media (max-width: 767px) {
  /* высоту панели проставляет скрипт в --vs-sticky-h: с текстом согласия и
     безопасной зоной iPhone она выше, чем фиксированные 96px */
  body.vs-has-sticky { padding-bottom: calc(var(--vs-sticky-h, 96px) + 12px); }

  /* виджет чата Битрикс24 поднимаем над липкой панелью,
     иначе он перекрывает кнопку «Оформить заказ» */
  body.vs-has-sticky .b24-widget-button-wrapper.b24-widget-button-position-bottom-right {
    bottom: calc(var(--vs-sticky-h, 96px) + 16px) !important;
    right: 12px !important;
  }

  #vs-sticky {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 9999;
    display: block;
    padding: 8px 14px calc(8px + env(safe-area-inset-bottom));
    background: #fff;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.12);
  }
  #vs-sticky.vs-kb { display: none; } /* спрятана, пока открыта клавиатура */

  .vs-sticky-row { display: flex; align-items: center; gap: 12px; }
  .vs-sticky-total { display: flex; flex-direction: column; min-width: 92px; }
  .vs-sticky-label { font-size: 11px; color: #999; line-height: 1.2; }
  /* сумма не должна выдавливать кнопку, если текст окажется длинным */
  .vs-sticky-sum { font-size: 17px; font-weight: 700; color: #222; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 46vw; }

  .vs-sticky-btn {
    flex: 1;
    background: #d9232e;
    color: #fff;
    border: none;
    border-radius: 4px;
    padding: 13px 10px;
    font-size: 15px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.3px;
  }
  .vs-sticky-btn:active { opacity: 0.85; }

  .vs-sticky-msg {
    position: absolute;
    left: 8px; right: 8px;
    bottom: calc(100% + 6px);
    background: #d9232e;
    color: #fff;
    padding: 9px 12px;
    border-radius: 4px;
    font-size: 13px;
    line-height: 1.35;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.25);
  }

  #vs-sticky .vs-consent-note { margin: 5px 0 0; font-size: 10.5px; }

  /* ---------- оформление /order/ на мобильных ---------- */

  /* строка НДС в итогах не нужна покупателю-физлицу */
  .vs-nds { display: none !important; }

  /* список товаров по умолчанию свёрнут */
  #bx-soa-basket .bx-soa-item-table { display: none; }
  #bx-soa-basket.vs-open .bx-soa-item-table { display: table; width: 100%; }
  .vs-items-toggle {
    display: inline-block;
    margin: 6px 0 0;
    background: none;
    border: 1px solid #ddd;
    border-radius: 4px;
    padding: 7px 12px;
    font-size: 13px;
    color: #333;
  }

  /* купоны спрятаны за ссылкой «У меня есть промокод»;
     после открытия показываем их принудительно — компонент вешает инлайновый display */
  body:not(.vs-coupon-open) .bx-soa-coupon { display: none !important; }
  body:not(.vs-coupon-open) #bx-soa-coupon { display: none !important; }
  body.vs-coupon-open #bx-soa-coupon,
  body.vs-coupon-open .bx-soa-coupon { display: block !important; }
  body.vs-coupon-open #bx-soa-coupon input,
  body.vs-coupon-open .bx-soa-coupon input { display: block !important; }
  .vs-promo-toggle {
    display: inline-block;
    margin: 10px 0;
    background: none;
    border: none;
    color: #d9232e;
    text-decoration: underline;
    font-size: 13px;
    padding: 0;
  }

  /* гигантские QR и картинки в описании способов оплаты */
  #bx-soa-paysystem img { max-height: 120px; width: auto; }
}

@media (min-width: 768px) {
  .vs-items-toggle,
  .vs-promo-toggle { display: none; }
}