/*
 * PMIXERS: mobile horizontal overflow fixes.
 * Keep Bootstrap's 12 px row gutters aligned with the page container and
 * keep product gallery controls inside the viewport.
 */

@media (max-width: 767.98px) {
  .main-container > section.container {
    max-width: 100%;
    padding-right: 12px !important;
    padding-left: 12px !important;
  }

  .main-container > section.container .row,
  .main-container > section.container [class*="col-"] {
    min-width: 0;
  }

  .slider-for,
  .slider-nav,
  .slick-list {
    max-width: 100%;
  }

  .slider-for .slick-prev,
  .slider-nav .slick-prev {
    left: 0 !important;
    z-index: 2;
  }

  .slider-for .slick-next,
  .slider-nav .slick-next {
    right: 0 !important;
    z-index: 2;
  }

  #bx-soa-order,
  #bx-soa-order .bx-soa,
  #bx-soa-order .bx-soa-sidebar,
  .basket-items-list-wrapper,
  .basket-items-list-container,
  .basket-checkout-container {
    max-width: 100%;
    min-width: 0;
  }
}