/*
 * Safe CLS / GSC Field Fixes
 *
 * This file intentionally avoids broad min-height/aspect-ratio rules that can distort
 * the UI. It reserves space only for known dynamic regions and keeps media natural.
 */

html {
  overflow-y: scroll;
  scroll-behavior: smooth;
}

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

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

img {
  height: auto;
}

.img-responsive {
  display: block;
  max-width: 100%;
  height: auto;
}

/* Header/nav stability without forcing oversized bars. */
.navigation {
  min-height: 78px;
}

.navigation .main_display,
.navigation .navbar,
.navigation .navbar-header {
  min-height: 0;
}

.header-logo,
.logoOuter,
.logoOuter a {
  display: inline-flex;
  align-items: center;
}

/* Desktop header should show only the top logo; navbar-brand is the mobile logo. */
.navigation .navbar-brand {
  display: none !important;
}

.header-logo img,
.logoOuter img,
img.logo {
  width: auto;
  max-width: 180px;
  height: auto;
  max-height: 48px;
  object-fit: contain;
}

.navbar-brand img {
  width: auto;
  max-width: 170px;
  height: auto;
  max-height: 44px;
  object-fit: contain;
}

@media (max-width: 767px) {
  .navigation .navbar-brand {
    display: inline-flex !important;
    align-items: center;
  }
}

/* Hero/banner stability: reserve reasonable space but allow natural layout. */
.banner_block,
.gradientBanner,
.banner_text,
.state-lotteries.gradientBanner,
.banner_quickDraw,
.quick_draw_game {
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}

.banner_block:not(.home-banner),
.gradientBanner:not(.home-banner) {
  min-height: 260px;
}

.home-page .home-banner,
.home-page .gradientHomeBanner,
.home-page .home-hero-bg {
  min-height: 520px;
}

.home-page .home-banner .row,
.home-page .home-banner .inner-home-banner {
  min-height: 0;
}

