/*
 * 88BB App v101 mobile width guard.
 * The App surface always uses the single-pane mobile chat flow, even when an
 * Android WebView, TWA, foldable or tablet reports a wide CSS viewport.
 */

body.bbtg-v2-enabled [data-chat-panel].is-active {
  left: 0 !important;
  right: 0 !important;
  width: 100% !important;
  max-width: none !important;
}

body.bbtg-v2-enabled [data-chat-panel].is-active > .bbtg-v2[data-bbtg-surface="app"] {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  overflow: hidden !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-shell {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-resizer {
  display: none !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-rooms {
  display: grid !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100% !important;
  border-right: 0 !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-room-list,
.bbtg-v2[data-bbtg-surface="app"] .bbtg-room-card {
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-chat {
  display: none !important;
}

.bbtg-v2[data-bbtg-surface="app"].is-room-open .bbtg-rooms {
  display: none !important;
}

.bbtg-v2[data-bbtg-surface="app"].is-room-open .bbtg-chat {
  position: fixed !important;
  left: 0 !important;
  right: 0 !important;
  top: var(--bbtg-vv-top) !important;
  z-index: 10100 !important;
  width: 100vw !important;
  max-width: none !important;
  min-width: 0 !important;
  height: var(--bbtg-vv-height) !important;
  display: grid !important;
  grid-template-rows: calc(58px + env(safe-area-inset-top, 0px)) minmax(0, 1fr) auto !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-back {
  display: inline-grid !important;
  pointer-events: auto !important;
  touch-action: manipulation !important;
}

.bbtg-v2[data-bbtg-surface="app"] .bbtg-message-viewport {
  min-width: 0 !important;
  overflow-x: hidden !important;
}