/**
 * xd_forum — mobile layer on Bootstrap 3.
 * 顶栏：主行能显示多少显示多少，其余「更多」；菜单栏不做横向滑动（PC/窄屏同一逻辑，由 forum_nav_scroll_close.jsp 内脚本分栏）。
 */

html {
  -webkit-text-size-adjust: 100%;
}

body {
  overflow-x: hidden;
}

/*
 * 移动端（含手机横屏，视口宽常 &gt; 767）：用 max-width:991px 与 forum-x-touch-scroll.js 一致；
 * html/body 不要用 overflow-x:hidden，否则微信/WebView 里子元素很难横滑。
 * 横向溢出主要由 .container 收口；宽表用 .forum-x-scroll（overflow-x:scroll）；forum-x-touch-scroll.js 补 WebView 触摸横滑。
 */
@media (max-width: 991px) {
  html {
    overflow-x: visible;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    width: 100%;
    max-width: 100%;
  }

  /* 勿用 100vw：含纵向滚动条占位时 vw 可大于「可视内容宽」，body 略宽会产生根级横向滚动，
   * 横滑手势被文档层吃掉，转屏后 WebKit 常卡在错误滚动目标上，竖屏也不恢复。 */
  body {
    overflow-x: visible !important;
    overflow-y: visible;
    width: 100%;
    max-width: 100%;
    position: relative;
    -webkit-overflow-scrolling: touch;
  }

  .container {
    overflow-x: hidden;
    max-width: 100%;
  }

  /* 横滑表格外层仍裁剪溢出，但允许触摸事件交给子层，避免竖屏时「划块」手势被容器吞掉 */
  .container > .forum-x-scroll {
    touch-action: pan-x pan-y;
  }

  /* 外层定宽裁剪，内层强制出现横向滚动条（scroll 比 auto 在部分内核更可靠） */
  .forum-x-clip {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
    overflow-y: visible;
    box-sizing: border-box;
  }

  .forum-x-scroll {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box;
    overflow-x: scroll !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x pan-y;
    overscroll-behavior-x: contain;
    margin-bottom: 15px;
    padding-bottom: 6px;
    scrollbar-width: thin;
    /* 独立合成层 + 独立堆叠上下文，减轻转屏后命中错位 */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    isolation: isolate;
    position: relative;
    z-index: 0;
  }

  .forum-x-scroll::-webkit-scrollbar {
    height: 8px;
  }

  .forum-x-scroll::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 4px;
  }
}

@media (min-width: 992px) {
  .forum-x-clip {
    overflow: visible;
  }

  .forum-x-scroll {
    overflow-x: auto;
    overflow-y: visible;
  }
}

/* ========== 顶栏：flex 主行 + 右侧「更多」，overflow:hidden ========== */

