/* ============================================================
 * responsive-layout.css — 移动端响应式布局（主题无关，始终加载）
 * ------------------------------------------------------------
 * 从 home-light.css 拆分：暗黑金主题下 home-light.css 被 theme-toggle
 * 禁用(link.disabled)，连响应式规则一起失效 → 手机端 wsc-dual-grid 等
 * 保持内联 1fr 1fr 双栏排版错位。本文件不随主题切换禁用，保证移动端
 * 网格折叠(双栏→单栏 / 4栏→2栏)在任何主题下都生效。
 * 经 nginx sub_filter 在 </head> 前注入。
 * ============================================================ */

/* ---------- 7. 移动端响应式（覆盖首页内联 grid + 全站触控优化） ---------- */
@media (max-width: 768px) {
  /* Hero 缩放 */
  #dashboard-root .wsc-hero { padding: 40px 18px !important; border-radius: 20px !important; }
  #dashboard-root .wsc-hero-title { font-size: 40px !important; letter-spacing: 2px !important; line-height: 1.15 !important; }
  #dashboard-root .wsc-hero-sub { font-size: 15px !important; line-height: 1.7 !important; }
  #dashboard-root .wsc-hero-stats { gap: 18px !important; margin-bottom: 24px !important; }
  #dashboard-root .wsc-hero-stats > div > div:first-child { font-size: 26px !important; }
  #dashboard-root .wsc-hero-cta { flex-direction: column !important; align-items: stretch !important; }
  #dashboard-root .wsc-hero-cta .btn { width: 100% !important; padding: 13px !important; font-size: 15px !important; }

  /* 核心指标 4→2 列 */
  #dashboard-root .wsc-stats-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
  #dashboard-root .wsc-stats-grid .stat-value { font-size: 24px !important; }

  /* 14 宫格 4 列紧凑 */
  #dashboard-root .wsc-core-grid { grid-template-columns: repeat(4, 1fr) !important; gap: 8px !important; }
  #dashboard-root .wsc-core-grid > div { padding: 12px 4px 10px !important; border-radius: 12px !important; }
  #dashboard-root .wsc-core-grid > div > div { width: 40px !important; height: 40px !important; border-radius: 10px !important; }
  #dashboard-root .wsc-core-grid > div > div:last-child { font-size: 11px !important; }

  /* 双栏 → 单列 */
  #dashboard-root .wsc-dual-grid { grid-template-columns: 1fr !important; gap: 16px !important; }

  /* 精选臻品 2 列 */
  #dashboard-root .wsc-featured-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }

  /* 公告 → 单列 */
  #dashboard-root .wsc-news-grid { grid-template-columns: 1fr !important; gap: 8px !important; }

  /* 会员权益 2 列 */
  #dashboard-root .wsc-benefits-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }

  /* 平台保障 2 列 */
  #dashboard-root .wsc-guarantee-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }

  /* 平台真实数据 2 列 */
  #dashboard-root .wsc-wscgrid { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }

  /* WChat 横幅 */
  #dashboard-root .wsc-hcard[onclick*="group-chat"] { padding: 20px 16px !important; }

  /* 全站：主内容呼吸感 + 卡片圆角 */
  #main-content .page-header h2 { font-size: 20px !important; }
  #main-content .product-card { border-radius: 12px; }
  /* 触控目标 ≥44px */
  #main-content .btn { min-height: 44px; }
}

@media (max-width: 480px) {
  #dashboard-root .wsc-hero-title { font-size: 32px !important; }
  #dashboard-root .wsc-hero-sub { font-size: 14px !important; }
  /* 14 宫格 3 列舒展 */
  #dashboard-root .wsc-core-grid { grid-template-columns: repeat(3, 1fr) !important; gap: 8px !important; }
  #dashboard-root .wsc-core-grid > div > div { width: 44px !important; height: 44px !important; }
  /* 核心指标数字更小 */
  #dashboard-root .wsc-stats-grid .stat-value { font-size: 22px !important; }
  #dashboard-root .wsc-stats-grid .stat-label { font-size: 11px !important; }
  /* 商品卡统一 2 列（修复 index.php 380px 断点把商品压成 1 列的断层，375px 主流 iPhone 保持 2 列） */
  #main-content .product-grid { grid-template-columns: repeat(2, 1fr) !important; gap: 10px !important; }
}