﻿/* 重构后的响应式表格优化CSS */

/* 手机端优化（小于768px） */
@media (max-width: 767.98px) {
  /* 所有表格输入框最小宽度 */
  .table input.form-control {
    min-width: 140px;
    font-size: 14px;
  }

  /* 通用表格列宽优化 */
  .table td:nth-child(1), /* 缩写编码 */
  .table td:nth-child(2), /* 物料名称 */
  .table td:nth-child(3), /* 规格型号 */
  .table td:nth-child(4), /* 备注 / 位置 */
  .table td:nth-child(5), /* 用途 / 单位 */
  .table td:nth-child(6), /* 数量 / 到货情况 */
  .table td:nth-child(7), /* 最近供应商 */
  .table td:nth-child(8)  /* 其他 */
  {
    min-width: 130px;
    word-break: break-word;
  }

  /* 指定模块字段加宽 */
  #locationTableBody td:nth-child(1),  /* 缩写编码 */
  #locationTableBody td:nth-child(4),  /* 备注 */
  #locationTableBody td:nth-child(5) { /* 物料信息 */
    min-width: 160px;
  }

  #searchResultsContainer td:nth-child(1), /* 查询：物料名称 */
  #searchResultsContainer td:nth-child(5), /* 查询：备注 */
  #searchResultsContainer td:nth-child(6), /* 查询：用途 */
  #searchResultsContainer td:nth-child(7), /* 查询：供应商 */
  #searchResultsContainer td:nth-child(9)  /* 查询：到货情况 */ {
    min-width: 140px;
  }

  #brandsPageContainer td:nth-child(1),  /* 品牌缩写 */
  #brandsPageContainer td:nth-child(2),  /* 品牌规格 */
  #brandsPageContainer td:nth-child(3)   /* 最近供应商 */ {
    min-width: 140px;
  }

  .table-responsive {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .table {
    table-layout: auto;
    font-size: 0.85rem;
  }

  /* 修复到货登记操作按钮竖排问题 */
  #pendingArrivalsContainer .btn-group,
  #searchResultsContainer .btn-group {
    flex-wrap: nowrap !important;
  }

  #pendingArrivalsContainer .btn-group .btn,
  #searchResultsContainer .btn-group .btn {
    white-space: nowrap !important;
    font-size: 13px;
    padding: 2px 6px;
  }

  #pendingArrivalsContainer td:last-child,
  #searchResultsContainer td:last-child {
    min-width: 90px;
  }
}

/* 微型屏幕额外适配 */
@media (max-width: 576px) {
  .table {
    font-size: 0.8rem;
  }

  .table td, .table th {
    padding: 4px;
  }
}

/* 打印优化 */
@media print {
  .table td:nth-child(4) { min-width: 120px !important; }
  .table td:nth-child(6) { min-width: 160px !important; }
  .navbar, .footer, .no-print { display: none !important; }
}