/* Lotto Orbit 2026-10-20 — Balanced draw schedule/results card.
   Normalises all 27 lottery studios without changing draw information, links or scripts.
   Loaded after historic game-info stylesheet to resolve flex-column + space-between gap. */

body[data-game] .orbit-game-info-pair > .atlas-draw-summary {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) minmax(168px, 188px) !important;
  column-gap: clamp(16px, 1.8vw, 24px) !important;
  row-gap: 12px !important;
  align-items: center !important;
  align-content: center !important;
  justify-content: stretch !important;
  padding: clamp(18px, 2vw, 24px) !important;
  min-width: 0 !important;
  border-radius: 18px !important;
}

body[data-game] .orbit-game-info-pair > .atlas-draw-summary > div:first-child {
  min-width: 0;
  align-self: center;
}

body[data-game] .orbit-game-info-pair .atlas-draw-overline {
  margin: 0 0 12px !important;
  gap: 8px !important;
  line-height: 1.4 !important;
}

body[data-game] .orbit-game-info-pair .atlas-draw-meta {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 10px 15px !important;
  margin: 0 0 10px !important;
}

body[data-game] .orbit-game-info-pair .atlas-draw-meta > div {
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
}

body[data-game] .orbit-game-info-pair .atlas-draw-meta dt {
  font-size: 10px !important;
  letter-spacing: .075em !important;
  line-height: 1.35 !important;
  margin-bottom: 5px !important;
}

body[data-game] .orbit-game-info-pair .atlas-draw-meta dd {
  margin: 0 !important;
  line-height: 1.46 !important;
  font-size: clamp(12px, .93vw, 14px) !important;
  overflow-wrap: break-word;
}

body[data-game] .orbit-game-info-pair .atlas-draw-tz,
body[data-game] .orbit-game-info-pair .atlas-draw-note {
  font-size: 11px !important;
  line-height: 1.55 !important;
  margin: 3px 0 0 !important;
  overflow-wrap: break-word;
}

body[data-game] .orbit-game-info-pair .atlas-draw-link {
  justify-self: stretch !important;
  align-self: center !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  min-height: 44px !important;
  text-align: center !important;
  white-space: normal !important;
  font-size: 11px !important;
  line-height: 1.4 !important;
  padding: 12px 14px !important;
  border-radius: 12px !important;
  display: inline-flex !important;
  gap: 8px !important;
  justify-content: center !important;
  align-items: center !important;
}

/* At narrower cards, a two-column layout of facts can crowd the scheduled time.
   Keep the action on its own line and preserve touch-size targets. */
@media (max-width: 1150px) {
  body[data-game] .orbit-game-info-pair > .atlas-draw-summary {
    grid-template-columns: minmax(0, 1fr) auto !important;
  }
}
@media (max-width: 650px) {
  body[data-game] .orbit-game-info-pair > .atlas-draw-summary {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 16px !important;
    padding: 18px 16px !important;
    align-content: start !important;
  }
  body[data-game] .orbit-game-info-pair .atlas-draw-link {
    justify-self: stretch !important;
    align-self: stretch !important;
    width: 100% !important;
  }
}
@media (max-width: 410px) {
  body[data-game] .orbit-game-info-pair .atlas-draw-meta {
    gap: 12px !important;
  }
  body[data-game] .orbit-game-info-pair .atlas-draw-meta dd {
    font-size: 12px !important;
  }
}

/* MATCHED CARD PAIR — Rules and Schedule must share one height on desktop.
   Respect the natural height of the larger card; never fix a pixel height. */
@media (min-width: 1051px) {
  html[data-theme] body[data-game] .orbit-game-info-pair {
    align-items: stretch !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair > :is(.orbit-rules-ledger, .atlas-draw-summary) {
    align-self: stretch !important;
    height: 100% !important;
    min-height: 0 !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair > .atlas-draw-summary {
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    align-items: stretch !important;
    gap: 16px !important;
    padding: clamp(20px, 2.15vw, 28px) !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair > .atlas-draw-summary > div:first-child {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-overline {
    margin-bottom: 10px !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-meta {
    margin: 0 0 9px !important;
    gap: 16px !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-meta > div {
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-meta dt {
    margin: 0 !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-meta dd {
    font-size: clamp(14px, 1.03vw, 16px) !important;
    font-weight: 800 !important;
    line-height: 1.36 !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair :is(.atlas-draw-tz, .atlas-draw-note) {
    font-size: 12px !important;
    line-height: 1.6 !important;
    margin: 0 !important;
  }
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-link {
    width: fit-content !important;
    max-width: 100% !important;
    min-width: 190px !important;
    align-self: flex-start !important;
    flex-shrink: 0 !important;
    margin-top: auto !important;
    padding: 12px 17px !important;
  }
}
/* On tablets / phones cards naturally stack, without artificial heights. */
@media (max-width: 1050px) {
  html[data-theme] body[data-game] .orbit-game-info-pair > .atlas-draw-summary {
    height: auto !important;
    min-height: 0 !important;
    align-self: stretch !important;
  }
}
@media (max-width: 650px) {
  html[data-theme] body[data-game] .orbit-game-info-pair .atlas-draw-link {
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }
}
