/* QW 11.11.2026: даты записи на просмотр лентой (решение редизайна m-stage, экран 3/9).
   До 768px: 7 плиток в одну строку, свайп по горизонтали, лента с отступом вровень с полями формы. Размеры в px, как в макете (rem на сайте масштабируется).
   11.11.2026 (v1.1): ширина плитки считается от ширины ленты: видно --n целых плиток и ~треть следующей (подсказка, что дат больше).
   С 768px без изменений: 7 плиток в ряд (pt-quickwins.css, QW24).
   Плавный сдвиг ленты по нажатию — pt-resv-ribbon.js.
   Выбор даты и скрытые поля visit_date / visit_date_label — прежние (main.min.js).
   Откат: из pt-resv-ribbon.css.bak-20261111-204217-peek или убрать подключение pt-resv-ribbon.css/.js из product.tpl / productUA.tpl. */
@media (max-width:991.98px){
  .reservation [data-reservation-dates]{
    display:flex;flex-wrap:nowrap;gap:8px;
    overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;
    scroll-snap-type:x proximity;scrollbar-width:none;
    margin-inline:calc(-1 * var(--p-5, 1.25rem));
    padding:4px var(--p-5, 1.25rem) 6px;
    scroll-padding-inline:var(--p-5, 1.25rem)
  }
  .reservation [data-reservation-dates]::-webkit-scrollbar{display:none}
  .reservation [data-reservation-dates]::after{content:"";flex:0 0 10px}
  .reservation [data-reservation-dates] .reservation__date{
    flex:1 0 84px;min-width:84px;min-height:0;
    padding:10px 6px;gap:2px;border-radius:14px;scroll-snap-align:start
  }
  .reservation [data-reservation-dates] .reservation__date-number{font-size:26px;line-height:1.1}
  .reservation [data-reservation-dates] .reservation__date-title,
  .reservation [data-reservation-dates] .reservation__date-month{font-size:12px;line-height:1.3;white-space:nowrap}
}
@media (min-width:600px) and (max-width:991.98px){
  .reservation [data-reservation-dates]::after{display:none}
}
/* v1.1: --n целых плиток + 0.35 следующей; видимая часть ленты = 100% контента + левый отступ */
@media (max-width:767.98px){
  .reservation [data-reservation-dates]{--pt-rd-n:3}
  .reservation [data-reservation-dates] .reservation__date{
    flex:0 0 calc((100% + var(--p-5, 1.25rem) - var(--pt-rd-n) * 8px) / (var(--pt-rd-n) + .35));
    min-width:76px
  }
}
@media (min-width:460px) and (max-width:767.98px){.reservation [data-reservation-dates]{--pt-rd-n:4}}
@media (min-width:560px) and (max-width:767.98px){.reservation [data-reservation-dates]{--pt-rd-n:5}}
@media (min-width:660px) and (max-width:767.98px){.reservation [data-reservation-dates]{--pt-rd-n:6}}