/* ============================================
   产品溯源管理系统 - 手机端全面适配 v2
   ============================================ */

/* ---- 全局基础 (所有屏幕) ---- */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
* { -webkit-tap-highlight-color: transparent; }

/* 安全区域 (刘海屏/底部横条) */
body {
  padding-top: env(safe-area-inset-top);
  padding-bottom: env(safe-area-inset-bottom);
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* ============================================
   平板竖屏 (576px - 768px) 中间态适配
   ============================================ */
@media screen and (min-width: 576px) and (max-width: 768px) {

  /* 侧边栏收窄 */
  .ant-pro-sider-menu-sider,
  .ant-pro-sider-menu-sider.ant-layout-sider {
    width: 80px !important;
    min-width: 80px !important;
    max-width: 80px !important;
    flex: 0 0 80px !important;
  }

  .ant-pro-basicLayout-content {
    margin: 16px !important;
  }

  /* 栅格 2列 */
  .ant-col-md-8,
  .ant-col-lg-8,
  .ant-col-xl-8,
  .ant-col-md-6,
  .ant-col-lg-6,
  .ant-col-xl-6 {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
  }

  /* 表格紧凑 */
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 10px 8px !important;
    font-size: 13px !important;
  }
}

/* ============================================
   手机端主适配 (<= 768px)
   ============================================ */
