/* ============================================================
   BOOM WORLD 4.1.6 // DESKTOP MENU + MOBILE BAG + CHAT CLEANUP
   UI-only. No gameplay / DB / Society / MMORPG logic changes.
   ============================================================ */

/* ------------------------------------------------------------
   DESKTOP: the Poké Ball quick menu is MOBILE-ONLY.
   WORLD 4.1.1 created the DOM on every viewport but only styled
   it inside the mobile media query. On desktop that left raw
   buttons in normal page flow. Hard-hide it outside mobile.
   ------------------------------------------------------------ */
@media (min-width: 901px) {
  body.boom-world #world411-ball-menu,
  body.boom-world #world411-menu-shade {
    display: none !important;
  }

  body.boom-world.world411-menu-open {
    overflow: auto !important;
  }
}

/* ------------------------------------------------------------
   CHAT: exactly ONE title. Hide every historical generated title
   and suppress stray text/pseudo content in the original hint.
   ------------------------------------------------------------ */
body.boom-world #world-chat .world412-chat-title,
body.boom-world #world-chat .world413-chat-head,
body.boom-world #world-chat .world414-chat-head,
body.boom-world #world-chat .world415-chat-title,
body.boom-world #world-chat .world415-generated-chat-head {
  display: none !important;
}

body.boom-world #world-chat > .ch-hint.world416-chat-head {
  display: flex !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  gap: 7px !important;
  min-height: 34px !important;
  margin: 0 48px 9px 0 !important;
  padding: 1px 2px 9px !important;
  border-bottom: 1px solid rgba(91,229,255,.15) !important;
  color: transparent !important;
  opacity: 1 !important;
  overflow: hidden !important;
  font-size: 0 !important; /* kills any leftover raw text node */
  line-height: 1 !important;
}

body.boom-world #world-chat > .ch-hint.world416-chat-head::before,
body.boom-world #world-chat > .ch-hint.world416-chat-head::after {
  content: none !important;
  display: none !important;
}

body.boom-world #world-chat > .ch-hint.world416-chat-head > *:not(.world416-chat-title):not(#wchat-auth) {
  display: none !important;
}

body.boom-world #world-chat > .ch-hint.world416-chat-head .world416-chat-title {
  display: inline-block !important;
  flex: 0 0 auto !important;
  color: #62efff !important;
  font: 900 .72rem/1 Orbitron, sans-serif !important;
  letter-spacing: .055em !important;
  white-space: nowrap !important;
}

body.boom-world #world-chat > .ch-hint.world416-chat-head #wchat-auth {
  display: inline-block !important;
  min-width: 0 !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  color: #ffd95b !important;
  opacity: .94 !important;
  font: 800 .76rem/1.1 Rajdhani, sans-serif !important;
}

/* ------------------------------------------------------------
   MOBILE BAG: force the portaled BAG to be a genuine viewport
   sheet. 100dvh prevents the old game-frame-sized appearance.
   ------------------------------------------------------------ */
@media (max-width: 900px) {
  body.boom-world #world411-ball-menu,
  body.boom-world #world411-menu-shade {
    /* Re-enable the mobile-only components after desktop hard-hide. */
    display: block;
  }

  body.boom-world.world412-bag-open {
    overflow: hidden !important;
    overscroll-behavior: none !important;
  }

  body.boom-world #bag-panel.world412-mobile-bag {
    box-sizing: border-box !important;
    position: fixed !important;
    inset: 0 !important;
    top: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    left: 0 !important;
    width: 100vw !important;
    min-width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    min-height: 100dvh !important;
    max-height: 100dvh !important;
    margin: 0 !important;
    padding:
      max(10px, env(safe-area-inset-top, 0px))
      max(10px, env(safe-area-inset-right, 0px))
      max(10px, env(safe-area-inset-bottom, 0px))
      max(10px, env(safe-area-inset-left, 0px)) !important;
    border-radius: 0 !important;
    z-index: 100220 !important;
    overflow: hidden !important;
    transform: none !important;
  }

  body.boom-world #bag-panel.world412-mobile-bag.show {
    display: flex !important;
    flex-direction: column !important;
  }

  body.boom-world #bag-panel.world412-mobile-bag .economy-head,
  body.boom-world #bag-panel.world412-mobile-bag .bag-tabs,
  body.boom-world #bag-panel.world412-mobile-bag #btn-bag-close {
    flex: 0 0 auto !important;
  }

  body.boom-world #bag-panel.world412-mobile-bag .bag-view.active {
    display: block !important;
    flex: 1 1 0 !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overscroll-behavior: contain !important;
    -webkit-overflow-scrolling: touch !important;
  }

  body.boom-world #bag-panel.world412-mobile-bag #btn-bag-close {
    position: relative !important;
    inset: auto !important;
    bottom: auto !important;
    width: 100% !important;
    margin-top: 8px !important;
  }

  body.boom-world #world-chat.chat-open > .ch-hint.world416-chat-head,
  body.boom-world #world-chat.mobile-open > .ch-hint.world416-chat-head {
    min-height: 36px !important;
    margin-right: 52px !important;
  }

  body.boom-world #world-chat > .ch-hint.world416-chat-head .world416-chat-title {
    font-size: .69rem !important;
  }
}