/* ============================================================
   控制工程A · 智慧实践教学平台 —— 手机端适配
   学生端优先；教师端顺带兼容。仅在窄屏(<900px)生效。
   2026-09-08 新增
   ============================================================ */

/* ---------- ≤900px：平板竖屏 / 大手机 ---------- */
@media (max-width: 900px) {
  /* 顶栏压缩：只显示课程名，隐藏冗长的学院名 */
  .portal-topbar {
    padding: 0 0.5rem;
    gap: 0.3rem;
    min-height: 48px;
  }
  .mech-brand-compact .mech-brand-college { display: none; }
  .mech-brand-compact .mech-brand-icon,
  .mech-brand-compact .mech-brand-icon svg { width: 20px; height: 20px; }
  .mech-brand-course {
    font-size: 12px;
    max-width: 11em;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* 导航：横向滑动保持，字号略减、点按区加大 */
  .h-nav-inline { padding: 0; }
  .h-nav-inline a { font-size: 13px; padding: 0.7rem 0.55rem; }

  /* 右上角用户区：名字和按钮一行放下 */
  .portal-user-end { flex-direction: row; align-items: center; gap: 0.35rem; }
  .portal-user-meta .portal-user-class,
  .portal-user-meta .portal-user-term { display: none; }
  .portal-user-btn { padding: 5px 8px; font-size: 12px; }

  /* 内容留白收紧 */
  .portal-content { padding: 0.7rem 0.65rem 2.6rem; }

  /* 章节操作行允许换行 */
  .chapter-actions-row { flex-wrap: wrap; }
  .chapter-actions-row .btn { flex: 0 0 auto; }

  /* 通用双列 → 单列 */
  .grid-2 { grid-template-columns: 1fr; }
  .grid-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* 教师端看板两栏叠放 */
  .dash-main-row,
  .dash-main-row.teacher-dash-body,
  .dash-main-row.equal,
  .dash-main-row.triple {
    grid-template-columns: minmax(0, 1fr);
  }
  .dash-side-stack { width: 100%; }
  .present-layout { grid-template-columns: minmax(0, 1fr); }
  .present-frame { height: 62vh; }

  /* 实验/仿真面板里的横向控件可滚动，避免挤压 */
  .lab-panel, .sim-panel, .canvas-wrap, .chart-tools {
    overflow-x: auto;
  }
  canvas, svg.present-svg { max-width: 100%; }

  /* 学习任务三模块：单列堆叠时取消固定高度，改为自然展开 */
  .task-module-body { height: auto; max-height: 70vh; }
  .task-module-head { padding: 0.85rem 0.8rem 0.75rem; }
  .task-module-body { padding: 0.85rem 0.8rem; }

  /* 学生课件卡片：锁定按钮不缩成一条线 */
  .grid-cases { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- ≤640px：手机竖屏 ---------- */
@media (max-width: 640px) {
  /* 顶栏进一步压缩：隐藏品牌图标留空间给导航 */
  .mech-brand-compact .mech-brand-icon { display: none; }
  .mech-brand-course { max-width: 7.5em; font-size: 11px; }
  .portal-user-meta .portal-user-name { font-size: 12px; max-width: 5em; }
  .portal-user-actions .portal-user-btn { padding: 5px 6px; font-size: 11px; }
  .h-nav-inline a { font-size: 12.5px; padding: 0.7rem 0.45rem; }

  /* 网格全部单列 */
  .grid-3, .grid-4 { grid-template-columns: 1fr; }
  .dash-cards { grid-template-columns: 1fr; }
  .acct-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .stu-phases, .acct-kv { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* 卡片与标题更紧凑 */
  .card, .card-compact { padding: 0.9rem; }
  .card-title { font-size: 1rem; }
  th, td { padding: 0.5rem 0.6rem; }

  /* 按钮触控更大 */
  .btn { font-size: 14px; }
  .btn-sm { font-size: 13px; }

  /* 学生首页指标两列仍保留，避免过高 */
  .student-home-metrics.metrics-dense,
  .student-home-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* 数据看板学生表：姓名列加粗清晰、操作列换行 */
  .acct-actions { flex-wrap: wrap; }
  .acct-actions .btn { flex: 0 0 auto; }

  /* 弹窗占满更舒适 */
  .acct-modal, .stu-modal { width: 100%; max-height: 92vh; }

  /* 学习任务页：顶部统计条与模块内边距 */
  .task-page-head { flex-direction: column; align-items: flex-start; gap: 0.4rem; }
  .task-page-summary { flex-wrap: wrap; }
  .task-item-top { flex-wrap: wrap; }
  .task-item-actions { flex-wrap: wrap; }

  /* 课件卡片单列，查看详情/锁定按钮同行放得下 */
  .grid-cases { grid-template-columns: 1fr; }
}

/* ---------- 触摸优化（所有窄屏/触屏通用） ---------- */
@media (max-width: 900px) {
  .h-nav-inline a,
  .btn,
  .acct-sem-tab,
  .portal-user-btn { -webkit-tap-highlight-color: transparent; }
}