/* ============================================================
   鼎设计ERP - 全面响应式增强CSS
   强制所有页面自适应手机端和平板端
   版本: v1.0
   ============================================================ */

/* ---------- 全局防溢出（所有屏幕尺寸） ---------- */
@media (max-width: 1024px) {
  /* 全局盒模型 */
  *, *::before, *::after {
    box-sizing: border-box !important;
  }

  /* 防止页面整体横向溢出 */
  html, body {
    overflow-x: hidden !important;
    max-width: 100% !important;
  }

  /* 主容器不溢出 */
  .app-container, .app-body, .main-content, .content,
  #app, #main, .view-container, .page-container {
    max-width: 100% !important;
    overflow-x: hidden !important;
  }

  /* 图片自适应 */
  img {
    max-width: 100% !important;
    height: auto !important;
  }

  /* 长文本自动换行 */
  p, span, div, td, th, li, h1, h2, h3, h4, h5, h6, label {
    word-break: break-word !important;
    overflow-wrap: break-word !important;
  }

  /* 输入框不超出容器 */
  input, select, textarea {
    max-width: 100% !important;
  }

  /* 固定宽度元素在小屏自适应 */
  [style*="width:"] {
    max-width: 100% !important;
  }

  /* 防止flex子元素溢出 */
  [style*="display:flex"] {
    flex-wrap: wrap !important;
  }
  [style*="display:flex"] > * {
    max-width: 100% !important;
    min-width: 0 !important;
  }

  /* 手机/平板端：侧栏底部版本栏字号缩到桌面的约 60% */
  .sidebar-footer { padding: 6px 8px !important; }
  .sidebar-footer .sf-row { font-size: 6.6px !important; gap: 4px !important; }
  .sidebar-footer .sf-dot { width: 4px !important; height: 4px !important; }
  .sidebar-footer .sf-copy { font-size: 6px !important; margin-top: 2px !important; }
  .sidebar-footer .sf-copy-gap { margin-left: 6px !important; }
}

