/* GAMADORBET layout pass: responsive shell, hero, grids and overflow fixes. */

:root {
  --gm-shell-max: 1280px;
  --gm-shell-pad: clamp(16px, 4.5vw, 56px);
  --gm-section-gap: clamp(28px, 4vw, 56px);
}

html,
body {
  width: 100%;
  overflow-x: clip;
}

body {
  background: #001108 !important;
  min-width: 0;
  padding-bottom: 58px;
}

.bg-aurora {
  background:
    radial-gradient(ellipse 48% 34% at 50% 8%, rgba(212, 175, 55, 0.14), transparent 68%),
    radial-gradient(ellipse 70% 62% at 72% 18%, rgba(0, 92, 42, 0.42), transparent 66%),
    radial-gradient(ellipse 70% 70% at 12% 76%, rgba(0, 58, 28, 0.34), transparent 70%),
    linear-gradient(160deg, #001108 0%, #002410 40%, #00170a 78%, #000804 100%) !important;
  overflow: hidden;
  z-index: 0 !important;
}

.page-shell,
.trust-section,
.site-footer--refined {
  position: relative;
  z-index: 2 !important;
}

.topbar {
  position: sticky !important;
  top: 0 !important;
  z-index: 50 !important;
}

.topbar.scrolled {
  width: min(1320px, calc(100% - clamp(48px, 8vw, 180px))) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 0 0 18px 18px !important;
}

.topbar.scrolled .topbar-row {
  width: calc(100% - clamp(28px, 3vw, 52px)) !important;
}

.live-winner-ticker {
  z-index: 90 !important;
}

.auth-modal-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.register-step-overlay {
  position: fixed !important;
  inset: 0 !important;
  z-index: 1150 !important;
}

.auth-modal-overlay.active {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
}

.bg-aurora::before,
.bg-aurora::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.bg-aurora::before {
  opacity: 0.22;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='168' height='168' viewBox='0 0 168 168'%3E%3Cg fill='none' stroke='%23d4af37' stroke-opacity='.34' stroke-width='2'%3E%3Cpath d='M10 22h42v18H28v22h42V10h88v52h-42V40h24V22H86v124h54v-18h-24v-22h42v52H70v-52h42v22H88v18H28V84h52V66H10z'/%3E%3Ccircle cx='84' cy='84' r='32' stroke-opacity='.18'/%3E%3Cpath d='M66 90c12-18 24-18 36 0M64 78c13 10 27 10 40 0' stroke-opacity='.16'/%3E%3C/g%3E%3C/svg%3E"),
    linear-gradient(90deg, rgba(212, 175, 55, 0.08) 1px, transparent 1px),
    linear-gradient(0deg, rgba(212, 175, 55, 0.06) 1px, transparent 1px);
  background-size: 168px 168px, 84px 84px, 84px 84px;
  background-position: center top;
  mix-blend-mode: soft-light;
}

.bg-aurora::after {
  opacity: 0.2;
  background:
    radial-gradient(circle at 16% 18%, transparent 0 70px, rgba(212, 175, 55, 0.08) 71px 73px, transparent 74px),
    radial-gradient(circle at 86% 24%, transparent 0 92px, rgba(212, 175, 55, 0.08) 93px 96px, transparent 97px),
    radial-gradient(circle at 74% 84%, transparent 0 120px, rgba(212, 175, 55, 0.06) 121px 124px, transparent 125px),
    linear-gradient(90deg, rgba(0, 43, 18, 0.16), transparent 30%, transparent 70%, rgba(0, 43, 18, 0.16));
}

.topbar-row,
.page-shell,
.trust-shell,
.site-footer--refined .footer-shell--refined {
  width: min(var(--gm-shell-max), calc(100% - (var(--gm-shell-pad) * 2))) !important;
  max-width: var(--gm-shell-max) !important;
}

.topbar-row {
  padding: 12px 0 !important;
  gap: clamp(12px, 2vw, 28px);
}

.brand img {
  width: clamp(54px, 5vw, 72px) !important;
  height: auto !important;
  max-height: 72px;
}

.main-text-nav {
  min-width: 0;
  gap: clamp(12px, 1.8vw, 26px) !important;
}

.text-link {
  font-size: clamp(14px, 1.05vw, 17px) !important;
  white-space: nowrap;
}

.auth-links {
  flex-shrink: 0;
}

.auth-btn {
  min-height: 42px;
  padding: 9px clamp(14px, 1.8vw, 22px) !important;
}

.page-shell {
  padding: 0 0 clamp(42px, 5vw, 70px) !important;
}

.hero {
  margin: 0 0 var(--gm-section-gap) !important;
  padding: 0 !important;
  min-height: 0 !important;
  height: auto !important;
}

.hero-container {
  width: 100% !important;
  height: auto !important;
  max-height: none !important;
  margin-left: 0 !important;
  grid-template-columns: minmax(0, 1fr) minmax(360px, 420px) !important;
  gap: clamp(28px, 4vw, 58px) !important;
  align-items: start !important;
  justify-items: stretch !important;
  min-height: 0 !important;
  padding: clamp(22px, 3vw, 42px) 0 clamp(28px, 4vw, 56px) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.hero-container::before,
.hero-container::after {
  content: none !important;
  position: absolute;
  pointer-events: none;
  z-index: 1;
}

.hero-container::before {
  inset: 0;
  opacity: 0.24;
  background-image:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='112' height='112' viewBox='0 0 112 112'%3E%3Cg fill='none' stroke='%23d4af37' stroke-opacity='.32' stroke-width='1.7'%3E%3Cpath d='M8 16h28v12H20v16h28V8h56v36H76V28h16V16H56v80h36V84H76V68h28v36H48V68h28v16H60v12H20V56h36V44H8z'/%3E%3C/g%3E%3C/svg%3E");
  background-size: 112px 112px;
  background-position: center;
  mix-blend-mode: soft-light;
  mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.75), transparent 38%, transparent 66%, rgba(0, 0, 0, 0.65));
  -webkit-mask-image: linear-gradient(90deg, rgba(0, 0, 0, 0.75), transparent 38%, transparent 66%, rgba(0, 0, 0, 0.65));
}