.forum-nav-mobile-root {
  position: relative;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.forum-nav-shell {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
  border-bottom: 1px solid #ddd;
  margin-bottom: 10px;
  min-width: 0;
}

.forum-nav-shell .forum-top-nav-wrap {
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
}

.forum-nav-shell .forum-top-nav-wrap > ul.nav.nav-tabs {
  display: flex;
  flex-flow: row nowrap;
  align-items: stretch;
  float: none !important;
  width: max-content;
  min-width: 0;
  max-width: none;
  margin-bottom: 0 !important;
  border-bottom: none !important;
  list-style: none;
  padding-left: 0;
}

.forum-nav-shell .forum-top-nav-wrap > ul.nav.nav-tabs > li {
  float: none !important;
  flex: 0 0 auto;
  white-space: nowrap;
}

.forum-nav-shell .forum-top-nav-wrap > ul.nav.nav-tabs > li > a {
  margin-right: 2px;
  padding: 10px 12px;
  box-sizing: border-box;
  display: inline-flex;
  align-items: center;
}

.forum-nav-more-btn {
  flex: 0 0 auto;
  align-self: center;
  width: 44px;
  min-width: 44px;
  height: 40px;
  margin: 0 0 0 4px;
  padding: 0;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: #f7f7f7;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.forum-nav-more-icon {
  display: block;
  width: 20px;
  height: 2px;
  background: #333;
  border-radius: 1px;
  box-shadow: 0 -6px 0 #333, 0 6px 0 #333;
}

.forum-nav-overflow-panel {
  display: none;
  position: absolute;
  right: 0;
  top: 100%;
  z-index: 2000;
  min-width: 200px;
  max-width: min(100vw - 24px, 360px);
  max-height: min(70vh, 480px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
  margin-top: 4px;
}

.forum-nav-overflow-panel:not([hidden]) {
  display: block;
}

.forum-nav-overflow-list {
  list-style: none;
  margin: 0;
  padding: 0;
  float: none !important;
}

.forum-nav-overflow-list > li {
  float: none !important;
  display: block;
  border-bottom: 1px solid #eee;
}

.forum-nav-overflow-list > li:last-child {
  border-bottom: none;
}

.forum-nav-overflow-list > li > a {
  display: flex;
  align-items: center;
  padding: 12px 14px;
  white-space: nowrap;
}

/* 主题列表 */
.forum-topic-list-wrap {
  -webkit-overflow-scrolling: touch;
}

@media (max-width: 991px) {
  .nav-container {
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: hidden;
  }

  .container {
    padding-left: 12px;
    padding-right: 12px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .forum-nav-shell .forum-top-nav-wrap > ul.nav.nav-tabs > li > a {
    padding: 12px 10px;
    min-height: 44px;
  }

  .forum-topic-list-wrap .table.table-fixed {
    table-layout: auto !important;
    width: auto !important;
    min-width: 720px;
    max-width: none;
  }

  .forum-topic-list-wrap .table.table-fixed td,
  .forum-topic-list-wrap .table.table-fixed th {
    vertical-align: top;
    word-break: break-word;
    overflow-wrap: anywhere;
    white-space: normal;
  }

  .forum-topic-list-wrap .col-title {
    min-width: 120px;
    width: auto !important;
  }

  .forum-topic-list-wrap .col-content {
    min-width: 260px;
    width: auto !important;
  }

  .forum-topic-list-wrap .col-author {
    min-width: 72px;
    width: auto !important;
  }

  .forum-topic-list-wrap .col-time {
    min-width: 130px;
    width: auto !important;
  }

  .forum-topic-list-wrap .col-ops {
    min-width: 140px;
    width: auto !important;
  }

  .forum-detail-panel .detail-header {
    text-align: left !important;
  }

  .forum-detail-panel .detail-title {
    text-align: left !important;
    font-size: 17px !important;
    line-height: 1.45 !important;
  }

  .forum-detail-panel .detail-meta {
    text-align: left !important;
    margin-top: 10px !important;
    font-size: 12px !important;
    line-height: 1.5 !important;
  }

  .forum-detail-panel .detail-meta span {
    display: block;
    margin-left: 0 !important;
  }

  /* 只让 .rich-content 承担横向滚动，避免与 .panel-body 双层 overflow 导致 WebView 上 scrollWidth 与触摸目标不一致 */
  .forum-detail-panel .panel-body {
    overflow-x: visible !important;
    overflow-y: visible;
    max-width: 100%;
  }

  .forum-detail-panel .rich-content {
    display: block;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    overflow-x: scroll !important;
    overflow-y: visible;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x pan-y;
    overscroll-behavior-x: contain;
    font-size: 15px;
    line-height: 1.75;
    scrollbar-width: thin;
    margin-bottom: 4px;
    padding-bottom: 4px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    isolation: isolate;
    position: relative;
    z-index: 0;
  }

  .forum-detail-panel .rich-content::-webkit-scrollbar {
    height: 8px;
  }

  .forum-detail-panel .rich-content::-webkit-scrollbar-thumb {
    background: rgba(0, 0, 0, 0.25);
    border-radius: 4px;
  }

  /* 详情页内表格区域与列表页一致：可横滑 */
  .container .forum-detail-table-scroll.forum-x-scroll {
    margin-bottom: 15px;
  }

  .forum-detail-table-scroll .table {
    min-width: 520px;
  }

  .forum-detail-table-scroll #topicStockTable {
    min-width: 720px;
  }

  ul.pagination {
    display: block;
    text-align: center;
    white-space: normal;
    padding-left: 0;
  }

  ul.pagination > li {
    display: inline-block;
    float: none !important;
    margin: 2px;
  }

  ul.pagination > li > a,
  ul.pagination > li > span {
    min-height: 40px;
    min-width: 40px;
    line-height: 1.2;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 8px 12px;
    box-sizing: border-box;
  }

  .form-horizontal .control-label {
    text-align: left !important;
    padding-top: 0;
    margin-bottom: 4px;
  }

  .form-horizontal .form-group > div[class^="col-"],
  .form-horizontal .form-group > div[class*=" col-"] {
    width: 100% !important;
    float: none !important;
  }

  .form-horizontal .col-sm-offset-2,
  .form-horizontal .col-sm-10 {
    margin-left: 0 !important;
    width: 100% !important;
  }

  .form-inline .form-control {
    display: block;
    width: 100% !important;
    max-width: 100%;
    margin-bottom: 8px;
  }

  .form-inline .form-group {
    display: block;
    width: 100%;
    margin-right: 0;
    margin-bottom: 8px;
  }

  .form-inline .btn {
    display: block;
    width: 100%;
    margin-bottom: 8px;
  }

  .input-group {
    width: 100%;
    max-width: 100%;
  }

  .forum-page-title-actions .btn {
    float: none !important;
    display: block;
    width: 100%;
    margin: 6px 0 !important;
  }

  h1 {
    font-size: 1.65em;
  }

  h2 {
    font-size: 1.4em;
  }
}

@media (min-width: 992px) {
  .forum-detail-panel .panel-body {
    overflow-x: hidden;
  }
}

.table-responsive {
  border: none;
  margin-bottom: 15px;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  max-width: 100%;
  overflow-x: auto;
}

@media (max-width: 991px) {
  .table-responsive:not(.forum-x-scroll),
  .forum-topic-list-wrap:not(.forum-x-scroll) {
    overflow-x: auto !important;
    overflow-y: visible !important;
    -webkit-overflow-scrolling: touch !important;
    touch-action: pan-x pan-y;
    overscroll-behavior-x: contain;
  }
}

@media (max-width: 991px) {
  .chart-container {
    height: calc(100dvh - 64px) !important;
    height: calc(100vh - 64px) !important;
  }
}

/* ========== 登录页：主区垂直居中 + 验证码输入与图片同一行（Bootstrap3 无 input-group-append） ========== */

.forum-login-body {
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  display: flex;
  flex-direction: column;
}

.forum-login-body .forum-login-shell {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
  width: 100%;
  max-width: 100%;
}

.forum-login-main {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  padding: 20px 0 40px;
  min-height: 0;
}

.forum-login-card {
  width: 100%;
  max-width: 420px;
  margin-left: auto;
  margin-right: auto;
  box-sizing: border-box;
}

.forum-login-captcha-row {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.forum-login-captcha-input {
  flex: 1 1 auto;
  min-width: 0;
  width: auto !important;
}

.forum-login-captcha-img-wrap {
  flex: 0 0 auto;
  margin-left: 10px;
}

.forum-login-captcha-img-wrap img {
  display: block;
  height: auto;
  max-height: 40px;
  width: auto;
  max-width: 160px;
  object-fit: contain;
  border: 1px solid #ccc;
  border-radius: 4px;
  cursor: pointer;
}

.forum-login-captcha-hint {
  display: block;
  clear: both;
  width: 100%;
  margin-top: 6px;
  line-height: 1.4;
}

/* PC：卡片加宽 + 验证码输入固定合理宽度（须在 .forum-login-captcha-input 基础规则之后） */
@media (min-width: 992px) {
  .forum-login-card {
    max-width: 560px;
  }

  .forum-login-card .forum-login-form .control-label {
    text-align: right;
    padding-top: 7px;
  }

  .forum-login-captcha-input {
    flex: 0 0 auto;
    min-width: 140px;
    max-width: 220px;
    width: auto !important;
  }
}

@media (max-width: 991px) {
  .forum-login-actions {
    margin-left: 0 !important;
    width: 100% !important;
    text-align: center;
  }

  .forum-login-actions .btn-link {
    display: inline-block;
    margin-top: 8px;
  }
}

/* ========== 用户管理 / 在线用户：表格强制最小宽度以出现横向滚动条 ========== */
@media (max-width: 991px) {
  body.forum-admin-page {
    min-height: 100vh;
    min-height: 100dvh;
  }

  .forum-admin-user-list-wrap.forum-x-scroll,
  .forum-admin-online-users-wrap.forum-x-scroll {
    margin-bottom: 16px;
  }

  .forum-admin-user-list-table {
    min-width: 1180px;
    margin-bottom: 0;
  }

  .forum-admin-online-users-table {
    min-width: 520px;
    margin-bottom: 0;
  }
}

/* 未使用 forum_nav 包裹的遗留页：仍禁止顶栏横向滑动，仅一行截断（建议尽快包上 include） */
.container > ul.nav.nav-tabs:first-of-type,
.nav-container > ul.nav.nav-tabs {
  overflow-x: hidden;
  overflow-y: hidden;
}