/* HOMEPAGE HERO HOTFIX: prevent the desktop card from collapsing to text width. */
@media (min-width: 992px) {
  body.home-page .home-banner .container {
    max-width: 1180px;
    width: 100%;
  }

  body.home-page .home-banner .row,
  body.home-page .home-banner .inner-home-banner {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    width: 100% !important;
  }

  body.home-page .home-banner .inner-home-banner > .col-lg-5,
  body.home-page .home-banner .inner-home-banner > .col-md-6:first-child,
  body.home-page .home-banner .inner-home-banner > div:first-child {
    flex: 0 0 43% !important;
    max-width: 43% !important;
    width: 43% !important;
    float: none !important;
  }

  body.home-page .home-banner .inner-home-banner > .col-lg-6,
  body.home-page .home-banner .inner-home-banner > .col-lg-offset-1,
  body.home-page .home-banner .inner-home-banner > .col-md-6:last-child,
  body.home-page .home-banner .inner-home-banner > div:last-child {
    flex: 0 0 50% !important;
    max-width: 50% !important;
    width: 50% !important;
    margin-left: 0 !important;
    float: none !important;
  }

  body.home-page .home-banner .left-content {
    min-height: 360px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  body.home-page .home-banner .left-content img {
    width: min(100%, 430px) !important;
    max-width: 430px !important;
    max-height: 420px !important;
    height: auto !important;
    object-fit: contain !important;
  }

  body.home-page .home-banner .right-content {
    width: 100% !important;
    min-width: 460px !important;
    max-width: 560px !important;
    margin-left: auto !important;
    margin-right: 0 !important;
    padding: 32px 34px !important;
  }

  body.home-page .home-banner .right-content h1,
  body.home-page .home-banner .right-content h3,
  body.home-page .home-banner .right-content p {
    max-width: none !important;
  }

  body.home-page .home-banner .right-content h1 {
    font-size: clamp(38px, 3.1vw, 52px) !important;
    line-height: 1.06 !important;
  }

  body.home-page .home-banner .right-content h3 {
    font-size: clamp(22px, 1.85vw, 30px) !important;
    line-height: 1.25 !important;
  }
}

@media (min-width: 1200px) {
  body.home-page .home-banner .container {
    max-width: 1200px;
  }

  body.home-page .home-banner .right-content {
    min-width: 520px !important;
  }
}

@media (max-width: 991px) {
  body.home-page .home-banner .row,
  body.home-page .home-banner .inner-home-banner {
    display: block !important;
    width: 100% !important;
  }

  body.home-page .home-banner .inner-home-banner > div,
  body.home-page .home-banner .inner-home-banner > [class*="col-"] {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    float: none !important;
  }

  body.home-page .home-banner .right-content {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 620px !important;
    margin: 20px auto 0 !important;
  }

  body.home-page .home-banner .right-content h1,
  body.home-page .home-banner .right-content h3,
  body.home-page .home-banner .right-content p {
    max-width: none !important;
  }
}

/* Do not globally force game/state logos square; only keep them contained. */
.image-lottery,
.state-logos,
.powerfull-logo,
.next_drawing_logo,
.how_to_claim_logo,
.game-format-img,
.lottery-logo,
.game-logo {
  display: flex;
  align-items: center;
  justify-content: center;
}

.image-lottery img,
.state-logos img,
.powerfull-logo img,
.next_drawing_logo img,
.how_to_claim_logo img,
.game-format-img img,
img[src*="games_logo"],
img[src*="state-logo"] {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 200px;
  object-fit: contain;
}

/* Results / table areas: reserve enough space for async data, not excessive space. */
#showresults,
.results-container,
.Past_result,
.left-Result-main-box,
.Lottery-Result-Grid-box,
.Lottery-Result-queries_box,
#numberCheckerData,
.checking-number {
  min-height: 120px;
}

.number_scroll,
.ticket-box {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}

.number_scroll span,
.balls li,
.balls span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.table-responsive {
  min-height: 0;
  overflow-x: auto;
}

.table,
.dataTable {
  table-layout: auto;
}

/* Ads can shift content; reserve only actual ad containers. */
ins.adsbygoogle,
.adsbygoogle,
.ad-container,
.ad-slot,
.google-auto-placed {
  display: block;
  min-height: 90px;
}

@media (min-width: 768px) {
  ins.adsbygoogle,
  .adsbygoogle,
  .ad-container,
  .ad-slot,
  .google-auto-placed {
    min-height: 120px;
  }
}

/* Affiliate banners: preserve natural aspect ratio. */
a[href*="partners.jackpot.com"] {
  display: block;
}

a[href*="partners.jackpot.com"] img,
.banner-img,
img[src*="banners/lottery"],
img[src*="lottery-wide-banner"] {
  width: 100%;
  height: auto;
  object-fit: contain;
}

/* Embeds: stable aspect-ratio wrappers, without forcing every iframe tall. */
.video-wrapper,
.embed-responsive,
.video_block {
  aspect-ratio: 16 / 9;
}

.video-wrapper iframe,
.embed-responsive iframe,
.video_block iframe,
.view-video iframe,
.highlighted-blog iframe {
  width: 100%;
  min-height: 200px;
}

/* Avoid layout-affecting animations/transitions. */
.collapse,
.collapsing {
  transition-property: opacity, visibility !important;
}

.fade,
.fade-in,
.fade-in-up,
.slide-in-left,
.slide-in-right,
.animated {
  animation: none !important;
  transition-property: opacity, visibility, box-shadow, background-color !important;
  transform: none !important;
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

@media (max-width: 767px) {
  .navigation {
    min-height: 96px;
  }

  .home-page .home-banner,
  .home-page .gradientHomeBanner,
  .home-page .home-hero-bg {
    min-height: auto;
  }

  .banner_block:not(.home-banner),
  .gradientBanner:not(.home-banner) {
    min-height: 220px;
  }
}