/* SSR chrome: desktop and mobile header/nav trees both stay in the HTML.
 * These queries show only the matching one so the first paint isn't an
 * empty document, and so measuring the 1140px breakpoint in JS does not
 * remount (and flash) the chrome.
 *
 * `aside#asideTag.m` is the desktop product-nav; the mobile accordion is
 * `aside#asideTag.mob`. No captured media query hid `.m` (JS omitted it);
 * hiding it here lets the aside SSR without stacking on small screens. */

@media (max-width: 1140px) {
  .shell-ssr-desktop {
    display: none !important;
    pointer-events: none !important;
  }
  aside#asideTag.m {
    display: none !important;
    pointer-events: none !important;
  }
}

@media (min-width: 1141px) {
  .shell-ssr-mobile {
    display: none !important;
    pointer-events: none !important;
  }
}

/* Nav tabs size to their label. The reference's min-width:80px made Jetx
 * and "MH5 Family" occupy the same slot, so the absolutely-positioned
 * "New" tag (`right:-10px` on the <a>) sat at the far edge of empty space.
 * Keep the <a> content-sized so that tag hugs the text; stretch it only
 * downward into the wrapper's 30px pad so the underline is clickable. */
.main-navigation-routs {
  justify-content: flex-start !important;
}
.main-navigation-routs > div {
  min-width: 0 !important;
}
.main-navigation-routs > div > a {
  display: flex;
  width: max-content;
  padding-bottom: 30px;
  margin-bottom: -30px;
}

/* Reserve chrome height before the 1.4MB reference stylesheet applies, so
 * the sportsbook iframe cannot paint full-bleed over an unstyled header. */
body .header-2 {
  min-height: 118px;
}
body header.new-mobile-header {
  min-height: 120px;
}

#categoriesRow .slick-list::-webkit-scrollbar {
  height: 0;
}

/* BetMaraki wordmark — replaces the captured Chatki SVG without rewriting
 * the byte-identical reference stylesheet. `contain` keeps the wide
 * BET MARAKI mark from stretching; slots are sized for ~3.3:1. */
.header-wrapper-m .logo-wrapper-m a,
.footer-logo,
.icon-bq-logo,
.account-details-popup .popup-main-logo a,
.slot-bq-logo a,
.logo-wrapper-mob > a {
  /* --site-logo / --site-logo-mobile: the admin theme's uploads (src/lib/theme/). */
  background-image: var(--site-logo, url(/images/logo.png)) !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
  background-position: center center !important;
}

.header-wrapper-m .logo-wrapper-m a {
  width: 210px !important;
  height: 48px !important;
}

.header-wrapper-m .logo-wrapper-m {
  height: auto !important;
  margin-top: 10px !important;
}

.footer-logo {
  width: 280px !important;
  height: 72px !important;
}

.icon-bq-logo {
  height: 56px !important;
}

.account-details-popup .popup-main-logo a {
  height: 52px !important;
}

.slot-bq-logo a {
  width: 240px !important;
  height: 56px !important;
}

.logo-wrapper-mob > a {
  background-image: var(--site-logo-mobile, var(--site-logo, url(/images/logo.png))) !important;
}

body .new-mobile-header .new-mobile-header-top > .logo-wrapper-mob {
  height: 40px !important;
  max-width: 180px;
}

