/*
 * Mobile (<=1140px) overrides for the logged-in UI. Our own file, not part
 * of the reference crawl: the guest-only capture has no logged-in mobile
 * DOM/CSS, and style.b32db.css styles .account-details-popup for desktop
 * only (300px sidebar + 1130px panel), which is unusable at 390px.
 * Loaded after style.b32db.css and tw-preflight.css (see
 * src/app/(shell)/layout.tsx), so these rules win ties.
 */

/* Pointer affordance for the drawer's authenticated account menu rows. */
.right-nav-container-mob .new-righ-nav-comp li,
.right-nav-container-mob .modern-deposit-withdraw > div {
  cursor: pointer;
}

@media (max-width: 1140px) {
  /* Full-screen panel instead of the desktop's centered 1130px box. */
  .account-details-popup .ver-center-view-b {
    max-width: 100vw;
    width: 100vw;
    height: 100dvh;
  }
  .account-details-popup .mini-box-popup,
  .account-details-popup .align-wrapper {
    height: 100%;
  }
  .account-details-popup .popup-content-view-m {
    max-height: 100dvh;
    height: 100%;
    overflow-y: auto;
  }

  /* The 300px desktop sidebar becomes a horizontally scrollable pill row
     across the top; the logo and per-item chevron chips go. */
  .account-details-popup .menu-popup > .account-details-tab {
    display: block;
  }
  .modern-casino-styles .modern-styles-main-list-wrapper {
    width: 100%;
    padding: 8px 8px 0;
  }
  .modern-casino-styles .modern-styles-main-list-wrapper .modern-styles-main-list {
    flex-flow: row;
    overflow-x: auto;
    height: auto;
    padding: 6px;
    gap: 4px;
    /* keep the first pill clear of the absolute close button */
    margin-top: 30px;
  }
  .account-details-popup .popup-main-logo {
    display: none;
  }
  .modern-casino-styles .modern-styles-main-list-wrapper .modern-styles-main-list .modern-item {
    flex: 0 0 auto;
    width: auto;
    margin: 0;
    padding: 0 12px;
    white-space: nowrap;
    border-radius: 8px;
  }
  .modern-casino-styles .modern-styles-main-list-wrapper .modern-styles-main-list .modern-item > span {
    display: none;
  }

  /* Content area: full width, natural height, its own horizontal scroll for
     wide tables; kill the desktop's fixed 670/720px heights. */
  .account-details-popup .account-details-tab-content .account-details-tab {
    height: auto !important;
    min-height: 0;
    overflow-x: auto;
  }
  .account-details-popup .account-details-tab-content .account-details-tab .table-lists {
    display: flex;
    overflow-x: auto;
    white-space: nowrap;
  }
  .account-details-popup .account-details-tab-content .account-details-tab .table-lists li {
    flex: 0 0 auto;
  }
  .account-details-popup .table-lists li h5 {
    padding: 0 12px;
  }
}
