/* ===================================
   mobile.css — 产品 AI 顾问手机端优化
   仅在微信内置浏览器 / 手机端 H5 生效
   =================================== */

@media(max-width: 768px){
  /* ── actionArea：底部固定，默认折叠 ── */
  #actionArea {
    position: sticky !important;
    bottom: 0 !important;
    box-shadow: 0 -4px 12px rgba(0,0,0,0.15) !important;
    padding: 8px 12px !important;
    border-top: 1px solid var(--border) !important;
    z-index: 10 !important;
    background: var(--bg-card) !important;
  }

  /* ── actionArea 折叠 ── */
  .action-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    user-select: none;
    padding: 8px 0;
    min-height: 40px;
    -webkit-tap-highlight-color: rgba(68,204,68,0.15);
  }
  .action-arrow {
    font-size: 14px;
    color: var(--text-dim);
    transition: transform 0.2s;
  }
  .action-arrow.open {
    transform: rotate(180deg);
  }
  #actionBody.collapsed {
    display: none;
  }

  /* ── 模式选择：横向滑动 ── */
  .mode-grid {
    display: flex !important;
    gap: 8px;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: 4px;
    scrollbar-width: none;
  }
  .mode-grid::-webkit-scrollbar { display: none; }
  .mode-card {
    min-width: 95px;
    flex-shrink: 0;
    padding: 10px 8px;
  }
  .mode-card .icon { font-size: 20px; margin-bottom: 4px; }
  .mode-card .name { font-size: 12px; }
  .mode-card .cost { font-size: 10px; }

  /* ── 操作栏精简 ── */
  .action-bar {
    justify-content: center !important;
    gap: 8px !important;
    padding: 10px 12px !important;
  }
  .action-bar .info { display: none !important; }

  /* ── 输入框缩小 ── */
  #promptArea { margin-bottom: 8px !important; }
  #reqArea { margin-bottom: 8px !important; }
  .req-textarea { min-height: 80px !important; font-size: 13px !important; }

  /* ── 搜索栏紧凑 ── */
  .search-bar { margin-bottom: 12px !important; }

  /* ── AI 分析悬浮按钮 ── */
  #aiFloatBtn {
    display: none;
    position: fixed;
    bottom: 24px;
    right: 20px;
    z-index: 999;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background: linear-gradient(135deg, #44CC44, #22ddbb);
    color: #fff;
    font-size: 22px;
    border: none;
    box-shadow: 0 4px 16px rgba(68, 204, 68, 0.4);
    cursor: pointer;
    transition: all 0.2s;
  }
  #aiFloatBtn:active {
    transform: scale(0.92);
    box-shadow: 0 2px 8px rgba(68, 204, 68, 0.3);
  }
  #aiFloatBtn .badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #f87171;
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }
  .search-bar input { font-size: 15px !important; padding: 10px 12px !important; min-width: 150px !important; }

  /* ── 手机上隐藏 PDF & Excel 导出按钮（Word 可微信打开+转发） ── */
  .btn-export-pdf,
  .btn-export-excel {
    display: none !important;
  }

  /* ── 结果区紧凑 ── */
  .result-meta {
    font-size: 12px !important;
    gap: 8px !important;
  }
  .result-actions {
    gap: 6px !important;
  }
  .result-actions .btn { font-size: 12px !important; padding: 8px 12px !important; }

  /* ── Tab 紧凑 ── */
  .ai-tabs { margin-bottom: 12px !important; }
  .ai-tab { padding: 6px 10px !important; font-size: 12px !important; }

  /* ── SKU/配件表格 — 说明字段自动换行 ── */
  .sub-section {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }
  .sub-table { min-width: 100%; }
  .sub-table td, .sub-table th {
    padding: 4px 8px !important;
  }
  .sub-table td:last-child,
  .sub-table th:last-child {
    white-space: normal;
    word-break: break-word;
    min-width: 100px;
  }

  /* ── 产品卡片紧凑 ── */
  .product-card .card-header { padding: 8px 10px !important; }
  .product-card .card-header .name { font-size: 13px !important; }
  .product-card .card-body { padding: 0 10px 10px !important; }

  /* ── 历史条目紧凑 ── */
  .history-item { padding: 8px 10px !important; }
  .history-item .h-info .h-query { font-size: 13px !important; }
}
