/* ===== 鼎设计ERP 响应式适配 v1.0 ===== */
/* 断点：≤768px 手机，769-1024px 平板，≥1025px 电脑 */

/* ---------- 平板端调整（769-1024px）：侧边栏240px完整显示文字 ---------- */
@media (min-width: 769px) and (max-width: 1024px) {
  :root {
    --sidebar-width: 240px;
  }
  .sidebar-resize-handle { display: none; }
}

@media (max-width: 768px) {
  :root {
    --sidebar-width: 240px;
  }

  /* 顶部栏简化 */
  .topbar {
    height: 50px;
    padding: 0 12px;
  }
  .topbar-left {
    gap: 5px !important;
  }
  .topbar-brand .logo-text {
    display: inline-block !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 1px !important;
    color: #fff !important;
    margin-left: 0 !important;
    white-space: nowrap;
  }
  .topbar-brand .logo-ver { display: none; }
  .topbar-search { display: none; }
  .topbar-title { font-size: 16px; }
  .topbar-user .user-info { display: none; }
  /* 菜单按钮与LOGO间距 */
  .mobile-menu-btn {
    margin-right: 0;
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    font-size: 18px;
  }
  .topbar-brand {
    display: none !important;
  }
  .topbar-brand .logo-img {
    width: 26px !important;
    height: 26px !important;
    margin-right: 0 !important;
  }
  .topbar-brand .logo-text {
    margin-left: 0 !important;
  }
  .msg-bell { margin-right: 8px; }

  /* 移动端菜单按钮 */
  .mobile-menu-btn {
    display: flex !important;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    cursor: pointer;
    font-size: 22px;
    color: #fff;
    margin-right: 8px;
  }

  /* 侧边栏抽屉式 */
  .app-body { position: relative; }
  #sidebar {
    position: fixed;
    top: 50px;
    left: 0;
    bottom: 0;
    height: auto; /* 修复：覆盖桌面端 .sidebar{height:100%}，避免 top:50px + 100%高 导致底部溢出屏幕、菜单滚不到底 */
    width: 240px;
    transform: translateX(-100%);
    transition: transform 0.3s ease;
    z-index: 200;
    box-shadow: 2px 0 12px rgba(0,0,0,0.15);
  }
  #sidebar.open {
    transform: translateX(0);
  }
  .sidebar-overlay {
    display: none;
    position: fixed;
    top: 50px;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,0.4);
    z-index: 199;
  }
  .sidebar-overlay.show { display: block; }

  /* 恢复侧边栏文字 */
  .sidebar-logo .logo-text,
  .sidebar-logo .logo-ver,
  .sidebar-nav .nav-label,
  .sidebar-nav .nav-group-title {
    display: inline;
  }
  .sidebar-nav .nav-item {
    justify-content: flex-start;
    padding: 10px 16px;
  }
  .sidebar-nav .nav-icon {
    margin-right: 10px;
    font-size: 16px;
  }

  /* 内容区 */
  .content {
    padding: 12px;
    padding-bottom: 70px; /* 底部导航高度 */
  }

  /* 底部导航 */
  .mobile-bottom-nav {
    display: flex !important;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 60px;
    background: #fff;
    border-top: 1px solid #eee;
    z-index: 150;
    box-shadow: 0 -2px 10px rgba(0,0,0,0.05);
  }
  .mobile-bottom-nav .nav-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: #999 !important;
    font-size: 11px;
    gap: 2px;
    transition: color 0.2s;
    /* 复位侧边栏 .nav-item 样式泄漏（圆角/内边距/悬浮底色） */
    background: transparent !important;
    box-shadow: none !important;
    border-right: none !important;
    border-radius: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    font-weight: 400 !important;
  }
  .mobile-bottom-nav .nav-item:hover,
  .mobile-bottom-nav .nav-item:active {
    background: transparent !important;
    box-shadow: none !important;
  }
  .mobile-bottom-nav .nav-item.active,
  .mobile-bottom-nav .nav-item.active > span,
  .mobile-bottom-nav .nav-item.active .icon,
  .mobile-bottom-nav .nav-item.active .icon svg {
    color: var(--primary) !important;
    background: transparent !important;
    box-shadow: none !important;
    font-weight: 600;
  }
  .mobile-bottom-nav .nav-item .icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    line-height: 0;
  }
  .mobile-bottom-nav .nav-item .icon svg {
    width: 23px;
    height: 23px;
  }

  /* 统计卡片：2列 */
  .stat-cards, .stats-grid, .dashboard-stats {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px;
  }
  .stat-card, .stat-box {
    padding: 12px;
  }
  .stat-card .stat-value {
    font-size: 18px;
  }
  .stat-card .stat-label {
    font-size: 12px;
  }

  /* ===== 工作台移动端适配 ===== */
  .welcome-card {
    padding: 16px !important;
    border-radius: 12px !important;
  }
  .welcome-greeting {
    font-size: 18px !important;
  }
  .welcome-stats {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
    margin-top: 12px !important;
  }
  .ws-item {
    padding: 8px !important;
    text-align: center;
  }
  .ws-value {
    font-size: 18px !important;
  }
  .ws-label {
    font-size: 11px !important;
  }
  /* 快捷入口：4列 */
  .quick-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
  }
  .quick-item {
    padding: 12px 4px !important;
  }
  .quick-icon {
    width: 40px !important;
    height: 40px !important;
    font-size: 20px !important;
    line-height: 40px !important;
  }
  .quick-label {
    font-size: 11px !important;
    margin-top: 4px !important;
  }
  /* 项目卡片：单列 */
  .project-cards, .card-list {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }
  .project-card, .card {
    padding: 12px !important;
  }
  /* 待办列表 */
  .todo-item {
    padding: 10px 12px !important;
  }
  .todo-title {
    font-size: 14px !important;
  }
  .todo-desc {
    font-size: 12px !important;
  }
  /* 两列网格变单列 */
  .home-grid-2 {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }

  /* ===== 项目/客户列表移动端适配 ===== */
  .project-item, .customer-item {
    padding: 14px !important;
    margin-bottom: 10px !important;
  }
  .project-header, .customer-header {
    flex-direction: column !important;
    align-items: flex-start !important;
    gap: 6px !important;
  }
  .project-info, .customer-info {
    grid-template-columns: 1fr !important;
    gap: 6px !important;
  }
  .progress-bar-wrap {
    height: 8px !important;
  }

  /* ===== 审批中心移动端适配 ===== */
  .approval-item, .approval-card {
    padding: 14px !important;
    margin-bottom: 10px !important;
  }
  .approval-header {
    flex-direction: column !important;
    gap: 6px !important;
  }
  .approval-actions {
    flex-direction: row !important;
    gap: 8px !important;
    margin-top: 10px !important;
  }
  .approval-actions .btn {
    flex: 1 !important;
    padding: 8px 0 !important;
    font-size: 13px !important;
  }

  /* ===== 统一列表引擎卡片视图 ===== */
  .le-card-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .le-card-item {
    background: #fff;
    border-radius: 10px;
    border: 1px solid #eee;
    padding: 14px;
    box-shadow: 0 1px 3px rgba(0,0,0,0.05);
  }
  .le-card-title {
    font-size: 15px;
    font-weight: 600;
    color: #222;
    margin-bottom: 10px;
    padding-bottom: 8px;
    border-bottom: 1px solid #f5f5f5;
  }
  .le-card-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 13px;
    padding: 3px 0;
  }
  .le-card-label {
    color: #999;
    flex-shrink: 0;
    margin-right: 10px;
  }
  .le-card-value {
    color: #333;
    text-align: right;
    flex: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .le-card-actions {
    display: flex;
    gap: 8px;
    margin-top: 10px;
    padding-top: 10px;
    border-top: 1px solid #f5f5f5;
  }
  .le-card-btn {
    flex: 1;
    padding: 6px 0;
    border-radius: 6px;
    font-size: 12px;
    cursor: pointer;
    border: 1px solid #ddd;
    background: #fff;
    color: #666;
  }

  /* 表格转卡片 */
  .le-table-wrapper, .table-responsive, .data-table-wrap {
    overflow-x: auto;
  }
  .le-table, table.tpl-table, .data-table {
    min-width: 600px;
  }

  /* 统一列表引擎移动端适配 */
  .le-toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }
  .le-search-input {
    flex: 1;
    min-width: 150px;
  }
  .le-filters {
    flex-wrap: wrap;
  }
  .le-filter-tag {
    padding: 4px 10px;
    font-size: 12px;
  }

  /* 表单：单列 */
  .le-form, .form-grid, .tpl-form {
    grid-template-columns: 1fr !important;
  }

  /* 按钮组换行 */
  .le-actions, .btn-group, .action-bar {
    flex-wrap: wrap;
    gap: 6px;
  }
  .le-btn, .btn {
    padding: 8px 14px;
    font-size: 13px;
  }

  /* 卡片列表 */
  .tpl-card-list, .card-list {
    grid-template-columns: 1fr !important;
  }

  /* 图表容器 */
  .chart-container, .chart-box {
    height: 250px !important;
  }

  /* 模态框 */
  .modal, .modal-dialog {
    width: 95% !important;
    max-width: 95% !important;
    margin: 10px auto !important;
  }
  .modal-body {
    max-height: 60vh;
    overflow-y: auto;
  }

  /* 分页器 */
  .le-pagination, .pagination {
    flex-wrap: wrap;
    justify-content: center;
  }

  /* 空状态 */
  .le-empty, .empty-state {
    padding: 40px 20px;
  }
  .le-empty-icon { font-size: 48px; }
  .le-empty-title { font-size: 16px; }

  /* ===== 通用内容适配：确保所有页面符合手机端显示 ===== */
  
  /* 所有表格容器横向滚动（防止页面溢出） */
  .table-container, .data-table-wrap, .tpl-table-wrap,
  .view-content table, .content table, .panel-body table {
    display: block;
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  /* 详情页信息：单列显示 */
  .detail-grid, .info-grid, .desc-grid, .field-grid,
  .detail-form, .info-form, .profile-info {
    grid-template-columns: 1fr !important;
    gap: 10px;
  }
  .detail-item, .info-item, .field-item {
    padding: 10px 12px;
  }
  .detail-label, .info-label {
    font-size: 12px;
    margin-bottom: 2px;
  }
  .detail-value, .info-value {
    font-size: 14px;
  }
  
  /* 数据大屏：缩放适配 */
  .screen-container, .dashboard-screen, .big-screen {
    transform: scale(0.5);
    transform-origin: top center;
    width: 200%;
    height: 200vh;
  }
  
  /* 步骤条/时间线：纵向排列 */
  .steps, .timeline, .progress-steps {
    flex-direction: column;
    align-items: flex-start;
  }
  .step-item, .timeline-item {
    width: 100%;
    margin-bottom: 12px;
  }
  
  /* 标签页：横向滚动 */
  .tabs, .tab-nav, .ant-tabs-nav {
    overflow-x: auto;
    flex-wrap: nowrap;
    -webkit-overflow-scrolling: touch;
  }
  .tab-item, .ant-tabs-tab {
    flex-shrink: 0;
    white-space: nowrap;
  }
  
  /* 描述列表：标签和值垂直排列 */
  .desc-list, .description-list, .dl-horizontal {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .desc-list dt, .description-list dt {
    font-weight: 600;
    font-size: 12px;
    color: #999;
  }
  .desc-list dd, .description-list dd {
    margin-left: 0;
    font-size: 14px;
  }
  
  /* 卡片内边距缩小 */
  .tpl-card, .panel, .card, .box {
    padding: 12px !important;
  }
  .tpl-card-header, .panel-header, .card-header {
    padding: 0 0 10px 0;
    margin-bottom: 10px;
  }
  .tpl-card-title, .panel-title, .card-title {
    font-size: 15px;
  }
  
  /* 按钮最小高度，方便手指点击 */
  .btn, .le-btn, button {
    min-height: 36px;
  }
  
  /* 输入框最小高度 */
  input, select, textarea {
    min-height: 36px;
    font-size: 14px;
  }
  
  /* 搜索栏：堆叠 */
  .search-bar, .filter-bar, .toolbar {
    flex-direction: column;
    align-items: stretch;
    gap: 8px;
  }
  .search-bar > *, .filter-bar > *, .toolbar > * {
    width: 100%;
  }
}

/* ---------- 平板端微调 ---------- */
@media (min-width: 769px) and (max-width: 1024px) {
  .content { padding: 16px; }
  .stat-cards, .stats-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .le-form, .form-grid {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  
  /* ===== 平板端内容适配 ===== */
  
  /* 表格容器横向滚动 */
  .table-container, .data-table-wrap, .tpl-table-wrap,
  .view-content table, .content table, .panel-body table {
    display: block;
    width: 100%;
    overflow-x: auto;
  }
  
  /* 详情页信息：2列 */
  .detail-grid, .info-grid, .desc-grid, .field-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }
  
  /* 数据大屏：适度缩放 */
  .screen-container, .dashboard-screen, .big-screen {
    transform: scale(0.75);
    transform-origin: top center;
    width: 133.33%;
  }
  
  /* 卡片内边距 */
  .tpl-card, .panel, .card, .box {
    padding: 14px !important;
  }
  
  /* 搜索栏：允许换行 */
  .search-bar, .filter-bar, .toolbar {
    flex-wrap: wrap;
    gap: 8px;
  }
}

/* ---------- 底部导航默认隐藏 ---------- */
.mobile-bottom-nav { display: none; }
.mobile-menu-btn { display: none; }
.sidebar-overlay { display: none; }

/* 底部导航单色线性图标：颜色跟随 currentColor（未选中灰、选中主色红，界面外观改色全局跟随） */
.mobile-bottom-nav .nav-item .icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* ===== 全局防溢出：确保所有页面不横向滚动 ===== */
@media (max-width: 1024px) {
  /* 全局盒模型 */
  *, *::before, *::after {
    box-sizing: border-box;
  }
  
  /* 防止页面整体横向溢出 */
  html, body {
    overflow-x: hidden;
    max-width: 100%;
  }
  
  /* 图片自适应 */
  img {
    max-width: 100%;
    height: auto;
  }
  
  /* 长文本自动换行 */
  p, span, div, td, th, li, h1, h2, h3, h4, h5, h6 {
    word-break: break-word;
    overflow-wrap: break-word;
  }
  
  /* 表格容器横向滚动 */
  .table-responsive, .table-wrap, .data-table,
  .view-content > div, .panel-body, .card-body {
    max-width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  
  /* 防止flex子元素溢出 */
  .flex, .flex-row, .d-flex, [style*="display:flex"] {
    flex-wrap: wrap;
  }
  .flex > *, .flex-row > *, .d-flex > * {
    max-width: 100%;
    min-width: 0;
  }
  
  /* 输入框不超出容器 */
  input, select, textarea {
    max-width: 100%;
  }
  
  /* 代码块横向滚动 */
  pre, code {
    overflow-x: auto;
    white-space: pre-wrap;
    word-break: break-all;
  }
  
  /* 固定宽度元素在小屏自适应 */
  [style*="width:"] {
    max-width: 100% !important;
  }
}

/* ---------- 平板横屏优化（769-1024px 横屏） ---------- */
@media (min-width: 769px) and (max-width: 1024px) and (orientation: landscape) {
  :root {
    --sidebar-width: 220px;
  }
  .content { padding: 20px; }
  .stat-cards, .stats-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  .le-form, .form-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .detail-grid, .info-grid {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .tpl-card, .panel, .card {
    padding: 16px !important;
  }
}

/* ---------- 手机横屏优化（≤768px 横屏） ---------- */
@media (max-width: 768px) and (orientation: landscape) {
  .topbar { height: 44px; }
  #sidebar { top: 44px; }
  .sidebar-overlay { top: 44px; }
  .content { padding: 10px; padding-bottom: 60px; }
  .stat-cards, .stats-grid {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  .stat-card .stat-value { font-size: 16px; }
  .stat-card .stat-label { font-size: 11px; }
  .mobile-bottom-nav { height: 50px; }
}

/* ---------- 移动端页面转场优化（更接近原生App） ---------- */
@media (max-width: 1024px) {
  .page-enter {
    animation: mobilePageSlide 0.25s cubic-bezier(0.4, 0, 0.2, 1);
  }
  @keyframes mobilePageSlide {
    from {
      opacity: 0;
      transform: translateX(20px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  /* 移动端卡片级联动画更快 */
  .page-enter .card {
    animation-duration: 0.3s;
  }
  .page-enter .card:nth-child(1) { animation-delay: 0.03s; }
  .page-enter .card:nth-child(2) { animation-delay: 0.06s; }
  .page-enter .card:nth-child(3) { animation-delay: 0.09s; }
  .page-enter .card:nth-child(4) { animation-delay: 0.12s; }
  .page-enter .card:nth-child(5) { animation-delay: 0.15s; }
  .page-enter .card:nth-child(n+6) { animation-delay: 0.18s; }
  
  /* 按钮点击反馈 */
  .btn:active, button:active, .le-btn:active {
    transform: scale(0.96);
    transition: transform 0.1s;
  }
  
  /* 列表项点击反馈 */
  .le-card-item:active, .nav-item:active, .list-item:active {
    background: #f5f5f5;
    transition: background 0.1s;
  }
  
  /* 减少动画（用户开启减少动态效果时） */
  @media (prefers-reduced-motion: reduce) {
    .page-enter, .page-enter .card {
      animation: none !important;
    }
    .btn:active, button:active {
      transform: none !important;
    }
  }
}

/* ===== 页面级通用响应式（覆盖83个页面） ===== */
@media (max-width: 1024px) {
  /* 数据大屏页面 */
  .screen-page, .dashboard-page, .big-screen-page, [data-page="dashboard"], [data-page="screen"] {
    transform: scale(0.6);
    transform-origin: top center;
    width: 166.67%;
    min-height: 160vh;
  }
  
  /* 图表容器 */
  .chart-wrapper, .echarts-container, .chart-box, [id*="chart"], [class*="chart"] {
    width: 100% !important;
    height: 250px !important;
    min-height: 200px;
  }
  
  /* 日历页面 */
  .calendar-container, .fc, .fullcalendar {
    font-size: 12px;
  }
  .fc-header-toolbar, .calendar-header {
    flex-wrap: wrap;
    gap: 8px;
  }
  .fc-daygrid-day, .calendar-day {
    min-height: 60px;
  }
  
  /* 甘特图/时间线 */
  .gantt-container, .timeline-container, .kanban-container {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .gantt-chart, .timeline-chart {
    min-width: 600px;
  }
  
  /* 看板页面 */
  .kanban-board, .board-container {
    flex-direction: column;
  }
  .kanban-column, .board-column {
    width: 100% !important;
    margin-bottom: 12px;
  }
  
  /* 编辑器页面 */
  .editor-container, .rich-editor, .markdown-editor {
    height: 400px;
  }
  .editor-toolbar {
    flex-wrap: wrap;
  }
  
  /* 文件上传/管理页面 */
  .file-list, .upload-list {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .file-item, .upload-item {
    padding: 10px;
  }
  
  /* 图片预览/相册页面 */
  .photo-grid, .image-grid, .gallery {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px;
  }
  
  /* 地图页面 */
  .map-container, #map, [class*="map"] {
    height: 300px !important;
  }
  
  /* 打印/预览页面 */
  .print-container, .preview-container {
    padding: 10px;
  }
  .print-page, .preview-page {
    transform: scale(0.7);
    transform-origin: top left;
    width: 142.86%;
  }
  
  /* 代码/日志页面 */
  .log-container, .code-container, pre {
    font-size: 11px;
    max-height: 400px;
    overflow: auto;
  }
  
  /* 设置/配置页面 */
  .settings-tabs, .config-tabs {
    overflow-x: auto;
    flex-wrap: nowrap;
  }
  .settings-tab, .config-tab {
    flex-shrink: 0;
    white-space: nowrap;
  }
  
  /* 向导/步骤页面 */
  .wizard-steps, .setup-steps {
    flex-direction: column;
  }
  .wizard-step, .setup-step {
    width: 100%;
    margin-bottom: 8px;
  }
  
  /* 对比/分屏页面 */
  .split-view, .compare-view, .dual-panel {
    flex-direction: column;
  }
  .split-pane, .compare-pane {
    width: 100% !important;
    margin-bottom: 12px;
  }
}

/* 平板端特定优化 */
@media (min-width: 769px) and (max-width: 1024px) {
  .file-list, .upload-list {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .photo-grid, .image-grid, .gallery {
    grid-template-columns: repeat(3, 1fr) !important;
  }
  .chart-wrapper, .echarts-container, .chart-box {
    height: 300px !important;
  }
}

/* 固定浅色主题：不跟随系统深色模式（企业ERP统一浅色，避免手机开深色模式时卡片缝隙/页面边缘透黑） */
html { color-scheme: light; }
@media (prefers-color-scheme: dark) {
  body:not(.dark) {
    background: var(--bg, #f5f6fa) !important;
    color: var(--text, #1a1a1a) !important;
  }
  body:not(.dark) .content,
  body:not(.dark) .view-content,
  body:not(.dark) .main-content,
  body:not(.dark) #view-content,
  body:not(.dark) .app-main,
  body:not(.dark) .page-content {
    background: var(--bg, #f5f6fa) !important;
  }
}

/* ===== 数据大屏移动端专门布局（非简单缩放） ===== */
@media (max-width: 1024px) {
  /* 大屏容器：取消缩放，改为流式布局 */
  .screen-container,
  .big-screen-container,
  .dashboard-screen,
  [class*="screen"] {
    transform: none !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100vh;
    overflow-y: auto;
  }
  
  /* 大屏头部 */
  .screen-header,
  .big-screen-header {
    height: 50px !important;
    padding: 0 12px !important;
  }
  .screen-title,
  .big-screen-title {
    font-size: 16px !important;
  }
  .screen-time,
  .big-screen-time {
    font-size: 12px !important;
  }
  
  /* 大屏主体：单列布局 */
  .screen-body,
  .big-screen-body,
  .screen-main,
  .dashboard-body {
    display: flex !important;
    flex-direction: column !important;
    padding: 12px !important;
    gap: 12px !important;
  }
  
  /* 大屏面板：全宽 */
  .screen-panel,
  .big-screen-panel,
  .dashboard-panel,
  .screen-card {
    width: 100% !important;
    height: auto !important;
    min-height: 200px;
    margin-bottom: 12px !important;
  }
  
  /* 大屏图表容器 */
  .screen-chart,
  .big-screen-chart,
  .dashboard-chart {
    height: 220px !important;
    width: 100% !important;
  }
  
  /* 数据卡片：2列网格 */
  .screen-stats,
  .big-screen-stats,
  .dashboard-stats {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .screen-stat-item,
  .big-screen-stat-item,
  .dashboard-stat-item {
    padding: 12px !important;
  }
  .screen-stat-value,
  .big-screen-stat-value,
  .dashboard-stat-value {
    font-size: 20px !important;
  }
  .screen-stat-label,
  .big-screen-stat-label,
  .dashboard-stat-label {
    font-size: 11px !important;
  }
  
  /* 大屏表格：横向滚动 */
  .screen-table,
  .big-screen-table {
    display: block;
    overflow-x: auto;
    font-size: 12px;
  }
  
  /* 隐藏大屏装饰元素（移动端不需要） */
  .screen-decoration,
  .big-screen-decoration,
  .screen-bg-effect {
    display: none !important;
  }
  
  /* 大屏底部 */
  .screen-footer,
  .big-screen-footer {
    display: none !important;
  }
}

/* 平板端大屏：2列布局 */
@media (min-width: 769px) and (max-width: 1024px) {
  .screen-stats,
  .big-screen-stats,
  .dashboard-stats {
    grid-template-columns: repeat(4, 1fr) !important;
  }
  .screen-body,
  .big-screen-body {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* ===== 数据看板/图表页面全局响应式适配 ===== */
@media (max-width: 768px) {
  /* 图表网格：手机端单列 */
  .chart-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
    margin-top: 12px !important;
  }
  .chart-grid.cols-2,
  .chart-grid.cols-3,
  .chart-grid.cols-4 {
    grid-template-columns: 1fr !important;
  }
  
  /* 图表容器：确保有足够高度 */
  .chart-box {
    height: 240px !important;
    min-height: 240px !important;
  }
  .chart-box canvas {
    height: 240px !important;
    min-height: 240px !important;
  }
  
  /* 模板卡片：高度自适应，避免全局高度限制 */
  .tpl-card {
    height: auto !important;
    min-height: 0 !important;
    margin-bottom: 12px !important;
  }
  .tpl-card-header {
    height: auto !important;
    min-height: 0 !important;
    padding: 12px !important;
  }
  .tpl-card-title {
    height: auto !important;
    min-height: 0 !important;
    font-size: 14px !important;
  }
  .tpl-card-body {
    padding: 12px !important;
  }
  
  /* 卡片网格：手机端单列 */
  .card-grid {
    grid-template-columns: 1fr !important;
    gap: 12px !important;
  }
  .card-grid.cols-2,
  .card-grid.cols-3,
  .card-grid.cols-4,
  .card-grid.cols-5 {
    grid-template-columns: 1fr !important;
  }
  
  /* 统计卡片：手机端2列 */
  .stat-grid,
  .stats-grid,
  .stat-cards {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .stat-card,
  .stats-card {
    padding: 12px !important;
    height: auto !important;
    min-height: 0 !important;
  }
  .stat-card .stat-value,
  .stats-card .stat-value {
    font-size: 18px !important;
  }
  .stat-card .stat-label,
  .stats-card .stat-label {
    font-size: 11px !important;
  }
}

/* 平板端适配 */
@media (min-width: 769px) and (max-width: 1024px) {
  .chart-grid.cols-3,
  .chart-grid.cols-4 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .card-grid.cols-3,
  .card-grid.cols-4,
  .card-grid.cols-5 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
  .stat-grid,
  .stats-grid,
  .stat-cards {
    grid-template-columns: repeat(3, 1fr) !important;
  }
}

/* ===== 修复数据看板卡片高度问题 ===== */
@media (max-width: 768px) {
  .chart-grid {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
    display: grid !important;
    grid-auto-rows: auto !important;
    align-items: start !important;
  }
  .chart-grid .tpl-card {
    height: auto !important;
    min-height: 280px !important;
    align-self: start !important;
    overflow: visible !important;
  }
  .chart-grid .tpl-card .chart-box {
    height: 240px !important;
    min-height: 240px !important;
  }
  .chart-grid .tpl-card-header {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* ===== AI智能助手三端响应式适配 ===== */
/* 手机端 */
@media (max-width: 768px) {
  .ai-fab {
    width: 48px !important;
    height: 48px !important;
    font-size: 20px !important;
    right: 16px;
    bottom: 80px; /* 避免被底部导航栏遮挡 */
    z-index: 99999 !important;
  }
  .ai-panel {
    width: 100% !important;
    max-width: 100% !important;
    left: 0 !important;
    right: 0 !important;
  }
  .ai-header {
    padding: 12px 16px !important;
  }
  .ai-messages {
    padding: 12px !important;
  }
  .ai-input-area {
    padding: 10px 12px !important;
  }
  .ai-quick {
    max-height: 200px !important;
    overflow-y: auto !important;
  }
}

/* 平板端 */
@media (min-width: 769px) and (max-width: 1024px) {
  .ai-fab {
    width: 52px !important;
    height: 52px !important;
    font-size: 22px !important;
    right: 18px;
    bottom: 20px;
  }
  .ai-panel {
    width: 380px !important;
    max-width: 85% !important;
  }
}

/* 电脑端 */
@media (min-width: 1025px) {
  .ai-fab {
    width: 56px !important;
    height: 56px !important;
    font-size: 24px !important;
    right: 20px;
    bottom: 20px;
  }
  .ai-panel {
    width: 420px !important;
  }
}

/* AI球确保可点击 */
.ai-fab {
  touch-action: none !important;
  -webkit-tap-highlight-color: transparent !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  cursor: pointer !important;
}
.ai-fab:active {
  transform: scale(0.95) !important;
}
