/*
 * 移动端（H5）响应式适配层。
 *
 * 该文件是整个主题移动端适配的收尾兜底层，按“通用 → 页头 → 首页 →
 * 商品列表页 → 商品详情页”分区组织。所有规则都包在 max-width 媒体查询里，
 * 断点为 1024px / 768px / 480px，只在小屏生效，不会影响桌面端显示。
 *
 * 加载顺序说明：本文件在 functions.php 中依赖 catalog 样式入队，
 * 因此始终位于抓取的原站样式（assets/site/css/）与主题主样式之后，
 * 同等特异性下可以稳定覆盖它们。抓取样式文件保持只读、不做修改。
 */

/* ==========================================================================
   一、通用：横向溢出防护 / 触控区 / 基础排版
   ========================================================================== */

/* 小屏下切断横向溢出：抓取的 Shopify 区块偶有超宽轨道或固定宽度元素，
   clip 不会产生滚动容器，也不影响 position: sticky 的工作方式。 */
@media (max-width: 1024px) {
  html, body { overflow-x: clip; }

  /* 媒体资源不允许把容器撑破 */
  img, video, iframe, embed, object, svg { max-width: 100%; }
  img, video { height: auto; }

  /* 小屏表格允许横向滚动而不是撑破布局 */
  table { max-width: 100%; }
}

@media (max-width: 768px) {
  /* 触控基础：常见小控件（关闭按钮、小图标按钮等）保证 ≥44px 命中区，
     通过透明的 ::before 扩大命中范围，不改变视觉尺寸。 */
  .header__menu-toggle,
  .header__search-button,
  .header__action-link,
  .siteforge-catalog-filters__close,
  .siteforge-collection-video-card__toggle,
  .siteforge-product-gallery__zoom {
    position: relative;
  }

  .header__menu-toggle::before,
  .header__search-button::before,
  .header__action-link::before,
  .siteforge-catalog-filters__close::before,
  .siteforge-collection-video-card__toggle::before,
  .siteforge-product-gallery__zoom::before {
    content: '';
    position: absolute;
    inset: -10px;
  }

  /* 输入控件字号 ≥16px，避免 iOS 聚焦时自动放大页面 */
  input[type="text"],
  input[type="email"],
  input[type="search"],
  input[type="tel"],
  input[type="number"],
  select,
  textarea {
    font-size: max(1rem, .875rem);
  }
}

/* ==========================================================================
   二、页头导航（header.php 为抓取结构，原站 CSS 自带汉堡逻辑）
   ========================================================================== */

/* ≤1024px：原站样式在 <1024px 显示汉堡按钮、隐藏桌面一级菜单；
   这里只做可用性兜底，不改变其结构。 */
@media (max-width: 1024px) {
  /* 汉堡菜单展开后，抽屉面板允许滚动，避免长菜单在小屏上被截断 */
  header.shopify-section-group-header-group .header__section--bottom.is-open {
    max-height: calc(100svh - 5.5rem);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;
  }

  /* 页头左右留白与动作区收窄，保证 logo / 图标按钮一行放得下 */
  header.shopify-section-group-header-group .header-inside {
    padding-inline: 1rem;
  }
  header.shopify-section-group-header-group .header__actions {
    column-gap: .9rem;
  }
  header.shopify-section-group-header-group .header__action-link svg,
  header.shopify-section-group-header-group .header__menu-toggle svg,
  header.shopify-section-group-header-group .header__search-button svg {
    width: 1.25rem;
    height: 1.25rem;
  }
}

@media (max-width: 480px) {
  /* 顶栏公告文字过长时省略，避免换行把页头顶高 */
  header.shopify-section-group-header-group .header__section--top {
    padding-inline: .75rem;
  }
}

/* ==========================================================================
   三、首页 front-page.php（抓取的参考首页 + siteforge 首页模块）
   ========================================================================== */

@media (max-width: 1024px) {
  /* 首页 hero：高度与区块间距开始收窄 */
  .siteforge-home-hero,
  .siteforge-home-hero__media img { min-height: 64svh; }
  .siteforge-home-hero__content h1 { font-size: clamp(1.9rem, 7vw, 3.2rem); }

  /* 首页各编辑区块的垂直留白收窄一档 */
  .siteforge-home-catalog,
  .siteforge-home-editorial { padding: 3rem 0; }
  .siteforge-home-explore { padding: 3.5rem 1.25rem; }
}

