/* ============================================================
   后台多端适配补丁 (手机 / 平板 / 电脑)
   仅在小屏生效，桌面端保持原样
   ============================================================ */

html, body { max-width: 100%; }
body.mnav-lock { overflow: hidden; }
img, video, canvas, svg { max-width: 100%; }

/* 汉堡按钮默认隐藏（桌面不显示） */
.mnav-toggle { display: none; }
.mnav-mask { display: none; }

/* ============ 平板竖屏 / 手机：侧栏改抽屉 ============ */
@media (max-width: 991.98px) {
  .ant-layout-sider {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    bottom: 0 !important;
    height: 100vh !important;
    width: 260px !important;
    min-width: 260px !important;
    max-width: 260px !important;
    flex: 0 0 260px !important;
    z-index: 1002 !important;
    transform: translate3d(-105%, 0, 0);
    transition: transform .26s cubic-bezier(.4, 0, .2, 1);
    box-shadow: 6px 0 26px rgba(0, 0, 0, .45);
    overflow: hidden;
  }
  .ant-layout-sider-children { overflow-y: auto; -webkit-overflow-scrolling: touch; height: 100%; }
  body.mnav-open .ant-layout-sider { transform: translate3d(0, 0, 0); }

  .mnav-mask {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1001;
    background: rgba(0, 0, 0, .52);
    opacity: 0;
    pointer-events: none;
    transition: opacity .26s ease;
  }
  body.mnav-open .mnav-mask { opacity: 1; pointer-events: auto; }

  .mnav-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 38px;
    width: 38px;
    height: 38px;
    padding: 0;
    margin-right: 4px;
    border: 0;
    border-radius: 10px;
    background: rgba(255, 255, 255, .08);
    color: var(--fc-text, #e6edf7);
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .mnav-toggle:active { background: rgba(255, 255, 255, .2); }
  [data-theme=light] .mnav-toggle { background: rgba(15, 23, 42, .06); color: #0f172a; }

  /* 内容区占满 */
  .ant-layout-content { width: 100% !important; max-width: 100% !important; min-width: 0 !important; }
  .ant-layout-has-sider { min-height: 100vh; }

  /* 顶栏压缩：允许折行，控件可收缩 */
  .ant-layout-header {
    padding: 0 10px !important;
    height: 56px !important;
    column-gap: 8px;
    flex-wrap: wrap !important;
  }
  .ant-layout-header > div { min-width: 0 !important; max-width: 100% !important; flex-wrap: wrap !important; }
  .ant-layout-header > div:first-child { gap: 8px !important; }
  .ant-layout-header .ant-select { min-width: 0 !important; max-width: 140px !important; }
  .ant-layout-header .ant-select-selection-item { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

  /* 表格横向滚动，不挤成一团 */
  .ant-table-wrapper { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ant-table { min-width: 620px; }
  .ant-pagination { flex-wrap: wrap; row-gap: 6px; }

  /* 弹窗 / 抽屉自适应 */
  .ant-modal { max-width: calc(100vw - 20px) !important; margin: 12px auto !important; top: 16px !important; }
  .ant-modal-content { padding: 14px !important; }
  .ant-drawer-content-wrapper { max-width: 92vw !important; }
  .ant-drawer-body { padding: 14px !important; }

  /* 卡片留白收紧 */
  .ant-card-body { padding: 12px !important; }
  .ant-descriptions-item { padding-bottom: 6px !important; }

  /* 下拉菜单不超出屏幕 */
  .ant-select-dropdown { max-width: calc(100vw - 16px) !important; }
  .ant-picker-dropdown { max-width: calc(100vw - 16px) !important; }

  /* ---- 内联写死宽度的容器在窄屏放开 ---- */
  main [style*="min-width: 360px"],
  main [style*="min-width: 380px"],
  main [style*="min-width: 400px"],
  main [style*="min-width: 420px"],
  main [style*="min-width: 440px"],
  main [style*="min-width: 460px"],
  main [style*="min-width: 480px"] { min-width: 0 !important; }

  /* ---- 内联双列 grid 在窄屏改单列 ---- */
  main [style*="grid-template-columns: auto 1fr"],
  main [style*="grid-template-columns: auto minmax"],
  main [style*="grid-template-columns: 1fr 1fr"],
  main [style*="grid-template-columns: 1fr 320px"],
  main [style*="grid-template-columns: 320px 1fr"] { grid-template-columns: minmax(0, 1fr) !important; }

  /* ---- 分段控件 / 标签组允许横向滑动 ---- */
  .ant-segmented { max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .ant-segmented .ant-segmented-group { flex-wrap: nowrap; }
  .ant-radio-group { flex-wrap: wrap; }
  .ant-tabs-nav { max-width: 100%; }
  .ant-tabs-nav-list { overflow-x: auto; }
}


/* ============ 手机 ============ */
@media (max-width: 575.98px) {
  /* 统计卡一行一个，不挤成两列 */
  .ant-col-xs-12 { flex: 0 0 100% !important; max-width: 100% !important; }

  .ant-layout-header { height: auto !important; min-height: 54px; padding: 8px 10px !important; flex-wrap: wrap; row-gap: 6px; }
  /* 顶栏时间块简化：隐藏「中国时间」三个字，时间字号减小 */
  .ant-layout-header > div:first-child > span:nth-child(2) { display: none !important; }
  .ant-layout-header > div:first-child > span:nth-child(3) { font-size: 13px !important; }
  .ant-layout-header > div:last-child { gap: 8px !important; }
  .ant-layout-header .ant-tag { display: none !important; }
  .ant-layout-header .ant-select { max-width: 104px !important; }

  /* 弹窗几乎占满宽 */
  .ant-modal { max-width: calc(100vw - 12px) !important; margin: 8px auto !important; }
  .ant-modal-content { padding: 12px !important; border-radius: 12px !important; }

  /* 表单控件铺满 */
  .ant-form-item { margin-bottom: 14px !important; }
  .ant-input, .ant-input-number, .ant-select { max-width: 100%; }

  /* 工具条换行 */
  .ant-space { flex-wrap: wrap; }
  .ant-btn { min-height: 34px; }

  /* 设备控制页在手机上纵向排列更宽松 */
  .ctrl-body { grid-template-columns: 1fr !important; grid-template-rows: auto !important; }
  .device-cards { grid-template-columns: 1fr !important; }
  .rc-stats { grid-template-columns: 1fr !important; }
}

/* ============ 横屏小高度 ============ */
@media (max-height: 480px) and (max-width: 991.98px) {
  .ant-layout-sider { overflow-y: auto; }
}
