
/* ═══════════════════════════════════════
   响应式设计 — 移动端 & 平板适配
   Generated by upgrade-v5.3.0.js
   ═══════════════════════════════════════ */

/* 平板端 (≤1024px) */
@media (max-width: 1024px) {
  .sidebar { width: 220px; padding: 10px; }
  .sidebar-btn { font-size: 14px; padding: 8px 10px; gap: 6px; }
  .conv-sidebar { width: 220px; }
  .msg { max-width: 90%; }
  .login-card { width: 360px; padding: 30px; }
}

/* 平板竖屏 (≤768px) */
@media (max-width: 768px) {
  .sidebar { width: 64px; padding: 8px; }
  .sidebar-btn { font-size: 0; justify-content: center; padding: 10px 0; }
  .sidebar-btn::first-letter { font-size: 20px; }
  .conv-sidebar { width: 100%; max-width: 300px; }
  header { padding: 10px 14px; }
  header h1 { font-size: 15px; }
  .chat-layout { flex-direction: column-reverse; }
  .conv-sidebar { border-right: none; border-top: 1px solid var(--border); max-height: 200px; }
  .messages { padding: 12px; }
  .input-area { padding: 8px 10px; }
  .input-row textarea { height: 100px; font-size: 16px; /* iOS 不缩放 */ }
  .msg { max-width: 95%; }
  .msg-bubble { font-size: 14px; padding: 10px 12px; }
  .login-card { width: 90vw; padding: 24px; margin: 20px; }
}

/* 手机端 (≤480px) */
@media (max-width: 480px) {
  body { font-size: 14px; }
  
  .sidebar { 
    width: 100%; height: 48px; 
    flex-direction: row; 
    flex-wrap: nowrap;
    overflow-x: auto; 
    overflow-y: hidden;
    padding: 4px 8px; 
    gap: 4px; 
    flex-shrink: 0;
    align-items: center;
  }
  .sidebar-btn { 
    font-size: 11px; padding: 5px 8px; 
    white-space: nowrap; flex-shrink: 0; 
    border-radius: 6px; 
    height: 34px;
    line-height: 1;
  }
  .sidebar-spacer { display: none; }

  header { 
    padding: 8px 12px; 
    flex-wrap: wrap; gap: 6px;
  }
  header h1 { font-size: 14px; }
  header .status { font-size: 10px; }

  main { flex-direction: column; }

  .chat-layout { flex-direction: column; height: auto; }
  .conv-sidebar { 
    width: 100%; max-height: 150px; 
    border-right: none; 
    border-bottom: 1px solid var(--border);
  }
  .conv-section-header { padding: 8px 10px 6px; }
  .conv-section-title { font-size: 13px; }
  .conv-item { padding: 6px 8px; font-size: 12px; }

  .chat-area { flex: 1; }
  .messages { padding: 8px; gap: 10px; }
  .msg { max-width: 96%; gap: 8px; }
  .msg-avatar { width: 26px; height: 26px; font-size: 12px; }
  .msg-bubble { font-size: 13px; padding: 8px 10px; border-radius: 10px; }
  .msg-meta { font-size: 9px; }

  .input-area { padding: 6px 8px; }
  .input-row { border-radius: 10px; }
  .input-row textarea { 
    height: 80px; padding: 10px 10px 44px 10px; 
    font-size: 16px; /* 防止 iOS 自动缩放 */
  }

  .login-overlay { align-items: flex-start; padding-top: 10vh; }
  .login-card { 
    width: 94vw; padding: 20px 18px; 
    border-radius: 12px; margin: 0;
  }
  .login-card h2 { font-size: 18px; }
  .login-globe { width: 80px; height: 80px; }
  .login-globe-core { width: 80px; height: 80px; }

  .emp-tabs { overflow-x: auto; }
  .emp-tab { padding: 8px 14px; font-size: 12px; white-space: nowrap; }

  /* 弹窗 */
  #wechat-modal > div { 
    width: 95vw; padding: 20px; 
    max-height: 85vh; border-radius: 12px;
  }

  /* 面板网格改为单列 */
  .app-card { padding: 12px; }
  .app-card-top { gap: 8px; }
  .app-card-icon { width: 36px; height: 36px; }
  .app-card-name { font-size: 13px; }

  /* 下拉菜单 */
  .conv-add-dropdown { right: -80px; }
}

/* 小屏手机 (≤360px) */
@media (max-width: 360px) {
  .sidebar-btn { font-size: 10px; padding: 5px 8px; }
  header h1 { font-size: 12px; }
  .conv-item { padding: 5px 6px; font-size: 11px; }
}