@media (max-width: 768px) {
  /* hero 进一步压缩 */
  .siteforge-home-hero,
  .siteforge-home-hero__media img { min-height: 58svh; }
  .siteforge-home-hero__content { inset: auto 1rem 1.75rem; gap: .5rem; }
  .siteforge-home-hero__content p { font-size: .875rem; }
  .siteforge-home-hero__content h1 { font-size: clamp(1.75rem, 8.5vw, 2.6rem); }

  /* 区块标题与卡片字号收敛 */
  .siteforge-home-section-heading h2 { font-size: clamp(1.6rem, 7vw, 2.2rem); }
  .siteforge-home-section-heading { margin-bottom: 1.75rem; }

  /* 首页多列内容栅格：≤768px 折 2 列（编辑栅格与 explore 栅格） */
  .siteforge-home-editorial-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .siteforge-home-product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
  .siteforge-home-explore__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .7rem; }

  /* 抓取区块（图文、媒体等）在小屏的通用内边距 */
  .shopify-section .section-content-media,
  .shopify-section .section-collection-list { padding-inline: 1rem; }
}

@media (max-width: 480px) {
  /* 小屏 hero：高度约 55% 视口，按钮保持易点 */
  .siteforge-home-hero,
  .siteforge-home-hero__media img { min-height: 55svh; }
  .siteforge-home-hero__content { bottom: 1.25rem; }
  .siteforge-home-hero__content h1 { font-size: 1.7rem; }
  .siteforge-home-hero__content p { font-size: .8rem; }
  .siteforge-home-button { min-height: 2.75rem; padding: .6rem 1rem; font-size: .72rem; }

  /* 编辑栅格与商品栅格间距再收紧 */
  .siteforge-home-editorial-grid,
  .siteforge-home-product-grid { gap: .6rem; }
  .siteforge-home-editorial-grid span { font-size: 1rem; right: .7rem; bottom: .7rem; left: .7rem; }

  /* 商品卡文字保持可读下限 */
  .siteforge-home-product-card__body h3 { font-size: .78rem; }
  .siteforge-home-product-card__body p { font-size: .66rem; }
  .siteforge-home-product-card__price { font-size: .68rem; }
}

/* ==========================================================================
   四、商品列表页 archive-product.php / page-product-list.php
   ========================================================================== */

@media (max-width: 1024px) {
  /* 产品栅格：桌面 4 列 → 平板 2 列（与主样式 1023px 规则衔接，
     用同等断点保证旧主题样式或插件覆盖后仍回落到 2 列） */
  .siteforge-product-archive ul.products,
  .siteforge-product-detail .related ul.products,
  .siteforge-product-detail .upsells ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 34px 10px;
  }

  /* 列表页头部与面包屑字号收敛 */
  .siteforge-product-archive__header h1 { font-size: clamp(1.8rem, 6vw, 2.8rem); }

  /* 筛选/排序栏：小屏单列堆叠，排序选择器占满整行 */
  .siteforge-product-archive__toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .6rem .9rem;
    min-height: 0;
    padding: .7rem 0;
  }
  .siteforge-product-archive__toolbar .woocommerce-ordering { margin-left: auto; }
  .siteforge-product-archive__toolbar .woocommerce-ordering select { width: 100%; }
  .siteforge-catalog-count { order: -1; }
}

@media (max-width: 768px) {
  /* 卡片文字缩小一档并保证可读 */
  .siteforge-product-card .siteforge-product-card__title { font-size: .85rem; }
  .siteforge-product-card .siteforge-product-card__excerpt { font-size: .72rem; }
  .siteforge-product-card .siteforge-product-card__price { font-size: .8rem; }

  /* 视频卡片：小屏不再跨两列，改为 16:9 全宽 */
  .siteforge-collection-video-card { grid-column: 1 / -1; aspect-ratio: 16 / 9; }

  /* “加载更多”按钮放宽触控区 */
  .siteforge-catalog-load-more button { min-height: 3.25rem; }
}

@media (max-width: 480px) {
  /* 容器边距收窄，把宽度尽量留给商品图 */
  .siteforge-product-archive .siteforge-container { width: calc(100% - 24px); }
  .siteforge-product-archive ul.products,
  .siteforge-product-detail .related ul.products,
  .siteforge-product-detail .upsells ul.products { gap: 28px 8px; }

  /* 紧凑网格视图同样保持 2 列 */
  .siteforge-product-archive .products.siteforge-catalog-grid--compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }

  /* “加载更多”按钮全宽，方便单手操作 */
  .siteforge-catalog-load-more button { width: 100%; min-width: 0; }
}