@media screen and (max-width: 768px) {

  /* ---- 全局 ---- */
  html, body {
    overflow-x: hidden !important;
    width: 100% !important;
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }

  /* ============================================
     1. 登录页 (完整重写)
     ============================================ */
  /* 外层容器: 去掉固定高度和overflow:hidden */
  #userLayout.user-layout-wrapper,
  #userLayout.user-layout-wrapper.mobile {
    height: auto !important;
    min-height: 100vh !important;
    min-height: -webkit-fill-available !important;
    overflow: visible !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    padding: 0 !important;
    background: #f6f5ff !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* 内层 container */
  #userLayout.user-layout-wrapper .container,
  #userLayout.user-layout-wrapper.mobile .container {
    width: 100% !important;
    min-width: unset !important;
    max-width: 100% !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    flex: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    min-height: auto !important;
  }
  /* 取消 .middle 的绝对定位居中 */
  #userLayout.user-layout-wrapper .middle,
  #userLayout.user-layout-wrapper .ant-row.middle {
    position: relative !important;
    top: auto !important;
    left: auto !important;
    transform: none !important;
    -webkit-transform: none !important;
    width: 100% !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    margin: 0 !important;
  }
  /* 隐藏左侧登录背景图 */
  #userLayout.user-layout-wrapper .loginBg,
  #userLayout.user-layout-wrapper .container .loginBg {
    display: none !important;
  }
  /* 左侧图片列隐藏 (a-col span=12 第一个) */
  #userLayout .middle > .ant-col:first-child {
    display: none !important;
  }
  /* 右侧表单列全宽 */
  #userLayout .middle > .ant-col:last-child,
  #userLayout .middle > .ant-col {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
  }
  /* 登录表单卡片 */
  #userLayout.user-layout-wrapper .container .main,
  #userLayout.user-layout-wrapper.mobile .container .main {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto !important;
    margin-left: 0 !important;
    padding: 24px 20px 32px !important;
    box-sizing: border-box !important;
    border-radius: 12px !important;
    box-shadow: 0 4px 20px rgba(0,0,0,.06) !important;
  }
  /* 顶部标题区 */
  #userLayout.user-layout-wrapper .container .top {
    padding: 20px 0 0 !important;
    text-align: center !important;
  }
  #userLayout.user-layout-wrapper .container .top .header {
    height: auto !important;
    line-height: normal !important;
  }
  #userLayout.user-layout-wrapper .container .top .header .title {
    font-size: 22px !important;
  }
  #userLayout.user-layout-wrapper .container .top .header .logo {
    width: 100px !important;
    height: auto !important;
  }
  #userLayout.user-layout-wrapper .container .top .desc {
    font-size: 13px !important;
    margin-top: 8px !important;
    margin-bottom: 16px !important;
  }
  /* 登录欢迎标题 */
  .user-layout-login .welcome-login,
  .main .welcome-login {
    font-size: 20px !important;
    margin-top: 12px !important;
    margin-bottom: 24px !important;
  }
  /* 登录表单输入框 - 加大触摸区域 */
  .user-layout-login .ant-input,
  .user-layout-login .ant-input-affix-wrapper .ant-input,
  .user-layout-login .ant-input-affix-wrapper {
    height: 48px !important;
    font-size: 16px !important;
    border-radius: 6px !important;
  }
  .user-layout-login .ant-form-item {
    margin-bottom: 16px !important;
  }
  /* 验证码行 */
  .user-layout-login .getCaptcha {
    height: 48px !important;
    border-radius: 6px !important;
    cursor: pointer;
  }
  /* 登录按钮 */
  .user-layout-login button.login-button,
  .user-layout-register .register-button {
    width: 100% !important;
    height: 48px !important;
    font-size: 16px !important;
    border-radius: 6px !important;
  }
  /* 记住密码 */
  .user-layout-login .ant-checkbox-wrapper {
    font-size: 14px !important;
  }
  /* 注册链接 */
  .user-layout-login .user-login-other {
    text-align: center !important;
    margin-top: 16px !important;
  }
  .user-layout-login .user-login-other .register {
    font-size: 14px !important;
  }
  /* 底部版权 */
  #userLayout.user-layout-wrapper .container .loginBoxBottom,
  #userLayout.user-layout-wrapper .loginBoxBottom {
    position: relative !important;
    bottom: auto !important;
    width: 100% !important;
    margin-top: 24px !important;
    padding: 12px 0 !important;
    text-align: center !important;
  }
  .loginBoxBottom .login-copyright,
  .loginBoxBottom .bottom {
    text-align: center !important;
  }
  .loginBoxBottom .bottom p {
    font-size: 12px !important;
    color: rgba(0,0,0,.45) !important;
    margin: 0 !important;
  }

  /* ============================================
     2. 主布局 - 侧边栏 (彻底隐藏)
     ============================================ */
  /* 所有形态的侧边栏全部隐藏 (含 aside 标签选择器覆盖内联 style) */
  aside.ant-layout-sider,
  aside.ant-layout-sider[style],
  .ant-pro-sider-menu-sider,
  .ant-pro-sider-menu-sider.ant-layout-sider,
  .ant-pro-sider-menu-sider.fix-sider-bar,
  .ant-pro-sider-menu-sider.ant-layout-sider-collapsed,
  .ant-layout-sider,
  .ant-layout-sider-dark,
  .ant-layout-sider-light,
  .ant-layout-sider-has-trigger,
  .ant-pro-basicLayout > .ant-layout > .ant-layout-sider,
  .ant-pro-basicLayout .ant-layout-sider,
  .ant-pro-basicLayout aside {
    display: none !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 0 !important;
    flex: 0 0 0px !important;
    overflow: hidden !important;
    position: absolute !important;
    left: -9999px !important;
  }
  /* 侧边栏底部折叠触发器也隐藏 */
  .ant-layout-sider-trigger {
    display: none !important;
    position: absolute !important;
    left: -9999px !important;
  }
  /* 侧边栏 zero-width 触发器隐藏 */
  .ant-layout-sider-zero-width-trigger {
    display: none !important;
  }
  /* 确保内容区不受侧边栏宽度影响 (覆盖 Vue 内联 style) */
  .ant-pro-basicLayout > .ant-layout,
  .ant-pro-basicLayout > .ant-layout-content,
  .ant-pro-basicLayout .ant-layout,
  .ant-pro-basicLayout section.ant-layout,
  section.ant-layout[style] {
    width: 100% !important;
    margin-left: 0 !important;
    padding-left: 0 !important;
  }
  /* header 宽度也强制 100% (覆盖 calc(100% - 256px) 内联) */
  .ant-layout-header[style],
  .ant-pro-fixed-header[style],
  .ant-pro-global-header[style] {
    width: 100% !important;
    left: 0 !important;
  }
  /* 底部工具栏也不要偏移 */
  .ant-pro-footer-toolbar {
    left: 0 !important;
    width: 100% !important;
  }

  /* Drawer 弹出时恢复显示 */
  .ant-drawer .ant-pro-sider-menu-sider,
  .ant-drawer .ant-layout-sider,
  .ant-drawer .ant-layout-sider-dark,
  .ant-drawer .ant-layout-sider-light,
  .ant-drawer aside.ant-layout-sider,
  .ant-drawer aside {
    display: block !important;
    width: 256px !important;
    min-width: 256px !important;
    max-width: 256px !important;
    flex: 0 0 256px !important;
    overflow: visible !important;
    min-height: 100% !important;
    position: relative !important;
    left: 0 !important;
  }
  .ant-drawer .ant-layout-sider-trigger {
    display: none !important;
  }
  .ant-drawer-left .ant-drawer-content-wrapper {
    width: 256px !important;
    max-width: 80vw !important;
  }
  .ant-pro-basicLayout {
    flex-direction: column !important;
  }
  /* 侧边栏菜单项加大触摸区域 */
  .ant-drawer .ant-menu-item,
  .ant-drawer .ant-menu-submenu-title {
    height: 48px !important;
    line-height: 48px !important;
    font-size: 14px !important;
    margin: 0 !important;
  }
  .ant-drawer .ant-menu-item .anticon,
  .ant-drawer .ant-menu-submenu-title .anticon {
    font-size: 18px !important;
  }
  /* Drawer 遮罩层 */
  .ant-drawer-mask {
    background: rgba(0,0,0,.45) !important;
  }
  /* Drawer 内 logo 区域 */
  .ant-drawer .ant-pro-sider-menu-logo {
    height: 48px !important;
    line-height: 48px !important;
    padding-left: 16px !important;
  }
  .ant-drawer .ant-pro-sider-menu-logo img {
    height: 28px !important;
  }
  .ant-drawer .ant-pro-sider-menu-logo h1 {
    font-size: 16px !important;
    margin-left: 8px !important;
  }

  /* ============================================
     3. 顶部导航栏
     ============================================ */
  .ant-pro-global-header,
  .ant-pro-basicLayout .ant-layout-header,
  .ant-layout-header.ant-pro-fixed-header {
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 8px !important;
  }
  /* 汉堡菜单按钮 */
  .ant-pro-global-header-trigger {
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 16px !important;
    font-size: 20px !important;
  }
  .ant-pro-global-header-trigger .anticon {
    font-size: 20px !important;
  }
  .ant-pro-global-header-logo {
    height: 48px !important;
    line-height: 48px !important;
    padding: 0 0 0 8px !important;
  }
  .ant-pro-global-header-logo img {
    height: 28px !important;
  }
  .ant-pro-global-header-logo h1 {
    font-size: 16px !important;
  }
  /* 右侧操作区 */
  .ant-pro-global-header-index-right {
    margin-right: 4px !important;
  }
  .ant-pro-global-header-index-right .ant-pro-global-header-index-action {
    padding: 0 8px !important;
  }
  /* 用户名隐藏 */
  .ant-pro-global-header-index-right .name {
    display: none !important;
  }
  .ant-pro-global-header-content {
    height: 48px !important;
    line-height: 48px !important;
  }
  .ant-pro-global-header .dark {
    height: 48px !important;
  }
  /* 顶部导航模式 */
  .ant-pro-top-nav-header {
    height: 48px !important;
  }
  .ant-pro-top-nav-header-main {
    height: 48px !important;
    padding-left: 8px !important;
  }
  .ant-pro-top-nav-header .ant-menu-submenu.ant-menu-submenu-horizontal {
    height: 48px !important;
    line-height: 48px !important;
  }
  /* Fixed header 时内容区偏移 */
  .ant-pro-basicLayout.ant-pro-basicLayout-has-header .ant-pro-basicLayout-content {
    margin-top: 48px !important;
  }

  /* ============================================
     4. 多标签页
     ============================================ */
  .ant-pro-multi-tab {
    margin: 0 -12px 8px -12px !important;
    padding: 0 !important;
  }
  .ant-pro-multi-tab-wrapper .ant-tabs-bar {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    white-space: nowrap !important;
    -webkit-overflow-scrolling: touch !important;
    margin-bottom: 0 !important;
  }
  .ant-pro-multi-tab-wrapper .ant-tabs-nav-container {
    overflow-x: auto !important;
  }
  .ant-pro-multi-tab-wrapper .ant-tabs-tab {
    padding: 6px 10px !important;
    font-size: 12px !important;
  }
  .ant-pro-multi-tab-wrapper .ant-tabs-tab .anticon-close {
    font-size: 10px !important;
    margin-left: 4px !important;
  }

  /* ============================================
     5. 内容区域
     ============================================ */
  .ant-pro-basicLayout-content {
    margin: 12px 8px !important;
    padding: 0 !important;
  }
  .ant-pro-basicLayout-content .ant-pro-page-header-wrap {
    margin: -12px -8px 0 !important;
  }
  .ant-pro-page-header-wrap-children-content {
    margin: 8px !important;
  }
  .ant-pro-grid-content.wide {
    max-width: 100% !important;
    padding: 0 !important;
  }

  /* ============================================
     6. 表格适配 (核心)
     ============================================ */
  .ant-table-wrapper {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    position: relative !important;
  }
  /* 表格滚动提示渐变 */
  .ant-table-wrapper::after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 20px;
    background: linear-gradient(to left, rgba(0,0,0,.06), transparent);
    pointer-events: none;
    z-index: 1;
    opacity: 1;
    transition: opacity .3s;
  }
  .ant-table {
    width: 100% !important;
    overflow-x: auto !important;
  }
  .ant-table-body,
  .ant-table-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .ant-table-content {
    overflow-x: auto !important;
  }
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 8px 6px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }
  .ant-table-thead > tr > th {
    font-weight: 600 !important;
    background: #fafafa !important;
  }
  /* 操作列按钮 */
  .ant-table-tbody > tr > td .ant-btn {
    padding: 0 6px !important;
    font-size: 12px !important;
    height: 28px !important;
    line-height: 26px !important;
    min-width: 44px !important;
  }
  .ant-table-tbody > tr > td .ant-btn + .ant-btn {
    margin-left: 4px !important;
  }
  .ant-table-tbody > tr > td a {
    display: inline-block;
    min-height: 32px;
    line-height: 32px;
    padding: 0 2px;
  }
  .ant-table-tbody > tr > td .ant-divider-vertical {
    margin: 0 2px !important;
  }
  /* 固定列阴影去除 (手机上不好看) */
  .ant-table-fixed-left,
  .ant-table-fixed-right {
    box-shadow: none !important;
  }
  /* 表格行选中高亮 */
  .ant-table-tbody > tr.ant-table-row-selected > td {
    background: #e6f7ff !important;
  }
  /* 分页 */
  .ant-table-pagination.ant-pagination {
    float: none !important;
    text-align: center !important;
    margin: 12px 0 !important;
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }
  .ant-pagination-item,
  .ant-pagination-prev,
  .ant-pagination-next,
  .ant-pagination-jump-prev,
  .ant-pagination-jump-next {
    min-width: 32px !important;
    height: 32px !important;
    line-height: 30px !important;
    margin-right: 0 !important;
  }
  .ant-pagination-options {
    display: none !important;
  }
  .ant-pagination-total-text {
    width: 100% !important;
    text-align: center !important;
    margin-bottom: 4px !important;
    font-size: 12px !important;
  }

  /* ============================================
     7. 搜索/筛选栏
     ============================================ */
  .table-page-search-wrapper {
    padding: 12px 8px !important;
    margin-bottom: 8px !important;
  }
  .table-page-search-wrapper .ant-form-inline {
    display: flex !important;
    flex-direction: column !important;
  }
  .table-page-search-wrapper .ant-form-inline .ant-form-item {
    display: flex !important;
    flex-direction: column !important;
    margin-bottom: 8px !important;
    width: 100% !important;
    margin-right: 0 !important;
  }
  .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label {
    width: 100% !important;
    text-align: left !important;
    padding: 0 0 2px 0 !important;
    line-height: 24px !important;
  }
  .table-page-search-wrapper .ant-form-inline .ant-form-item > .ant-form-item-label > label {
    font-size: 13px !important;
  }
  .table-page-search-wrapper .ant-form-inline .ant-form-item .ant-form-item-control-wrapper,
  .table-page-search-wrapper .ant-form-inline .ant-form-item .ant-form-item-control {
    width: 100% !important;
    flex: 1 !important;
  }
  /* 搜索按钮行 */
  .table-page-search-wrapper .table-page-search-submitButtons {
    display: flex !important;
    gap: 8px !important;
    margin-top: 4px !important;
  }

  /* ============================================
     8. 表格工具栏 / 操作按钮区
     ============================================ */
  .table-operator,
  .table-operations {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    align-items: center !important;
    margin-bottom: 8px !important;
    padding: 0 !important;
  }
  .table-operator .ant-btn,
  .table-operations .ant-btn {
    margin: 0 !important;
    font-size: 12px !important;
    padding: 0 10px !important;
    height: 32px !important;
    line-height: 30px !important;
    border-radius: 4px !important;
  }
  /* 打印按钮 */
  #btn-serial-connect,
  #btn-serial-print,
  #btn-serial-order,
  #btn-pc-print {
    flex: 1 1 calc(50% - 4px) !important;
    min-width: 0 !important;
    margin-left: 0 !important;
    text-align: center !important;
  }
  #serial-status {
    width: 100% !important;
    text-align: center !important;
    margin-left: 0 !important;
    margin-top: 0 !important;
    order: 99 !important;
    font-size: 12px !important;
  }

  /* ============================================
     9. 表单适配
     ============================================ */
  .ant-form-horizontal .ant-form-item {
    flex-direction: column !important;
    margin-bottom: 12px !important;
  }
  .ant-form-horizontal .ant-form-item-label {
    text-align: left !important;
    line-height: 28px !important;
    padding: 0 0 2px !important;
    width: 100% !important;
  }
  .ant-form-horizontal .ant-form-item-control-wrapper {
    width: 100% !important;
  }
  .ant-form-item {
    margin-bottom: 12px !important;
  }
  .ant-input {
    height: 38px !important;
    font-size: 14px !important;
  }
  .ant-input-number {
    width: 100% !important;
    height: 38px !important;
  }
  .ant-input-number-input {
    height: 36px !important;
  }
  .ant-select {
    font-size: 14px !important;
  }
  .ant-select-selection--single {
    height: 38px !important;
  }
  .ant-select-selection__rendered {
    line-height: 36px !important;
  }
  .ant-select-selection--multiple {
    min-height: 38px !important;
  }
  textarea.ant-input {
    height: auto !important;
    min-height: 80px !important;
  }
  /* 行内表单 */
  .ant-form-inline .ant-form-item {
    display: block !important;
    width: 100% !important;
    margin-right: 0 !important;
  }
  /* 表单按钮 */
  .ant-form .ant-btn + .ant-btn {
    margin-left: 8px !important;
  }
  /* 开关/复选框 */
  .ant-switch {
    min-width: 44px !important;
    height: 24px !important;
  }
  .ant-checkbox-wrapper {
    font-size: 14px !important;
  }
  .ant-radio-wrapper {
    font-size: 14px !important;
    margin-right: 12px !important;
  }

  /* ============================================
     10. 卡片适配
     ============================================ */
  .ant-card {
    margin-bottom: 8px !important;
    border-radius: 8px !important;
  }
  .ant-card-head {
    padding: 0 12px !important;
    min-height: 40px !important;
  }
  .ant-card-head-title {
    padding: 10px 0 !important;
    font-size: 14px !important;
  }
  .ant-card-body {
    padding: 12px !important;
  }
  .ant-card-extra {
    padding: 10px 0 !important;
    font-size: 13px !important;
  }
  .ant-card-grid {
    width: 50% !important;
    padding: 12px !important;
  }
  .ant-card-actions > li {
    font-size: 13px !important;
  }

  /* ============================================
     11. 弹窗适配
     ============================================ */
  .ant-modal {
    max-width: calc(100vw - 16px) !important;
    width: calc(100vw - 16px) !important;
    margin: 8px auto !important;
    top: 8px !important;
    padding-bottom: 8px !important;
  }
  .ant-modal-content {
    border-radius: 8px !important;
  }
  .ant-modal-header {
    padding: 12px 16px !important;
    border-radius: 8px 8px 0 0 !important;
  }
  .ant-modal-title {
    font-size: 15px !important;
  }
  .ant-modal-body {
    padding: 12px !important;
    max-height: calc(100vh - 160px) !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .ant-modal-footer {
    padding: 8px 12px !important;
  }
  .ant-modal-footer .ant-btn {
    min-width: 72px !important;
    height: 36px !important;
  }
  .ant-modal-close-x {
    width: 48px !important;
    height: 48px !important;
    line-height: 48px !important;
    font-size: 18px !important;
  }
  /* 弹窗内表单 */
  .ant-modal-body .ant-form-horizontal .ant-form-item {
    flex-direction: column !important;
  }
  .ant-modal-body .ant-form-horizontal .ant-form-item-label {
    width: 100% !important;
    text-align: left !important;
  }
  .ant-modal-body .ant-form-horizontal .ant-form-item-control-wrapper {
    width: 100% !important;
  }
  /* 弹窗内表格 */
  .ant-modal-body .ant-table-wrapper {
    margin: 0 -12px !important;
    width: calc(100% + 24px) !important;
  }
  /* 确认对话框 */
  .ant-modal-confirm .ant-modal-body {
    padding: 16px !important;
  }
  .ant-modal-confirm-body .ant-modal-confirm-content {
    font-size: 14px !important;
    margin-left: 0 !important;
    margin-top: 8px !important;
  }
  .ant-modal-confirm-body > .anticon {
    font-size: 20px !important;
  }

  /* ============================================
     12. 抽屉适配
     ============================================ */
  .ant-drawer-content-wrapper {
    width: 100% !important;
    max-width: 100vw !important;
  }
  .ant-drawer-body {
    padding: 12px !important;
  }
  .ant-drawer-header {
    padding: 12px 16px !important;
  }
  .ant-drawer-close {
    padding: 16px !important;
  }

  /* ============================================
     13. 按钮适配
     ============================================ */
  .ant-btn {
    font-size: 13px !important;
    min-height: 32px !important;
    border-radius: 4px !important;
  }
  .ant-btn-sm {
    font-size: 12px !important;
    padding: 0 8px !important;
    min-height: 28px !important;
  }
  .ant-btn-lg {
    height: 44px !important;
    font-size: 16px !important;
  }
  .ant-btn-group {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 4px !important;
  }
  /* 危险按钮加大 */
  .ant-btn-danger {
    min-width: 60px !important;
  }

  /* ============================================
     14. 下拉菜单
     ============================================ */
  .ant-dropdown-menu-item,
  .ant-dropdown-menu-submenu-title {
    padding: 10px 16px !important;
    font-size: 14px !important;
    line-height: 22px !important;
  }
  .ant-select-dropdown-menu-item {
    padding: 10px 12px !important;
    font-size: 14px !important;
    min-height: 36px !important;
  }
  .ant-select-dropdown {
    max-height: 50vh !important;
  }

  /* ============================================
     15. 标签页
     ============================================ */
  .ant-tabs-bar {
    margin-bottom: 12px !important;
  }
  .ant-tabs-tab {
    padding: 8px 12px !important;
    font-size: 13px !important;
  }
  .ant-tabs-content {
    padding: 0 !important;
  }
  .ant-tabs-nav-scroll {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* ============================================
     16. 描述列表
     ============================================ */
  .ant-descriptions-item-label,
  .ant-descriptions-item-content {
    padding: 8px !important;
    font-size: 13px !important;
  }
  .ant-descriptions-bordered .ant-descriptions-item-label {
    width: auto !important;
    min-width: 80px !important;
  }
  .ant-descriptions-row {
    display: flex !important;
    flex-direction: column !important;
  }
  .ant-descriptions-item {
    display: flex !important;
    padding-bottom: 0 !important;
  }

  /* ============================================
     17. 步骤条
     ============================================ */
  .ant-steps-horizontal:not(.ant-steps-label-vertical) {
    flex-direction: column !important;
  }
  .ant-steps-horizontal:not(.ant-steps-label-vertical) .ant-steps-item {
    margin-bottom: 8px !important;
    padding-left: 0 !important;
  }
  .ant-steps-item-icon {
    width: 28px !important;
    height: 28px !important;
    line-height: 26px !important;
    font-size: 14px !important;
  }

  /* ============================================
     18. 树形控件
     ============================================ */
  .ant-tree {
    font-size: 14px !important;
  }
  .ant-tree li {
    padding: 4px 0 !important;
  }
  .ant-tree-node-content-wrapper {
    min-height: 32px !important;
    line-height: 32px !important;
    padding: 0 8px !important;
  }
  .ant-tree-switcher {
    width: 32px !important;
    height: 32px !important;
    line-height: 32px !important;
  }

  /* ============================================
     19. 面包屑 / 页面头部
     ============================================ */
  .ant-breadcrumb {
    font-size: 12px !important;
  }
  .ant-page-header {
    padding: 8px 12px !important;
  }
  .ant-page-header-heading-title {
    font-size: 16px !important;
  }
  .ant-pro-page-header-wrap-main .ant-pro-page-header-wrap-row {
    display: block !important;
  }
  .ant-pro-page-header-wrap-main .ant-pro-page-header-wrap-extraContent {
    margin-left: 0 !important;
    text-align: left !important;
    min-width: unset !important;
    margin-top: 8px !important;
  }
  .ant-pro-page-header-wrap-main .ant-pro-page-header-wrap-detail {
    display: block !important;
  }

  /* ============================================
     20. 栅格系统
     ============================================ */
  .ant-row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .ant-col-sm-12,
  .ant-col-sm-24,
  .ant-col-md-6,
  .ant-col-md-8,
  .ant-col-md-12,
  .ant-col-md-24,
  .ant-col-lg-6,
  .ant-col-lg-8,
  .ant-col-lg-12,
  .ant-col-lg-24,
  .ant-col-xl-6,
  .ant-col-xl-8,
  .ant-col-xl-24 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .ant-col-xs-12 {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
  }
  .ant-col-xs-6 {
    width: 50% !important;
    max-width: 50% !important;
    flex: 0 0 50% !important;
  }

  /* ============================================
     21. 仪表盘 / 工作台
     ============================================ */
  .page-header-content {
    flex-direction: column !important;
  }
  .page-header-content .avatar {
    margin-bottom: 12px !important;
  }
  .page-header-content .content {
    margin-left: 0 !important;
  }
  .page-header-content .content .content-title {
    font-size: 16px !important;
  }
  .extra-content {
    float: none !important;
    margin-top: 12px !important;
  }
  .extra-content .stat-item {
    padding: 0 12px !important;
  }
  .extra-content .stat-item > p {
    font-size: 18px !important;
  }
  .project-list .ant-card-grid {
    width: 100% !important;
  }

  /* ============================================
     22. 账户设置
     ============================================ */
  .account-settings-info-main {
    display: block !important;
  }
  .account-settings-info-main .account-settings-info-left {
    border-right: none !important;
    border-bottom: 1px solid #e8e8e8 !important;
    width: 100% !important;
    height: auto !important;
  }
  .account-settings-info-main .account-settings-info-left .ant-menu {
    display: flex !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .account-settings-info-main .account-settings-info-left .ant-menu-item {
    flex-shrink: 0 !important;
  }
  .account-settings-info-main .account-settings-info-right {
    padding: 16px 0 !important;
  }
  .page-header-wrapper-grid-content-main .account-center-avatarHolder > .avatar {
    width: 72px !important;
    height: 72px !important;
  }

  /* ============================================
     23. 日期选择器
     ============================================ */
  .ant-calendar-picker {
    width: 100% !important;
  }
  .ant-calendar-range {
    width: 280px !important;
  }
  .ant-calendar-range-part {
    width: 100% !important;
  }
  .ant-calendar {
    width: 280px !important;
  }
  .ant-calendar-picker-container {
    left: 50% !important;
    transform: translateX(-50%) !important;
  }

  /* ============================================
     24. 上传组件
     ============================================ */
  .ant-upload-list-picture-card .ant-upload-list-item,
  .ant-upload.ant-upload-select-picture-card {
    width: 80px !important;
    height: 80px !important;
  }
  .avatar-upload-wrapper {
    height: 150px !important;
  }
  .ant-upload-preview {
    max-width: 120px !important;
  }

  /* ============================================
     25. 列表页
     ============================================ */
  .ant-list-item {
    padding: 12px 0 !important;
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .ant-list-item-meta {
    width: 100% !important;
  }
  .ant-list-item-meta-avatar {
    margin-right: 12px !important;
  }
  .ant-list-item-meta-title {
    font-size: 14px !important;
  }
  .ant-list-item-action {
    margin-left: 0 !important;
    margin-top: 8px !important;
  }
  .ant-list-item-action > li {
    padding: 0 8px !important;
  }

  /* ============================================
     26. 统计数值
     ============================================ */
  .ant-statistic-title {
    font-size: 12px !important;
  }
  .ant-statistic-content {
    font-size: 20px !important;
  }
  .ant-statistic-content-value {
    font-size: 20px !important;
  }

  /* ============================================
     27. 标签 / 徽标
     ============================================ */
  .ant-tag {
    font-size: 11px !important;
    padding: 0 6px !important;
    margin-right: 4px !important;
    margin-bottom: 4px !important;
    line-height: 22px !important;
  }
  .ant-badge-count {
    font-size: 10px !important;
    height: 16px !important;
    line-height: 16px !important;
    padding: 0 4px !important;
  }

  /* ============================================
     28. 提示 / 气泡
     ============================================ */
  .ant-tooltip-inner {
    font-size: 13px !important;
    max-width: 250px !important;
    padding: 8px 12px !important;
  }
  .ant-popover {
    max-width: calc(100vw - 24px) !important;
  }
  .ant-popover-inner-content {
    padding: 12px !important;
  }

  /* ============================================
     29. 通知 / 消息
     ============================================ */
  .ant-notification {
    width: calc(100vw - 24px) !important;
    max-width: 100% !important;
    margin-right: 12px !important;
  }
  .ant-message .ant-message-notice-content {
    max-width: calc(100vw - 32px) !important;
    font-size: 13px !important;
    padding: 8px 16px !important;
  }

  /* ============================================
     30. 时间线
     ============================================ */
  .ant-timeline-item-content {
    font-size: 13px !important;
    margin-left: 24px !important;
  }

  /* ============================================
     31. 折叠面板
     ============================================ */
  .ant-collapse-header {
    padding: 10px 12px !important;
    font-size: 14px !important;
  }
  .ant-collapse-content-box {
    padding: 12px !important;
  }

  /* ============================================
     32. 穿梭框
     ============================================ */
  .ant-transfer {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
  }
  .ant-transfer-list {
    width: 100% !important;
    height: 200px !important;
  }
  .ant-transfer-operation {
    margin: 8px 0 !important;
    transform: rotate(90deg) !important;
  }

  /* ============================================
     33. 进度条
     ============================================ */
  .ant-progress-text {
    font-size: 12px !important;
  }

  /* ============================================
     34. 底部工具栏
     ============================================ */
  .ant-pro-footer-toolbar {
    padding: 0 12px !important;
    padding-bottom: env(safe-area-inset-bottom) !important;
    height: 48px !important;
    line-height: 48px !important;
    left: 0 !important;
    width: 100% !important;
  }
  .ant-pro-footer-toolbar .ant-btn {
    margin-bottom: 0 !important;
  }

  /* ============================================
     35. 表单设计器
     ============================================ */
  .container {
    flex-direction: column !important;
  }
  .left-main {
    height: auto !important;
    max-height: 160px !important;
    overflow-y: auto !important;
    border-bottom: 1px solid #e8e8e8 !important;
    border-right: none !important;
  }
  .left-main .components-item {
    width: 100% !important;
    margin: 2px 0 !important;
  }
  .center-main {
    height: auto !important;
    min-height: 300px !important;
  }
  .right-main {
    height: auto !important;
    min-height: 250px !important;
    border-left: none !important;
    border-top: 1px solid #e8e8e8 !important;
  }

  /* ============================================
     36. 滚动条
     ============================================ */
  ::-webkit-scrollbar {
    width: 4px !important;
    height: 4px !important;
  }
  ::-webkit-scrollbar-thumb {
    background: rgba(0,0,0,.15) !important;
    border-radius: 4px !important;
  }

  /* ============================================
     37. 空状态 / 结果页
     ============================================ */
  .ant-empty-image {
    height: 60px !important;
  }
  .ant-empty-description {
    font-size: 13px !important;
  }
  .ant-result-title {
    font-size: 18px !important;
  }
  .ant-result-subtitle {
    font-size: 13px !important;
  }
  .ant-result-icon > .anticon {
    font-size: 48px !important;
  }

  /* ============================================
     38. 杂项
     ============================================ */
  .ant-affix {
    width: 100% !important;
  }
  .ant-back-top {
    right: 16px !important;
    bottom: calc(60px + env(safe-area-inset-bottom)) !important;
  }
  .ant-spin-container {
    overflow-x: hidden !important;
  }
  .ant-alert {
    padding: 8px 12px !important;
    font-size: 13px !important;
  }
  .ant-alert-with-description {
    padding: 12px !important;
  }
  .ant-pro-setting-drawer-content {
    width: 100% !important;
  }
  /* 富文本编辑器 */
  .tox-tinymce {
    min-height: 200px !important;
  }
  .tox .tox-toolbar__group {
    flex-wrap: wrap !important;
  }
  /* Monaco 编辑器 */
  .monaco-editor {
    min-height: 200px !important;
  }
  /* 图片预览 */
  .ant-modal-wrap .ant-image-preview-operations {
    padding: 8px !important;
  }
  /* 骨架屏 */
  .ant-skeleton-header {
    padding-right: 12px !important;
  }
  /* 下拉操作菜单 */
  .ant-pro-drop-down .ant-dropdown-menu-item {
    min-width: 120px !important;
  }

  /* ============================================
     39. 复选框列样式
     ============================================ */
  .batch-cb-th,
  .batch-cb-td {
    width: 40px !important;
    min-width: 40px !important;
    text-align: center !important;
    padding: 8px 2px !important;
  }
  .batch-cb-th input[type="checkbox"],
  .batch-cb-td input[type="checkbox"] {
    width: 22px !important;
    height: 22px !important;
    cursor: pointer;
    accent-color: #1890ff;
  }
  /* 选中信息栏 */
  #batch-sel-bar {
    font-size: 12px !important;
    padding: 6px 12px !important;
  }

  /* ============================================
     40. 触摸优化
     ============================================ */
  /* 所有可点击元素最小 44px 触摸区域 */
  .ant-menu-item,
  .ant-menu-submenu-title {
    min-height: 44px !important;
    line-height: 44px !important;
  }
  /* 链接加大点击区域 */
  a {
    -webkit-touch-callout: none;
  }
  /* 输入框聚焦时不缩放 (iOS) */
  input[type="text"],
  input[type="password"],
  input[type="email"],
  input[type="number"],
  input[type="tel"],
  input[type="url"],
  select,
  textarea {
    font-size: 16px !important;
  }
  /* 恢复 ant 组件内的字号 */
  .ant-input,
  .ant-select-selection__rendered,
  .ant-input-number-input {
    font-size: 14px !important;
  }

} /* 结束 max-width: 768px */


/* ============================================
   超小屏幕 (<= 480px) 额外适配
   ============================================ */
@media screen and (max-width: 480px) {

  /* 登录页更紧凑 */
  #userLayout.user-layout-wrapper,
  #userLayout.user-layout-wrapper.mobile {
    padding: 0 !important;
  }
  #userLayout.user-layout-wrapper .container {
    padding: 0 12px !important;
  }
  #userLayout.user-layout-wrapper .container .main {
    padding: 20px 16px 24px !important;
    border-radius: 8px !important;
  }
  .user-layout-login .welcome-login,
  .main .welcome-login {
    font-size: 18px !important;
    margin-top: 8px !important;
    margin-bottom: 20px !important;
  }
  #userLayout.user-layout-wrapper .container .top .header .title {
    font-size: 18px !important;
  }

  /* 内容区更紧凑 */
  .ant-pro-basicLayout-content {
    margin: 6px 4px !important;
  }

  /* 卡片更紧凑 */
  .ant-card-body {
    padding: 8px !important;
  }
  .ant-card-head {
    padding: 0 8px !important;
  }

  /* 表格更紧凑 */
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 6px 4px !important;
    font-size: 11px !important;
  }
  .ant-table-tbody > tr > td .ant-btn {
    font-size: 11px !important;
    padding: 0 4px !important;
    height: 24px !important;
    min-width: 36px !important;
  }

  /* 弹窗全屏 */
  .ant-modal {
    max-width: 100vw !important;
    width: 100vw !important;
    margin: 0 !important;
    top: 0 !important;
    padding-bottom: 0 !important;
  }
  .ant-modal-content {
    border-radius: 0 !important;
    min-height: 100vh !important;
  }
  .ant-modal-body {
    max-height: calc(100vh - 110px) !important;
  }

  /* 栅格全部单列 */
  .ant-col-xs-12,
  .ant-col-xs-6 {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
  }

  /* 分页更紧凑 */
  .ant-pagination-item,
  .ant-pagination-prev,
  .ant-pagination-next {
    min-width: 28px !important;
    height: 28px !important;
    line-height: 26px !important;
    font-size: 12px !important;
  }

  /* 日历 */
  .ant-calendar,
  .ant-calendar-range {
    width: 260px !important;
  }

  /* 统计数值 */
  .extra-content .stat-item {
    padding: 0 6px !important;
  }
  .extra-content .stat-item > p {
    font-size: 16px !important;
  }

  /* 打印按钮 */
  #btn-serial-connect,
  #btn-serial-print,
  #btn-serial-order,
  #btn-pc-print {
    flex: 1 1 calc(50% - 4px) !important;
  }
  #btn-serial-connect span,
  #btn-serial-print span,
  #btn-serial-order span,
  #btn-pc-print span {
    font-size: 11px !important;
  }
  /* 打印按钮图标在超小屏隐藏 */
  #btn-serial-connect .anticon,
  #btn-serial-print .anticon,
  #btn-serial-order .anticon,
  #btn-pc-print .anticon {
    display: none !important;
  }

  /* 搜索栏更紧凑 */
  .table-page-search-wrapper {
    padding: 8px !important;
  }

  /* 侧边栏 Drawer 更窄 */
  .ant-drawer-left .ant-drawer-content-wrapper {
    width: 220px !important;
  }

} /* 结束 max-width: 480px */