/* ---------- 手机端（≤768px）全面适配 ---------- */
@media (max-width: 768px) {
  /* ===== 内容区内边距缩小 ===== */
  .content, .main-content, .view-content, .page-content {
    padding: 10px !important;
    padding-bottom: 70px !important;
  }

  /* ===== 卡片内边距缩小 ===== */
  .card, .tpl-card, .panel, .box, .widget {
    padding: 12px !important;
    margin-bottom: 10px !important;
  }
  .card-header, .tpl-card-header, .panel-header {
    padding: 10px 12px !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .card-title, .tpl-card-title {
    font-size: 15px !important;
  }
  .card-body, .tpl-card-body, .panel-body {
    padding: 10px 12px !important;
  }

  /* ===== 表格：强制横向滚动 ===== */
  /* 所有表格容器 */
  .table-wrap, .table-container, .data-table-wrap, .tpl-table-wrap,
  .table-responsive, .le-table-wrap, .voucher-table-wrap,
  .content > div > table, .view-content > table,
  .card > table, .panel > table, .tpl-card > table {
    display: block !important;
    width: 100% !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    max-width: 100% !important;
  }

  /* 所有表格本身 */
  table, .data-table, .tpl-table, .le-table, .voucher-table,
  .qe-item-table, .entries-table, .subject-table {
    width: 100% !important;
    max-width: none !important;
    min-width: 600px !important;
    table-layout: auto !important;
    font-size: 12px !important;
  }

  /* 表格单元格缩小内边距 */
  table th, table td,
  .data-table th, .data-table td,
  .tpl-table th, .tpl-table td {
    padding: 6px 8px !important;
    font-size: 12px !important;
    white-space: nowrap !important;
  }

  /* 列表引擎表格特殊处理 */
  .le-table-container, .le-table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .le-table {
    min-width: 600px !important;
  }

  /* ===== 表单：强制单列布局 ===== */
  /* 所有表单网格 */
  .form-grid, .le-form, .form-row-grid,
  .detail-grid, .info-grid, .desc-grid, .field-grid,
  .detail-form, .info-form, .profile-info,
  .qq-form-grid, .rate-grid, .fee-grid {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* 表单行 */
  .form-row, .le-form-row, .field-item, .detail-item, .info-item {
    margin-bottom: 10px !important;
  }
  .form-row label, .le-form-row label {
    font-size: 13px !important;
    margin-bottom: 4px !important;
  }
  .form-row input, .form-row select, .form-row textarea,
  .le-form-row input, .le-form-row select, .le-form-row textarea {
    font-size: 14px !important;
    padding: 8px 10px !important;
    width: 100% !important;
  }

  /* 内联样式的grid布局强制单列 */
  [style*="grid-template-columns"] {
    grid-template-columns: 1fr !important;
  }

  /* ===== 搜索栏和工具栏：允许换行 ===== */
  .search-bar, .filter-bar, .toolbar, .tpl-search-bar,
  .le-toolbar, .le-search-bar, .page-header,
  .tpl-filter-tabs, .filter-tabs {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .search-bar input, .filter-bar input, .toolbar input,
  .tpl-search-bar input, .le-toolbar input {
    flex: 1 1 140px !important;
    min-width: 0 !important;
  }
  /* 工具栏操作按钮不被压缩，紧跟搜索框同一排；排不下时整组自然换到第二排 */
  .search-bar > button, .filter-bar > button, .toolbar > button,
  .tpl-search-bar > button, .le-toolbar-actions, .le-toolbar-actions > button {
    flex-shrink: 0 !important;
  }
  .tpl-search-bar > .btn, .tpl-search-bar > button { white-space: nowrap !important; }
  .search-bar select, .filter-bar select, .toolbar select,
  .tpl-search-bar select, .le-toolbar select {
    flex: 1 1 calc(50% - 4px) !important;
    min-width: 0 !important;
  }

  /* ===== 按钮：全站统一尺寸（含列表引擎 .le-btn，保证各页面一致） ===== */
  .btn, .btn-primary, .btn-default, .btn-sm, .btn-lg,
  .le-btn, .le-toolbar .le-btn, .le-form .le-btn,
  .modal-footer .btn, .modal-footer button,
  .le-pagination .le-btn {
    min-height: 38px !important;
    height: auto !important;
    line-height: 1.2 !important;
    font-size: 14px !important;
    padding: 9px 16px !important;
    border-radius: 8px !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }
  .btn-sm { min-height: 34px !important; padding: 7px 12px !important; font-size: 13px !important; }
  /* 主操作按钮统一品牌红，次操作统一浅灰描边 */
  .btn-primary, .le-btn-primary {
    background: var(--primary) !important; color: #fff !important; border: 1px solid var(--primary) !important;
  }
  .btn-secondary, .le-btn-secondary {
    background: #fff !important; color: #333 !important; border: 1px solid #ddd !important;
  }
  .btn-group, .button-group, .le-toolbar-actions {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* ===== 统计卡片：2列布局 ===== */
  .stat-cards, .stats-grid, .dashboard-stats,
  .stat-grid, .stat-boxes, .welcome-stats {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }
  .stat-card, .stat-box, .stats-card {
    padding: 12px !important;
    min-height: 0 !important;
    height: auto !important;
  }
  .stat-card .stat-value, .stat-box .stat-value {
    font-size: 18px !important;
  }
  .stat-card .stat-label, .stat-box .stat-label {
    font-size: 11px !important;
  }

  /* ===== 卡片网格：单列布局 ===== */
  .card-grid, .cards-grid, .grid-cards,
  .card-grid.cols-2, .card-grid.cols-3, .card-grid.cols-4,
  .tpl-card-list, .photo-grid, .sm-card-list, .fu-card-list {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
  }

  /* 施工照片网格：2列 */
  #photoGrid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }

  /* ===== 图表网格：单列布局 ===== */
  .chart-grid, .charts-grid, .grid-charts {
    grid-template-columns: 1fr !important;
    gap: 10px !important;
    height: auto !important;
  }
  .chart-box, .chart-container {
    height: 250px !important;
    min-height: 250px !important;
  }

  /* ===== 模态框：全屏适配 ===== */
  .modal, .modal-dialog, .modal-content,
  .le-modal, .tpl-modal, .upload-modal {
    width: 95% !important;
    max-width: 95% !important;
    max-height: 90vh !important;
    overflow-y: auto !important;
    margin: 5vh auto !important;
    left: 2.5% !important;
    right: 2.5% !important;
  }
  .modal-header, .modal-footer {
    padding: 12px 16px !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .modal-body {
    padding: 16px !important;
    max-height: 60vh !important;
    overflow-y: auto !important;
  }

  /* ===== 步骤条/时间线：纵向排列 ===== */
  .steps, .timeline, .progress-steps, .wizard-steps {
    flex-direction: column !important;
    align-items: flex-start !important;
  }
  .step-item, .timeline-item, .wizard-step {
    width: 100% !important;
    margin-bottom: 12px !important;
  }

  /* ===== 标签页：横向滚动 ===== */
  .tabs, .tab-nav, .ant-tabs-nav, .le-tabs, .tpl-tabs {
    overflow-x: auto !important;
    flex-wrap: nowrap !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .tab-item, .ant-tabs-tab, .le-tab, .tpl-tab {
    flex-shrink: 0 !important;
    white-space: nowrap !important;
  }

  /* ===== 分页：自适应 ===== */
  .pagination, .le-pagination, .tpl-pagination {
    flex-wrap: wrap !important;
    gap: 4px !important;
    justify-content: center !important;
  }
  .pagination button, .le-pagination button, .tpl-pagination button {
    min-width: 32px !important;
    height: 32px !important;
    font-size: 12px !important;
    padding: 0 8px !important;
  }

  /* ===== 下拉菜单：自适应宽度 ===== */
  .dropdown, .dropdown-menu, .select-dropdown {
    max-width: 90vw !important;
    overflow-x: auto !important;
  }

  /* ===== 提示框/Toast：自适应（toast 保持顶部居中，不拉伸） ===== */
  .toast {
    max-width: 88vw !important;
    left: 50% !important;
    right: auto !important;
  }
  .alert, .notification {
    max-width: 90vw !important;
    left: 5vw !important;
    right: 5vw !important;
  }

  /* ===== 系统设置：移动端顶部导航扁平化为单行横向滚动 chip，整齐统一 ===== */
  .settings-sidebar {
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    gap: 8px !important;
    -webkit-overflow-scrolling: touch !important;
  }
  .settings-cat-group {
    flex-direction: row !important;
    flex-shrink: 0 !important;
    min-width: 0 !important;
    gap: 8px !important;
  }
  .settings-cat-title { display: none !important; }
  .settings-sidebar .settings-nav-btn {
    width: auto !important;
    flex-shrink: 0 !important;
    text-align: center !important;
    padding: 7px 14px !important;
    border: 1px solid #e0e0e0 !important;
    border-left: 1px solid #e0e0e0 !important;
    border-radius: 16px !important;
    background: #fff !important;
    color: #555 !important;
    white-space: nowrap !important;
  }
  .settings-sidebar .settings-nav-btn.active {
    background: var(--primary) !important;
    color: #fff !important;
    border-color: var(--primary) !important;
  }

  /* ===== 列表引擎移动端卡片：统一间距与操作按钮 ===== */
  .le-card-list { gap: 10px; }
  .le-card-item { padding: 14px !important; border-radius: 10px !important; }
  .le-card-title { font-size: 15px !important; }
  .le-card-row { font-size: 13px !important; }
  .le-card-actions { gap: 8px !important; }
  .le-card-btn {
    min-height: 36px !important;
    font-size: 13px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border-radius: 8px !important;
  }

  /* ===== 侧边栏抽屉式（已有，确保生效） ===== */
  #sidebar {
    position: fixed !important;
    top: 50px !important;
    left: 0 !important;
    bottom: 0 !important;
    height: auto !important; /* 修复：覆盖桌面端 .sidebar{height:100%}，避免抽屉底部溢出屏幕、菜单滚不到底 */
    width: 240px !important;
    transform: translateX(-100%) !important;
    transition: transform 0.3s ease !important;
    z-index: 200 !important;
    box-shadow: 2px 0 12px rgba(0,0,0,0.15) !important;
  }
  #sidebar.open {
    transform: translateX(0) !important;
  }

  /* ===== 顶部栏简化 ===== */
  .topbar {
    height: 50px !important;
    padding: 0 12px !important;
  }
  .topbar-title {
    font-size: 16px !important;
  }
  .topbar-search, .topbar-user .user-info {
    display: none !important;
  }

  /* ===== 底部导航显示 ===== */
  .mobile-bottom-nav {
    display: flex !important;
  }

  /* ===== 特定页面适配 ===== */

  /* 报价编辑页面 */
  #qeContainer {
    max-width: 100% !important;
  }
  .qe-space-head {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }
  .qe-space-body {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }

  /* 快速报价页面 */
  #qqContainer {
    max-width: 100% !important;
  }
  #qq_packages {
    grid-template-columns: 1fr !important;
  }

  /* 财务凭证页面 */
  .finance-voucher-page {
    max-width: 100% !important;
  }
  .entries-table {
    min-width: 600px !important;
  }

  /* 系统设置页面 */
  .settings-container, .config-container {
    max-width: 100% !important;
  }
  .settings-section, .config-section {
    margin-bottom: 12px !important;
  }

  /* 知识库页面 */
  .kb-container, .qa-container {
    max-width: 100% !important;
  }

  /* AI中心页面 */
  .ai-center-container, .voice-area {
    max-width: 100% !important;
  }

  /* 摄像头页面 */
  .camera-grid {
    grid-template-columns: 1fr !important;
  }

  /* 消息中心页面 */
  .split-layout {
    flex-direction: column !important;
  }
  .split-left {
    width: 100% !important;
    max-height: 200px !important;
    overflow-y: auto !important;
    border-right: none !important;
    border-bottom: 1px solid #eee !important;
  }
  .split-right {
    width: 100% !important;
    padding: 10px !important;
  }

  /* 打卡页面 */
  .clock-hero {
    padding: 20px 16px !important;
  }
  .clock-buttons {
    flex-wrap: wrap !important;
    gap: 10px !important;
  }
  .clock-btn {
    flex: 1 1 calc(50% - 5px) !important;
    min-width: 0 !important;
  }

  /* 施工照片页面 */
  #uploadModal .modal-content {
    width: 95% !important;
    max-width: 95% !important;
  }

  /* 量房页面 */
  .sm-room-card {
    margin-bottom: 10px !important;
  }
  .sm-room-body {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* SCRM跟进页面 */
  .fu-card, .tpl-card-item {
    margin-bottom: 10px !important;
  }

  /* 首页工作台 */
  .welcome-card {
    padding: 16px !important;
  }
  .quick-grid {
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 8px !important;
  }
  .quick-item {
    padding: 12px 4px !important;
  }

  /* 二维码弹窗 */
  #unifiedQrModal .modal-content,
  .qr-modal .modal-content {
    width: 90% !important;
    max-width: 90% !important;
  }
  .qr-code-img {
    max-width: 100% !important;
    height: auto !important;
  }
}

/* ---------- 平板端（769-1024px）适配 ---------- */
@media (min-width: 769px) and (max-width: 1024px) {
  /* 内容区内边距 */
  .content, .main-content, .view-content, .page-content {
    padding: 16px !important;
  }

  /* 卡片内边距 */
  .card, .tpl-card, .panel, .box {
    padding: 14px !important;
  }

  /* 表格容器横向滚动 */
  .table-wrap, .table-container, .data-table-wrap, .tpl-table-wrap,
  .table-responsive, .le-table-wrap {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
  }
  table, .data-table, .tpl-table, .le-table {
    min-width: 600px !important;
    font-size: 13px !important;
  }

  /* 表单网格：2列 */
  .form-grid, .le-form, .form-row-grid,
  .detail-grid, .info-grid, .desc-grid, .field-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  /* 统计卡片：3列 */
  .stat-cards, .stats-grid, .dashboard-stats, .stat-grid {
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 10px !important;
  }

  /* 卡片网格：2列 */
  .card-grid, .cards-grid, .grid-cards,
  .card-grid.cols-3, .card-grid.cols-4 {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  /* 施工照片网格：3列 */
  #photoGrid {
    grid-template-columns: repeat(3, 1fr) !important;
  }

  /* 图表网格：2列 */
  .chart-grid, .charts-grid {
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px !important;
  }

  /* 搜索栏和工具栏：允许换行 */
  .search-bar, .filter-bar, .toolbar, .tpl-search-bar, .le-toolbar {
    flex-wrap: wrap !important;
    gap: 8px !important;
  }

  /* 模态框：最大宽度限制 */
  .modal, .modal-dialog, .modal-content {
    max-width: 90% !important;
  }

  /* 按钮统一（含列表引擎，保证平板各页面一致） */
  .btn, .btn-primary, .btn-default, .btn-sm,
  .le-btn, .le-toolbar .le-btn, .le-form .le-btn {
    min-height: 34px !important;
    height: auto !important;
    font-size: 13px !important;
    border-radius: 7px !important;
    box-sizing: border-box !important;
  }
  .btn-primary, .le-btn-primary {
    background: var(--primary) !important; color: #fff !important; border: 1px solid var(--primary) !important;
  }
  .btn-secondary, .le-btn-secondary {
    background: #fff !important; color: #333 !important; border: 1px solid #ddd !important;
  }

  /* 侧边栏宽度 */
  :root {
    --sidebar-width: 220px;
  }
}

/* ---------- 大屏（≥1025px）保持原样 ---------- */
@media (min-width: 1025px) {
  /* 不做额外限制，保持原有设计 */
}

/* ---------- 打印样式（保持打印效果） ---------- */
@media print {
  .mobile-bottom-nav, .mobile-menu-btn, .sidebar-overlay {
    display: none !important;
  }
  .content {
    padding: 0 !important;
  }
}

/* 手机端菜单英文切换为精简版（桌面/平板仍显示完整版） */
@media (max-width: 768px) {
  .nav-en .en-full { display: none !important; }
  .nav-en .en-short { display: inline !important; }
}