/* Production UI refinements shared by the public member-facing pages. */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

body {
  min-width: 320px;
}

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

#main-component {
  padding-bottom: calc(112px + env(safe-area-inset-bottom, 0px));
}

.home-section,
.home-scroll-row,
.opacity-scroll,
.navigation {
  max-width: 100%;
}

.home-scroll-row,
.opacity-scroll {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  scroll-padding-inline: 12px;
  scroll-snap-type: x mandatory;
}

.home-scroll-row > *,
.opacity-scroll > * {
  min-width: 0;
  scroll-snap-align: start;
}

.lottery-result-card {
  min-height: 168px;
}

.promo-scroll-card > a,
.home-game-tile,
.home-provider-tile {
  height: 100%;
}

.home-game-name,
.home-game-provider,
.home-provider-name,
.mobile-footer-nav__label {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.public-ticker,
.public-ticker-viewport,
.public-ticker-track {
  min-width: 0;
}

.header-brand-logo {
  object-fit: contain;
}

.public-header-actions {
  min-width: 0;
}

.header-mobile-login-button,
.header-register-button,
.pwa-install-button {
  line-height: 1;
}

.mobile-footer-nav {
  contain: layout paint;
}

.mobile-footer-nav__item:focus-visible,
.mobile-footer-nav__center:focus-visible,
.mobile-footer-nav__chat:focus-visible {
  outline: 2px solid var(--primary);
  outline-offset: -2px;
}

.public-floating-actions {
  bottom: calc(96px + env(safe-area-inset-bottom, 0px)) !important;
}

.public-floating-actions__show {
  bottom: calc(102px + env(safe-area-inset-bottom, 0px)) !important;
}

#jackpot-counter {
  font-size: 16px !important;
  letter-spacing: 0;
  line-height: 1.15 !important;
}

#popupSection > div {
  max-height: calc(100dvh - 72px);
}

@media (max-width: 430px) {
  .header-brand-logo {
    max-height: 38px;
    max-width: 152px;
  }

  .header-register-button,
  .header-mobile-login-button {
    min-width: 68px;
    padding-inline: 10px;
  }

  .mobile-footer-nav__label {
    font-size: 9.5px;
  }

  .lottery-result-card {
    width: min(84vw, 236px);
  }

  .home-game-card {
    width: min(43vw, 166px);
  }
}

@media (min-width: 640px) {
  #jackpot-counter {
    font-size: 22px !important;
  }
}

@media (min-width: 768px) {
  #jackpot-counter {
    font-size: 30px !important;
  }
}

@media (min-width: 1024px) {
  #main-component {
    padding-bottom: 0;
  }

  #jackpot-counter {
    font-size: 48px !important;
  }

  .public-floating-actions {
    bottom: 24px !important;
  }

  .public-floating-actions__show {
    bottom: 30px !important;
  }
}

@media (prefers-reduced-motion: reduce) {
  .public-ticker-track,
  .home-game-tile::before,
  .home-provider-tile::before,
  .lottery-animated-card {
    animation: none !important;
  }
}