.hero-container::after {
  inset: 10px;
  border-radius: inherit;
  border: 1px solid rgba(212, 175, 55, 0.09);
  box-shadow:
    inset 54px 0 92px rgba(0, 43, 18, 0.18),
    inset -54px 0 92px rgba(0, 43, 18, 0.2);
}

.hero-bg-overlay {
  display: none !important;
}

.hero-bg-video,
.hero-casino-broll {
  display: none !important;
}

.hero-content {
  align-self: start !important;
  max-width: 720px;
}

.hero-content h1 {
  max-width: 760px;
  text-wrap: balance;
}

.hero-content p {
  max-width: 610px !important;
}

.hero-dashboard-widget {
  align-self: start !important;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.widget-balances,
.games-row,
.widget-actions {
  min-width: 0;
}

.game-thumb,
.action-btn,
.balance-item {
  min-width: 0;
}

.game-thumb span,
.action-btn span,
.balance-item .label,
.balance-item .value {
  overflow: hidden;
  text-overflow: ellipsis;
}

.game-section,
.trust-section,
.site-footer--refined {
  margin-bottom: var(--gm-section-gap) !important;
}

.section-header {
  gap: 16px;
  min-width: 0;
}

.section-title {
  min-width: 0;
}

.games-grid,
.popular-games-grid,
.bonus-grid,
.live-layout,
.jackpot-tournament-grid,
.vip-grid,
.mission-grid,
.faq-layout,
.trust-features,
.footer-refined-grid {
  min-width: 0;
}

.popular-games-grid--4 {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
  gap: clamp(14px, 2vw, 24px) !important;
  justify-items: stretch !important;
}

.popular-games-grid .popular-category-card {
  width: 100% !important;
  max-width: 100% !important;
}

.popular-games-grid .popular-category-card .popular-game-art {
  width: 100% !important;
  max-width: 100% !important;
}

.popular-games-grid .popular-category-card .popular-game-art img {
  width: 100% !important;
}

.bonus-section .bonus-grid,
.vip-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

.live-layout {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: clamp(18px, 2vw, 28px) !important;
}

.live-showcase-card {
  aspect-ratio: 542 / 242 !important;   /* gorsel orani (542x242) -> cover tam oturur, kirpma yok */
  min-height: 0 !important;
  background-size: cover !important;
  background-position: center !important;
}

.mission-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
}

.faq-heading-copy,
.faq-grid,
.faq-help-card {
  min-width: 0;
}

.jt-dashboard-title {
  white-space: normal !important;
}

