/* ============================================================
   product-page.css
   Rosbotanic P1 — sticky правая колонка карточки товара,
   единая min-height, related products в container 1520.
   Создано: 2026-07-28. STAMP: p1_2026-07-28_1430
   ============================================================ */

/* ---- Sticky правая колонка (product-data) ----
   Работает только на desktop (>=992px), где две колонки видны параллельно.
   На mobile колонки складываются в стек — sticky не нужен. */
@media (min-width: 992px) {

  /* Родитель .row должен позволять sticky (без overflow, align-items не stretch) */
  #product-product .container.product > .row {
    align-items: flex-start;
  }

  /* Внутри #content — вторая .row содержит .image + .product-data */
  #product-product #content > .row {
    align-items: flex-start;
  }

  /* Правая колонка sticky */
  #product-product .product-data {
    position: sticky;
    top: 80px; /* отступ от верха viewport (высота header + запас) */
    align-self: flex-start;
    max-height: calc(100vh - 100px);
    overflow-y: auto;
    /* Скрываем скроллбар в webkit — но оставляем возможность скроллить */
    scrollbar-width: thin;
    scrollbar-color: rgba(46, 42, 36, 0.15) transparent;
  }

  #product-product .product-data::-webkit-scrollbar {
    width: 6px;
  }
  #product-product .product-data::-webkit-scrollbar-track {
    background: transparent;
  }
  #product-product .product-data::-webkit-scrollbar-thumb {
    background: rgba(46, 42, 36, 0.15);
    border-radius: 3px;
  }
  #product-product .product-data::-webkit-scrollbar-thumb:hover {
    background: rgba(46, 42, 36, 0.3);
  }

  /* Единая min-height для визуальной симметрии обеих колонок */
  #product-product .image,
  #product-product .product-data {
    min-height: 600px;
  }
}

/* ---- Related products, Recently viewed, Reviews — в едином container 1520 ---- */

/* rb-tabs (описание/FAQ) и всё что ниже — в общем контейнере */
#product-product .rb-tabs-wrap,
#product-product #rb-panel-related,
#product-product .rb-related,
#product-product .rb-recently-viewed,
#product-product .rb-reviews,
#product-product .rb-related-wrap {
  max-width: var(--rb-container, 1520px);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--rb-space-4, 24px);
  padding-right: var(--rb-space-4, 24px);
  box-sizing: border-box;
}

/* Если related-block/recently-viewed использует другой класс — сохранить ширину */
#product-product .related-block,
#product-product .box.recently-viewed,
#product-product .box.related {
  max-width: var(--rb-container, 1520px);
  margin-left: auto;
  margin-right: auto;
  padding-left: var(--rb-space-4, 24px);
  padding-right: var(--rb-space-4, 24px);
  box-sizing: border-box;
}

/* ---- Mobile: sticky выключен (см. media выше), но общие правки ---- */
@media (max-width: 991px) {
  #product-product .product-data,
  #product-product .image {
    min-height: auto;
    position: static !important;
  }
}