/**
 * 天机命理 Mobile Deep Adaptation Specific Overrides (mobile.css)
 */

/* 1. 表单与输入框移动端单列化 */
@media (max-width: 859px) {
  .form-row,
  .form-row.date-time-row,
  .bazi-input-grid,
  .grid-2col,
  .grid-3col {
    display: flex !important;
    flex-direction: column !important;
    gap: var(--space-3) !important;
    grid-template-columns: 1fr !important;
  }

  /* 咨询输入框 + 发送按钮：窄屏改为上下堆叠，避免按钮挤压输入框 */
  .ask-box {
    flex-direction: column !important;
    align-items: stretch !important;
  }
  .ask-box textarea {
    width: 100% !important;
    flex: none !important;
  }
  .ask-box button {
    width: 100% !important;
  }

  .form-row > div,
  .form-row.date-time-row > div {
    width: 100% !important;
  }

  .btn {
    width: 100%;
    margin-bottom: var(--space-2);
  }

  /* 2. 避免页面级横向溢出 */
  html, body {
    max-width: 100vw;
    overflow-x: hidden;
  }

  /* 3. 触摸目标保障 */
  button, input, select, textarea, .pill, .tab-btn {
    min-height: var(--touch-target);
  }

  /* 4. 命盘表格与九宫格局部横向滚动保障 */
  .bazi-chart-table,
  .qimen-grid,
  .ziwei-palaces,
  .liuyao-table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
  }

  /* 5. 软键盘弹起时隐藏底部导航 */
  body.keyboard-visible .mobile-bottom-nav {
    display: none !important;
  }

  /* 6. 每日运势首屏高密与首屏见分优化 */
  .daily-hero {
    display: flex !important;
    flex-direction: column !important;
    padding: 12px 14px !important;
    gap: 8px !important;
  }

  .daily-energy-head {
    order: -1 !important;
    margin-top: 0 !important;
    margin-bottom: 8px !important;
    padding: 10px 12px !important;
    background: var(--card, #ffffff) !important;
    border: 1px solid var(--card-border, #d3dfe3) !important;
    color: var(--ink, #1a262c) !important;
    border-radius: 12px !important;
  }

  .daily-profile-card {
    padding: 8px 12px !important;
    margin-bottom: 8px !important;
  }

  .daily-anchor-nav {
    margin-bottom: 8px !important;
    padding: 4px 6px !important;
  }

  .daily-section {
    padding: 12px 14px !important;
    margin-bottom: 10px !important;
  }

  .daily-hero-card {
    padding: var(--space-3);
  }

  .daily-score-badge {
    font-size: var(--font-size-xl);
    font-weight: 800;
  }

  .daily-highlights-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--space-2);
    margin: var(--space-3) 0;
  }
}

/* 7. 超小屏幕 (320px - 360px) 极致紧凑微调 */
@media (max-width: 380px) {
  :root {
    --space-4: 10px;
    --font-size-base: 13px;
  }

  .card {
    padding: 10px 8px;
    border-radius: var(--radius-sm);
  }

  .brand-bar {
    padding: 6px 8px !important;
  }

  .daily-hero {
    padding: 8px 10px !important;
    gap: 6px !important;
  }

  .daily-energy-head {
    order: -1 !important;
    padding: 6px 10px !important;
    margin-bottom: 6px !important;
  }

  .daily-energy-ring {
    width: 56px !important;
    height: 56px !important;
  }

  .daily-energy-ring span {
    font-size: 15px !important;
    font-weight: 800 !important;
  }

  .daily-highlights-grid {
    grid-template-columns: 1fr;
  }
}