/* ==========================================================================
   五、商品详情页 single-product.php
   ========================================================================== */

@media (max-width: 1024px) {
  /* 双栏（图 / 信息）→ 单栏；主图区全宽、恢复文档流 */
  .siteforge-single-product__layout {
    grid-template-columns: minmax(0, 1fr);
    width: 100%;
  }
  .siteforge-single-product__gallery { width: 100%; }
  .siteforge-product-gallery {
    position: relative;
    top: auto;
    height: auto;
  }
  .siteforge-product-gallery__stage { aspect-ratio: 3 / 4; height: auto; }
  .siteforge-single-product__summary {
    position: static;
    width: 100%;
    max-width: none;
    min-height: 0;
    padding: 2.5rem 1.25rem 3rem;
  }

  /* 信息区 / 配件区等双栏区块一并折单栏 */
  .siteforge-single-product__information { grid-template-columns: 1fr; }
  .siteforge-product-complete { grid-template-columns: 1fr; }
  .siteforge-product-faq { grid-template-columns: 1fr; }
}

@media (max-width: 768px) {
  /* 摘要区：内容宽度放开为流式，加购表单与按钮全宽 */
  .siteforge-single-product__summary { padding: 2.25rem 1rem 2.75rem; }
  .siteforge-single-product__summary .siteforge-product-title,
  .siteforge-product-scent,
  .siteforge-product-excerpt,
  .siteforge-product-format,
  .siteforge-single-product__summary form.cart,
  .siteforge-single-product__summary form.variations_form,
  .siteforge-product-purchase-extras { width: 100%; max-width: 26rem; }

  .siteforge-single-product__summary .product_title,
  .siteforge-single-product__summary .siteforge-product-title__primary { font-size: 1.35rem; line-height: 1.15; }
  .siteforge-single-product__summary .siteforge-product-title__secondary { font-size: .95rem; }

  /* 加购按钮全宽、高度 ≥44px */
  .siteforge-single-product__summary form.cart .single_add_to_cart_button {
    width: 100%;
    min-height: 2.9rem;
  }
  .siteforge-single-product__summary .variations select { min-height: 2.9rem; }

  /* 相关产品 2 列 */
  .siteforge-product-detail .related ul.products,
  .siteforge-product-detail .upsells ul.products {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 30px 8px;
  }
  .siteforge-product-collection__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }

  /* 页面级说明区块（服务 / 常见问题 / 评论）内边距收窄 */
  .siteforge-product-services { padding: 3.5rem 0; }
  .siteforge-product-faq { padding: 3.5rem 1.1rem; }
  .siteforge-single-product__information { padding: 3.5rem 1.1rem; }
  .siteforge-product-reviews { padding: 3.5rem 1rem 6.5rem; }
}

@media (max-width: 480px) {
  /* 详情页摘要进一步收窄留白，标题再降一档 */
  .siteforge-single-product__summary { padding: 1.75rem .85rem 2.5rem; }
  .siteforge-single-product__summary .product_title,
  .siteforge-single-product__summary .siteforge-product-title__primary { font-size: 1.2rem; }

  /* 声明文案与专区标题缩小 */
  .siteforge-single-product__statement p { font-size: 1.5rem; line-height: 1.35; }
  .siteforge-product-complete__content h2 { font-size: 1.5rem; line-height: 1.35; margin-bottom: 2.25rem; }
  .siteforge-product-collection > header h2,
  .siteforge-product-editorial__content h2,
  .siteforge-product-services > h2,
  .siteforge-product-faq > h2 { font-size: 1.5rem; line-height: 1.35; }

  /* 服务卡片横向滑动时占更小宽度，露出下一张卡片暗示可滑 */
  .siteforge-product-services article { flex: 0 0 calc(74vw - 1rem); }

  /* Sticky ATC（吸底加购）条：小屏收窄内边距并适配安全区，
     按钮占满整行；标题由主题自身规则隐藏，这里只保证布局稳定 */
  .siteforge-product-sticky { padding: .6rem .75rem max(.6rem, env(safe-area-inset-bottom)); }
  .siteforge-product-sticky__inner { width: 100%; gap: .6rem; }
  .siteforge-product-sticky button { width: 100%; min-width: 0; min-height: 2.85rem; }

  /* 评论表单单列 */
  .siteforge-review-form__row { grid-template-columns: 1fr; }
}