/* Mobile containment only — no design/layout redesign.
   Stops page-level horizontal shifting while keeping in-widget scrollers usable. */

html {
  overflow-x: clip;
  max-width: 100%;
  overscroll-behavior-x: none;
}

body {
  overflow-x: clip;
  max-width: 100%;
  width: 100%;
  position: relative;
  overscroll-behavior-x: none;
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

#root,
#kb-root,
.kb-fragment,
.layout-bc,
.layout-content-holder-bc,
.layout-header-holder-bc,
.e-p-body-bc,
.kbseo-page,
.kbseo-surface,
.kbseo-main {
  max-width: 100%;
  box-sizing: border-box;
}

#root,
#kb-root,
.kb-fragment,
.layout-bc,
.kbseo-page {
  overflow-x: clip;
  width: 100%;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

img,
video,
canvas,
svg,
iframe {
  max-width: 100%;
}

img,
video {
  height: auto;
}

/* Keep intentional horizontal scroll inside the widget, not on the page */
.carouselWrapper,
.swiper,
.horizontalSliderWrapper,
.hdr-navigation-scrollable-bc,
.hdr-additional-info,
.main-tabs-bc,
.second-tabs-bc,
.promotion-horizontal-sl-list-bc,
.storiesWidgetWrapper,
.expressWidgetWrapper,
.product-banner-container-bc,
.m-navigation-container-bc,
.nav-menu-container,
.casinoGameSearchResult,
.live-calendar-filter-bc,
.market-filter-bc,
.horizontal-sl-list-bc,
.scroll-start,
.scroll-end {
  max-width: 100%;
}

/* Native/page scroll strips — do not override Swiper's own overflow handling */
.carouselWrapper,
.horizontalSliderWrapper,
.hdr-navigation-scrollable-bc,
.main-tabs-bc,
.second-tabs-bc,
.promotion-horizontal-sl-list-bc,
.storiesWidgetWrapper .horizontalSliderWrapper,
.kb-acc .cards,
.kb-acc .cats,
.kb-acc .tabs {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
}

.swiper {
  max-width: 100%;
}

/* Flex/grid children should shrink instead of forcing page width */
.layout-bc .flex,
.hdr-main-content-bc,
.hdr-user-bc,
.logo-container,
.nav-content-bc,
.footerContainer,
.footerHeader,
.footerInnerLeftCol,
.footerLinkCols,
.product-banner-container-bc,
.casino-game-item-bc,
.sgm-body-bc,
.kbseo-grid,
.kbseo-card {
  min-width: 0;
  max-width: 100%;
}

.hdr-main-content-bc,
.logo-container {
  overflow: hidden;
}

.hdr-logo-bc {
  max-width: min(140px, 38vw);
  height: auto;
}

table {
  display: block;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

pre,
code {
  max-width: 100%;
  overflow-x: auto;
  white-space: pre-wrap;
  word-break: break-word;
}

.popup-holder-bc .popup-inner-bc,
.popup-middleware-bc,
.ds-popup,
.ds-drawer,
.overlay-sliding-wrapper-bc,
.overlay-sliding-w-c-content-slider-bc {
  max-width: 100%;
}

/* Known desktop-captured widths that overflow small phones */
@media (max-width: 480px) {
  [class*="is-mobile"] .bbAiRecBetsItem {
    width: min(370px, calc(100% - 16px)) !important;
    min-width: min(370px, calc(100% - 16px)) !important;
    max-width: 100% !important;
  }

  [class*="is-web"] .ds-popup {
    min-width: 0 !important;
    width: calc(100% - 24px) !important;
    max-width: 100% !important;
  }

  .streamCommentsModal {
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .expressWidgetWrapper .swiper,
  .expressWidgetWrapper .carousel .swiper {
    overflow: hidden !important;
  }

  .expressWidgetWrapper .swiper-slide {
    max-width: 100%;
  }

  .tab-navigation-w-bc .tab-nav-item-bc[aria-label="SLOT"]::before {
    width: min(70px, 18vw) !important;
    height: min(75px, 19vw) !important;
  }

  .kb-acc .bal {
    flex: 0 0 min(311px, calc(100vw - 56px));
  }

  .kb-acc .cards {
    padding-left: max(16px, env(safe-area-inset-left));
    padding-right: max(16px, env(safe-area-inset-right));
  }

  .kb-acc .grid2 {
    grid-template-columns: 1fr 1fr;
    gap: 6px;
  }

  .kb-acc .meth {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .footerContainer,
  .footerContainerWrapper,
  .footerWrapper {
    max-width: 100%;
    overflow-x: clip;
  }

  .product-banner-img-bc,
  .promotionsArticleThumbnail-bc,
  .promotion-details-img {
    max-width: 100% !important;
    height: auto !important;
  }
}

@media (max-width: 360px) {
  .kbim {
    max-width: 100%;
  }

  .kbseo-main,
  .kbseo-sum {
    padding-left: 12px;
    padding-right: 12px;
  }
}

/* Bottom nav / chat floats stay on-screen */
.tab-navigation-w-bc {
  left: 0;
  right: 0;
  width: 100%;
  max-width: 100%;
}

[id^="comm100-float-button"] > div {
  max-width: calc(100vw - 12px);
  bottom: calc(var(--tab-navigation-height, 60px) + 28px + env(safe-area-inset-bottom, 0px)) !important;
  right: 8px !important;
}