.lb-name,
.lb-score,
.lb-prize {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.live-winner-ticker {
  width: 100%;
  overflow: hidden;
}

@media (max-width: 1180px) {
  .main-text-nav {
    display: none !important;
  }

  .hero-container {
    grid-template-columns: 1fr !important;
    min-height: 0 !important;
    padding-top: clamp(20px, 4vw, 34px) !important;
  }

  .hero-dashboard-widget {
    max-width: 680px;
  }

  .bonus-section .bonus-grid,
  .vip-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .live-layout {
    grid-template-columns: repeat(2, minmax(280px, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  :root {
    --gm-shell-pad: 16px;
    --gm-section-gap: 34px;
  }

  body {
    padding-bottom: 52px;
  }

  .topbar-row {
    width: calc(100% - 24px) !important;
    padding: 9px 0 !important;
    gap: 8px !important;
  }

  .topbar.scrolled {
    width: calc(100% - 16px) !important;
    border-radius: 0 0 14px 14px !important;
  }

  .brand img {
    width: 52px !important;
    max-height: 52px;
  }

  .auth-links {
    gap: 8px !important;
  }

  .auth-btn {
    min-height: 36px;
    padding: 8px 11px !important;
    border-radius: 8px !important;
    font-size: 11px !important;
    letter-spacing: 0.35px !important;
  }

  .page-shell {
    width: calc(100% - 32px) !important;
  }

  .hero {
    margin-left: calc(var(--gm-shell-pad) * -1) !important;
    margin-right: calc(var(--gm-shell-pad) * -1) !important;
  }

  .hero-container {
    padding: 20px 18px 24px !important;
    gap: 24px !important;
    border-radius: 0 !important;
  }

  .hero-content h1 {
    font-size: clamp(30px, 9vw, 42px) !important;
    line-height: 1.1 !important;
    letter-spacing: 0.45px !important;
    margin-bottom: 18px !important;
  }

  .hero-content p {
    font-size: 17px !important;
    line-height: 1.45 !important;
    margin-bottom: 24px !important;
  }

  .hero-actions {
    gap: 12px !important;
  }

  .hero-dashboard-widget {
    padding: 16px !important;
    gap: 16px !important;
    border-radius: 16px !important;
    max-width: 100%;
  }

  .widget-balances {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .balance-item {
    padding: 10px 6px !important;
  }

  .balance-item .label {
    font-size: 9px !important;
  }

  .balance-item .value {
    font-size: 13px !important;
    white-space: nowrap;
  }

  .games-row {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .game-thumb img {
    aspect-ratio: 1 / 1 !important;
    object-fit: cover;
  }

  .game-thumb span {
    font-size: 10px !important;
    line-height: 1.15 !important;
    white-space: nowrap;
  }

  .widget-actions {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 8px !important;
  }

  .action-btn {
    min-height: 56px;
    padding: 8px 5px !important;
    gap: 5px !important;
  }

  .action-btn span {
    font-size: 10px !important;
    white-space: nowrap;
  }

  .section-header,
  .faq-heading {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  .section-title {
    white-space: normal !important;
  }

  .section-title.section-title-hero {
    padding-bottom: 14px !important;
  }

  .popular-games-grid--4 {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }

  .popular-games-grid .popular-category-card .popular-game-art {
    border-radius: 12px !important;
  }

  .bonus-section .bonus-grid,
  .jackpot-tournament-grid,
  .vip-grid,
  .mission-grid,
  .faq-layout {
    grid-template-columns: 1fr !important;
  }

  .live-layout {
    grid-template-columns: 1fr !important;
    gap: 16px !important;
  }

  .live-showcase-card {
    min-height: 0 !important;   /* aspect-ratio (542/242) yuksekligi belirlesin -> mobilde de kirpmaz */
  }

  .jt-dashboard-title {
    display: flex !important;
    flex-wrap: wrap;
    gap: 0 0.35em;
    max-width: 100%;
  }

  .jackpot-dashboard-section .jt-card {
    padding: 18px !important;
  }

  .countdown-timer {
    flex-wrap: wrap;
  }

  .faq-support-link {
    align-self: flex-start !important;
    white-space: nowrap;
  }

  .trust-shell,
  .site-footer--refined .footer-shell--refined {
    width: calc(100% - 32px) !important;
  }

  .live-winner-ticker {
    min-height: 44px !important;
  }

  .live-winner-label {
    width: 92px;
    min-width: 92px;
    padding: 0 10px !important;
    font-size: 10px !important;
    line-height: 1.1;
  }

  .live-winner-track {
    font-size: 13px !important;
    gap: 24px !important;
    padding-left: 24px !important;
  }
}

@media (max-width: 390px) {
  .auth-btn {
    padding-left: 9px !important;
    padding-right: 9px !important;
  }

  .brand img {
    width: 48px !important;
  }

  .hero-container {
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  .popular-games-grid--4 {
    gap: 12px !important;
  }
}

@supports not (overflow: clip) {
  html,
  body {
    overflow-x: hidden;
  }
}

/* Final rescue: keep the hero in normal flow and keep only the site background pattern. */
.hero {
  height: auto !important;
  min-height: 0 !important;
  margin-top: 0 !important;
  padding-top: 0 !important;
}

.hero-container {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
  align-items: start !important;
  align-content: start !important;
  padding-top: clamp(20px, 3vw, 36px) !important;
  transform: none !important;
}

.hero-content,
.hero-dashboard-widget {
  align-self: start !important;
  margin-top: 0 !important;
  transform: none !important;
}

.hero-bg-video,
.hero-bg-overlay,
.hero-casino-broll,
.hero-container .chip-rain {
  display: none !important;
}

.hero-container::before,
.hero-container::after {
  content: none !important;
}

@media (max-width: 760px) {
  .hero-container {
    padding-top: 18px !important;
  }
}

@media (min-width: 1181px) {
  .live-casino-section {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}
