/**
 * Mobile landing page — bounded grids, stacked rows, no runaway growth.
 */

@media (max-width: 1023px) {
  :root {
    --mirror-landing-pad: clamp(0.4rem, 2.5vw, 0.85rem);
    --mirror-landing-gap: clamp(0.4rem, 2vw, 0.75rem);
    --mirror-game-cols: repeat(2, minmax(0, 1fr));
    --mirror-section-gap: clamp(0.5rem, 2vw, 0.85rem);
  }

  html.is-mobile,
  html.is-mobile body,
  html.is-mobile #root,
  html.is-mobile .layout-bc {
    overflow-x: hidden;
    max-width: 100vw;
  }

  .layout-bc,
  .layout-content-holder-bc,
  .layout-footer-holder-bc,
  .hm-row-bc,
  .page-builder-row,
  .page-builder-column {
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .layout-content-holder-bc {
    overflow-x: hidden;
    padding-inline: 0 !important;
  }

  /* Page builder rows — stack columns on mobile */
  .layout-content-holder-bc .hm-row-bc {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-auto-rows: auto !important;
    gap: var(--mirror-section-gap) !important;
    margin-top: var(--mirror-section-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden;
  }

  .layout-content-holder-bc .hm-row-bc > * {
    grid-column: 1 / -1 !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  /* Hero carousel */
  .slider-bc {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    margin: 0 !important;
  }

  .slider-bc .swiper,
  .slider-bc .swiper-wrapper,
  .slider-bc .swiper-slide,
  .slider-bc .sdr-item-holder-bc {
    max-width: 100% !important;
  }

  .slider-bc .swiper-slide,
  .slider-bc .sdr-item-holder-bc {
    max-height: clamp(8rem, 32vw, 11rem) !important;
    overflow: hidden !important;
  }

  .slider-bc .swiper-slide img,
  .slider-bc .sdr-item-holder-bc img {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: clamp(8rem, 32vw, 11rem) !important;
    object-fit: cover;
  }

  /* Casino games — 2-column grid like promo cards */
  .casinoGamesWidget,
  .casinoHorizontalGamesList {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    box-sizing: border-box;
  }

  .casinoHorizontalGamesListHorizontalScroll.horizontal-scroll,
  .casinoGamesWidgetHorizontalScroll.horizontal-scroll,
  .mirror-games-grid-mode {
    overflow: visible !important;
    overflow-x: visible !important;
    width: 100% !important;
    max-width: 100% !important;
    padding-inline: var(--mirror-landing-pad) !important;
    box-sizing: border-box !important;
  }

  .casinoHorizontalGamesListHorizontalScroll .horizontal-scroll__inner,
  .casinoGamesWidgetHorizontalScroll .horizontal-scroll__inner,
  .mirror-games-grid-inner {
    display: grid !important;
    grid-template-columns: var(--mirror-game-cols) !important;
    gap: var(--mirror-landing-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    transform: none !important;
    flex-shrink: 1 !important;
    align-items: stretch !important;
    flex-wrap: wrap !important;
  }

  .casinoHorizontalGamesListHorizontalScroll .horizontal-scroll__inner > *,
  .casinoGamesWidgetHorizontalScroll .horizontal-scroll__inner > * {
    min-width: 0 !important;
    max-width: 100% !important;
    width: auto !important;
  }

  .casinoHorizontalGamesListHorizontalScroll:not(.slideableCasinoGame) .casinoGameItemContent,
  .casinoHorizontalGamesListHorizontalScroll:not(.slideableCasinoGame) .casinoGameItemContent--regular,
  .casinoHorizontalGamesListHorizontalScroll:not(.slideableCasinoGame) .casinoGameItemContent--rect,
  .casinoHorizontalGamesListHorizontalScroll:not(.slideableCasinoGame) .casinoGameItemContent--portrait,
  .casinoGamesWidgetHorizontalScroll .casinoGameItemContent,
  .casinoGamesWidgetHorizontalScroll .casinoGameItemContent--regular {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    overflow: hidden;
    aspect-ratio: 44 / 31;
  }

  .casinoGameItemContent img,
  .casinoGameItemContent picture,
  .casinoGameItemContent svg,
  .casinoGameItemImage {
    display: block;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: cover;
  }

  .casinoGamesWidget .view-see-more,
  .casinoHorizontalGamesList .view-see-more {
    position: relative !important;
    right: auto !important;
    margin-inline-start: auto;
    padding-inline-end: var(--mirror-landing-pad);
  }

  .view-title-more-holder-bc,
  .view-title-holder-bc {
    padding: 0 var(--mirror-landing-pad);
    max-width: 100%;
    box-sizing: border-box;
  }

  /* Winners + side carousel row */
  .casino-winners-block {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box;
  }

  .casino-winners-block .main-tabs-bc {
    height: auto !important;
    min-height: clamp(2.25rem, 10vw, 2.75rem);
  }

  .casino-info-content-winners {
    max-height: clamp(9rem, 42vw, 14rem) !important;
    padding: var(--mirror-landing-pad) !important;
  }

  /* Featured sports / matches */
  .featuredGames {
    width: 100% !important;
    max-width: 100% !important;
    overflow: hidden !important;
    min-height: 0 !important;
    padding-inline: var(--mirror-landing-pad);
    box-sizing: border-box;
  }

  .featuredGamesContent {
    width: 100% !important;
    max-width: 100% !important;
    min-height: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box;
  }

  .mirror-featured-mobile-stack .featuredGamesContent .carouselWrapper,
  .mirror-featured-mobile-stack .featuredGamesContent .swiper,
  .mirror-featured-mobile-stack .featuredGamesContent .swiper-wrapper {
    height: auto !important;
    max-height: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: 0 !important;
    padding-inline: 0 !important;
  }

  .mirror-featured-mobile-stack .featuredGamesContent .swiper-wrapper {
    display: flex !important;
    flex-direction: column !important;
    transform: none !important;
    gap: var(--mirror-landing-gap) !important;
  }

  .mirror-featured-mobile-stack .featuredGamesContent .swiper-slide,
  .featuredGamesContent .swiper-slide {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .featuredGameItem {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
  }

  .featuredGamesContent .carouselWrapper .swiper-button-prev,
  .featuredGamesContent .carouselWrapper .swiper-button-next {
    display: none !important;
  }

  .featuredGames .empty-b-text-v-bc {
    padding: var(--mirror-landing-pad) !important;
    min-height: 0 !important;
  }

  .mirror-featured-fallback {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: var(--mirror-landing-gap) !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    overflow: visible !important;
  }

  .mirror-featured-fallback > div {
    min-width: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  /* Promo strips + images */
  .layout-content-holder-bc img,
  .layout-content-holder-bc picture,
  .layout-content-holder-bc video {
    max-width: 100%;
  }

  .layout-content-holder-bc img:not(.casinoGameItemImage) {
    height: auto;
  }

  .promotion-horizontal-sl-list-bc,
  .horizontal-sl-list-bc {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
    padding: 0 var(--mirror-landing-pad);
    box-sizing: border-box;
    gap: var(--mirror-landing-gap);
  }

  .promotion-horizontal-sl-list-bc .horizontal-sl-item-bc,
  .horizontal-sl-list-bc .horizontal-sl-item-bc {
    flex: 0 0 auto;
  }

  .horizontal-sl-wheel {
    margin-inline: var(--mirror-landing-pad) !important;
    max-width: calc(100% - 2 * var(--mirror-landing-pad)) !important;
  }

  .horizontal-sl-item-bc img,
  .horizontal-sl-wheel img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
  }

  /* Bottom widgets — prevent empty expansion */
  .hm-row-bc .empty-b-text-v-bc,
  .hm-row-bc [class*='Loader'],
  .hm-row-bc [class*='loader'] {
    min-height: 0 !important;
  }

  .ftr-n-item-bc {
    margin-inline: var(--mirror-landing-pad) !important;
    max-width: calc(100% - 2 * var(--mirror-landing-pad)) !important;
  }
}

@media (max-width: 380px) {
  :root {
    --mirror-game-cols: repeat(2, minmax(0, 1fr));
  }
}