/* ============================================
   横屏模式优化
   ============================================ */
@media screen and (max-width: 768px) and (orientation: landscape) {

  .ant-pro-global-header,
  .ant-pro-global-header-trigger,
  .ant-pro-global-header-logo,
  .ant-pro-basicLayout .ant-layout-header {
    height: 40px !important;
    line-height: 40px !important;
  }

  .ant-pro-basicLayout-content {
    margin: 8px !important;
  }

  .ant-modal-body {
    max-height: calc(100vh - 100px) !important;
  }

  /* 横屏时表格可以显示更多列 */
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    padding: 6px 8px !important;
    font-size: 12px !important;
  }

  /* 横屏时弹窗不全屏 */
  .ant-modal {
    max-width: 90vw !important;
    width: 90vw !important;
    top: 5vh !important;
  }
  .ant-modal-content {
    min-height: auto !important;
  }

} /* 结束 landscape */


/* ============================================
   超大字体/无障碍模式
   ============================================ */
@media screen and (max-width: 768px) and (min-resolution: 2dppx) {
  /* 高 DPI 屏幕上细线边框 */
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    border-width: 0.5px !important;
  }
  .ant-card {
    border-width: 0.5px !important;
  }
}


/* ============================================
   复选框 & 打印按钮 (非媒体查询, 全局)
   ============================================ */
#batch-selection-bar {
  display: flex;
  align-items: center;
}
.batch-cb-th,
.batch-cb-td {
  width: 40px !important;
  min-width: 40px !important;
  text-align: center !important;
}
.batch-cb-th input[type="checkbox"],
.batch-cb-td input[type="checkbox"] {
  width: 16px;
  height: 16px;
  cursor: pointer;
  accent-color: #1890ff;
}
#serial-status {
  display: inline-block;
  vertical-align: middle;
}


/* ============================================
   打印样式 (window.print 时)
   ============================================ */
@media print {
  /* 隐藏非打印元素 */
  .ant-pro-sider-menu-sider,
  .ant-pro-global-header,
  .ant-layout-header,
  .ant-pro-multi-tab,
  .ant-pro-footer-toolbar,
  .ant-back-top,
  .table-operations,
  .table-operator,
  .table-page-search-wrapper,
  #batch-sel-bar,
  .ant-pagination {
    display: none !important;
  }
  .ant-pro-basicLayout-content {
    margin: 0 !important;
    padding: 0 !important;
  }
  .ant-card {
    border: none !important;
    box-shadow: none !important;
  }
  .ant-table-thead > tr > th,
  .ant-table-tbody > tr > td {
    white-space: normal !important;
  }
}