/* ============================================================
 * [本地定制] 移动端适配（2026-09-05）
 * 目标：手机（≤768px）下
 *   1. 侧边栏改为抽屉式（默认隐藏，汉堡按钮呼出）
 *   2. 主框架单列布局，消除横向溢出
 *   3. 首页 Logo / 输入区适配小屏
 * ============================================================ */

/* ---------- 汉堡按钮（JS 动态插入） ---------- */
#dsh-mobile-menu-btn {
  position: fixed;
  top: max(10px, env(safe-area-inset-top));
  left: 10px;
  z-index: 210;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  border: 1px solid var(--dsw-alias-border-l2, #333);
  background: var(--dsw-alias-bg-base, #1a1a1a);
  color: var(--dsw-alias-label-primary, #eee);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  display: none;
  align-items: center;
  justify-content: center;
  -webkit-tap-highlight-color: transparent;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
}
#dsh-mobile-menu-btn:active { transform: scale(.94); }

/* ---------- 抽屉遮罩 ---------- */
#dsh-mobile-overlay {
  position: fixed;
  inset: 0;
  z-index: 200;
  background: rgba(0,0,0,.5);
  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease;
}
#dsh-mobile-overlay.dsh-mobile-visible {
  opacity: 1;
  pointer-events: auto;
}

/* ============================================================
 * 移动端覆盖（≤768px）
 * ============================================================ */
@media (max-width: 768px) {
  html, body {
    overflow: hidden;
    overscroll-behavior: none;
  }

  /* 汉堡按钮显示 */
  #dsh-mobile-menu-btn { display: flex; }

  /* 1. 主框架：单列，消除 500px 最小宽导致的横向溢出 */
  .pI_x6G_frame {
    grid-template-columns: 1fr !important;
    grid-template-rows: 100% !important;
    min-width: 0 !important;
    width: 100vw !important;
  }

  /* 2. 侧边栏：off-canvas 抽屉 */
  .pI_x6G_sidebarCol {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    z-index: 205;
    width: min(310px, 86vw) !important;
    min-width: 0 !important;
    transform: translateX(-104%);
    transition: transform .2s ease;
    box-shadow: 4px 0 24px rgba(0,0,0,.45);
    border-right: none;
    background: var(--dsw-specific-sidebar-fill, #16181d);
  }
  .pI_x6G_sidebarCol.dsh-mobile-open { transform: translateX(0); }

  /* 抽屉内层根节点：inline width:280px 覆盖为全宽 */
  .pI_x6G_sidebarCol [data-slot="sidebar"] {
    width: 100% !important;
  }
  .pI_x6G_sidebarCol [data-slot="sidebar"] > div {
    width: 100% !important;
  }
  /* 抽屉展开时强制显示完整标签（去掉 icon-only 收缩态） */
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed {
    padding-left: 16px !important;
    padding-right: 12px !important;
  }
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed .hHd-Xa_newSessionLabel,
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed [class*="newSessionLabel"] {
    max-width: 200px !important;
  }
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed .hHd-Xa_logoRow {
    justify-content: flex-start !important;
    height: 60px !important;
    padding: 8px 0 8px 4px !important;
  }
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed .hHd-Xa_iconButton {
    width: 36px !important;
    height: 36px !important;
  }
  .pI_x6G_sidebarCol.dsh-mobile-open .hHd-Xa_collapsed .hHd-Xa_footArea {
    align-items: flex-start !important;
  }
  /* 隐藏抽屉内的折叠开关（手机上不需要再切 icon-only） */
  .pI_x6G_sidebarCol.dsh-mobile-open [class*="toggle"] {
    opacity: 0;
    pointer-events: none;
  }

  /* 3. 中间列：占满 */
  .pI_x6G_centerCol {
    width: 100% !important;
    min-width: 0 !important;
    border-left: none;
  }
  /* 详情列在手机上不占位 */
  .pI_x6G_detailsCol { display: none !important; }

  /* 4. 首页 hero：缩小 Logo，让位给输入框 */
  .pXSMma_headline {
    font-size: 20px !important;
    line-height: 26px !important;
    grid-template-columns: 26px auto auto !important;
    column-gap: 8px !important;
  }
  .pXSMma_root { padding: 0 16px !important; }
  .wSkVaW_heroGlow { display: none !important; }

  /* 5. 会话页 header：给汉堡按钮让位；
     并允许换行，让模型状态块（llama-status-panel 移动端形态）独占一行、
     完整显示且不出屏幕（2026-09-08） */
  .wSkVaW_header {
    padding-left: 58px !important;
    flex-wrap: wrap !important;
    row-gap: 2px;
  }
  .wSkVaW_headerActions {
    flex-wrap: wrap !important;
    min-width: 0;
  }
  .wSkVaW_header .lls-root-mobile {
    flex: 0 0 100% !important;
    min-width: 0;
  }
  .wSkVaW_header .lls-root-mobile .lls-label {
    display: none; /* 手机上芯片只留状态点，长模型名不占位 */
  }

  /* 6. 输入框卡片：贴边更宽松 */
  .uV2eYG_root, .uV2eYG_card {
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }
  .uV2eYG_root.uV2eYG_hero {
    padding: 10px 10px calc(10px + env(safe-area-inset-bottom)) !important;
  }
  .uV2eYG_card {
    border-radius: 14px !important;
  }

  /* 7. 模型选择按钮：截断超长模型名 */
  ._7KE1Ra_trigger {
    max-width: 96px !important;
  }
  ._7KE1Ra_triggerLabel {
    font-size: 12px !important;
  }
  /* effort 标签在手机上隐藏 */
  ._7KE1Ra_triggerEffort { display: none !important; }

  /* 8. 消息气泡：更宽的可用宽度 */
  [class*="bubble"] {
    max-width: 86% !important;
  }

  /* 9. 触摸优化：禁用双击缩放、加大可点区域 */
  button { touch-action: manipulation; }

  /* 10. 安全区 */
  .wSkVaW_composerSeat {
    padding-bottom: env(safe-area-inset-bottom);
  }
}

/* 平板横屏等稍宽场景的轻度优化 */
@media (min-width: 769px) and (max-width: 1024px) {
  ._7KE1Ra_trigger { max-width: 150px; }
}
