/*
 * Outdoor Research — 移动端（H5）适配样式
 *
 * 说明：
 * - 本文件只在桌面主样式（style.css）之后加载，通过 max-width 媒体查询逐级覆盖，
 *   不会影响桌面端（>1024px）布局。
 * - 断点：1024px（平板横屏）/ 768px（平板竖屏、大屏手机）/ 480px（手机）。
 * - 目标：消除横向溢出、栅格折叠、字号与触控区域优化、表格与画廊可横向滚动。
 */

/* ============================================================
   通用（所有页面）
   ============================================================ */

/* ≤1024px：收紧页面留白，容器改流式宽度 */
@media (max-width: 1024px) {
	:root {
		/* 收窄全局留白变量，所有使用 --ors-gutter 的区块同步收紧 */
		--ors-gutter: 24px;
	}

	/* 防止意外元素（绝对定位大图、超宽表格等）造成横向滚动 */
	html, body {
		overflow-x: hidden;
	}

	.ors-container {
		width: calc(100% - 48px);
	}

	/* 图片一律不允许超出容器宽度（流式收缩） */
	img,
	svg,
	video,
	iframe {
		max-width: 100%;
	}

	/* 固定宽度元素改为流式 */
	.ors-newsletter form,
	.ors-policy {
		width: 100%;
		max-width: 100%;
	}
}

/* ≤768px：基础字号、间距与触控目标整体收紧 */
@media (max-width: 768px) {
	body {
		font-size: 15px;
		line-height: 24px;
	}

	/* 正文字号下限：保证可读性 ≥14px */
	.ors-content p,
	.ors-policy__content,
	.ors-article__body,
	.woocommerce-notices-wrapper {
		font-size: 15px;
	}

	/* 通用按钮：触控区不低于 44px */
	.ors-button {
		min-height: 44px;
	}

	/* 通用表格：小屏允许横向滚动，避免撑破布局 */
	.ors-size-chart-modal table,
	.woocommerce-product-details__short-description table,
	.ors-content table,
	.woocommerce table.shop_table {
		display: block;
		width: 100%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* 分页：触控目标加大到 44px */
	.ors-pagination a,
	.ors-pagination span {
		min-width: 44px;
		min-height: 44px;
		height: auto;
		font-size: 16px;
	}

	/* 公告条：小屏文字换行显示，避免溢出 */
	.ors-announcement {
		height: auto;
		min-height: 37px;
		padding: 4px 12px;
	}
	.ors-announcement__slide {
		position: static;
		flex-wrap: wrap;
	}
}

/* ≤480px：手机进一步缩减字号与间距 */
@media (max-width: 480px) {
	body {
		font-size: 14px;
	}

	.ors-container {
		width: calc(100% - 32px);
	}

	:root {
		--ors-gutter: 16px;
	}

	/* 标题整体降一档 */
	h1 { font-size: 28px; }
	h2 { font-size: 24px; }

	.ors-section__heading {
		flex-direction: column;
		align-items: flex-start;
		gap: 8px;
	}

	/* 480px 下隐藏轮播控制按钮，改为直接手势滑动 */
	.ors-product-strip__controls {
		display: none;
	}
	.ors-product-strip__grid {
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.ors-product-strip__grid::-webkit-scrollbar { display: none; }
	.ors-product-strip__grid .ors-product-card {
		scroll-snap-align: start;
	}
}

/* ============================================================
   页头（header）
   说明：主题已移植 Shopify 风格汉堡抽屉菜单（.header-drawer /
   .menu-drawer，≤989px 显示），此处仅做细节优化。
   ============================================================ */

@media (max-width: 1024px) {
	/* 抽屉菜单项触控区加大 */
	.menu-drawer__menu-item,
	.menu-drawer__close-button {
		min-height: 48px;
		padding-top: 12px;
		padding-bottom: 12px;
	}
}

@media (max-width: 480px) {
	/* 汉堡与图标按钮触控区 */
	.header-drawer > details > summary,
	.header__icon {
		min-width: 44px;
		min-height: 44px;
	}

	/* 移动端搜索弹层占满全屏，输入框加大 */
	.header__search .search-modal {
		padding: 76px 16px 16px;
	}
	.header__search .search__input {
		min-height: 48px;
		font-size: 16px; /* 避免 iOS 聚焦时自动放大页面 */
	}
}

/* ============================================================
   首页（front-page.php）
   ============================================================ */

/* ≤1024px：hero 高度与字号按比例缩减 */
@media (max-width: 1024px) {
	.ors-hero {
		aspect-ratio: auto;
		min-height: 380px;
	}
	.ors-hero__content {
		padding: 32px 24px;
	}
	.ors-hero__content > div {
		min-width: 0; /* 固定最小宽度改流式 */
		padding: 32px 24px;
	}
	.ors-hero h1 {
		font-size: 34px;
		max-width: 420px;
	}

	/* 分屏促销：高度流式化 */
	.ors-split-promos,
	.ors-split-promo {
		height: auto;
	}
	.ors-split-promo img {
		height: 100%;
		min-height: 480px;
	}
	.ors-split-promo h2 {
		font-size: 32px;
		line-height: 36px;
	}

	/* 奖项区块高度改流式 */
	.ors-award {
		height: auto;
	}
	.ors-award__copy {
		gap: 40px;
		padding: 40px 24px 0;
	}
}

/* ≤768px：首页多列栅格折叠为 2 列 */
@media (max-width: 768px) {
	/* hero：固定高度、字号缩减 */
	.ors-hero {
		height: 400px;
		min-height: 0;
	}
	.ors-hero__content {
		align-items: flex-end;
		padding: 24px 16px;
	}
	.ors-hero__content > div {
		width: 100%;
		padding: 20px 8px;
	}
	.ors-hero h1 {
		max-width: 300px;
		font-size: 30px;
	}
	.ors-hero p:not(.ors-eyebrow) {
		font-size: 15px;
	}

	/* 新品横滑区：一屏 2 张卡片 */
	.ors-product-strip__grid {
		grid-auto-columns: calc(50% - 4px);
		gap: 8px;
	}
	.ors-product-card__media {
		width: 100%;
		height: auto;
		aspect-ratio: 1 / 1;
	}
	.ors-product-card__media img {
		width: 100%;
		height: 100%;
	}

	/* 分屏促销：双列折单列堆叠 */
	.ors-split-promos {
		display: block;
		height: auto;
		margin-top: 0;
	}
	.ors-split-promo,
	.ors-split-promo img {
		height: 380px;
		min-height: 0;
	}

	/* 探索活动栅格：4 列 → 2 列 */
	.ors-adventure__grid {
		grid-auto-columns: calc(50% - 6px);
		gap: 8px;
	}

	/* 品牌故事滚动盒：双栏折单栏 */
	.ors-scrollbox {
		grid-template-columns: 1fr;
		margin-top: 30px;
	}
	.ors-scrollbox__media {
		min-height: 320px;
	}
	.ors-scrollbox__panel {
		max-height: 420px;
	}
	.ors-scrollbox__item {
		gap: 14px;
		padding: 14px 16px;
	}
	.ors-scrollbox__item img {
		flex: 0 0 72px;
		width: 72px;
		height: 72px;
	}

	/* 故事卡片：4 列 → 2 列 */
	.ors-blog-grid {
		grid-auto-columns: calc((100% - 12px) / 2);
		gap: 12px;
	}
	.ors-story-card__title {
		font-size: 18px;
	}
	.ors-story-card__excerpt {
		font-size: 14px;
		line-height: 21px;
	}

	/* 奖项双栏文字折单栏 */
	.ors-award__cols {
		grid-template-columns: 1fr;
		gap: 20px;
	}
	.ors-award__copy {
		display: block;
		padding: 32px 20px;
	}

	/* 订阅区堆叠 */
	.ors-newsletter {
		height: auto;
		padding: 28px 20px;
	}
	.ors-newsletter__inner {
		display: block;
		height: auto;
	}

	/* 页脚：5 列 → 2 列 */
	.ors-footer {
		padding: 40px 20px 0;
	}
	.ors-footer__cols {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 28px 16px;
	}
	.ors-footer__side {
		grid-column: 1 / -1;
	}
	.ors-footer__bottom {
		margin-top: 36px;
		padding: 20px 0;
	}
}

/* ≤480px：首页进一步收紧 */
@media (max-width: 480px) {
	.ors-hero {
		height: 360px;
	}
	.ors-hero h1 {
		font-size: 26px;
	}

	/* 集合入口标题字号 */
	.ors-nbw h2 {
		font-size: 30px;
		line-height: 36px;
	}
	.ors-nbw__inner {
		padding: 56px 16px;
	}

	/* 新品区一屏 1.35 张，突出滑动暗示 */
	.ors-product-strip__grid {
		grid-auto-columns: 74%;
	}

	/* 分屏促销更矮 */
	.ors-split-promo,
	.ors-split-promo img {
		height: 320px;
	}

	/* 页脚单列 */
	.ors-footer__cols {
		grid-template-columns: 1fr;
		gap: 24px;
	}
}

/* ============================================================
   商品列表页（woocommerce/archive-product.php + content-product.php）
   ============================================================ */

@media (max-width: 1024px) {
	/* 顶部集合选择器：高度收紧、卡片固定宽度改流式 */
	.ors-collection-selector {
		height: 380px;
	}
	.ors-collection-selector__title {
		padding-top: 32px;
	}
	.ors-collection-selector__track {
		grid-auto-columns: 180px;
		gap: 12px;
		margin-top: 32px;
	}
	.ors-collection-selector__track a {
		width: 180px;
	}

	/* 筛选栏 + 产品区：侧栏改上下堆叠（小屏筛选始终可见、可折叠） */
	.ors-shop-layout {
		grid-template-columns: 1fr;
		gap: 24px;
	}

	/* 产品栅格：3 列 → 2 列 */
	.ors-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 24px 10px;
	}

	/* 列表页 H1 字号缩减 */
	.ors-archive__heading h1 {
		font-size: 32px;
		line-height: 38px;
	}
}

@media (max-width: 768px) {
	/* 筛选栏：堆叠在产品上方，占满整行 */
	.ors-filter {
		display: block; /* 覆盖桌面端 ≤980px 的隐藏规则，小屏恢复可用的筛选 */
		order: -1;
		margin-bottom: 8px;
	}
	.ors-filter h2 {
		margin-bottom: 12px;
		font-size: 17px;
	}

	/* 筛选折叠项：触控友好的手风琴 */
	.ors-filter details {
		padding-block: 4px;
	}
	.ors-filter summary {
		min-height: 44px; /* 触控区 ≥44px */
		align-items: center;
	}

	/* 结果数与排序工具栏：堆叠排列 */
	.ors-shop-tools {
		flex-wrap: wrap;
		gap: 10px;
	}
	.ors-shop-tools .woocommerce-ordering {
		width: 100%;
	}
	.ors-shop-tools select {
		width: 100%;
		min-height: 44px;
	}

	/* 产品卡片标题与价格字号 */
	.ors-product-card__title {
		font-size: 15px;
		line-height: 21px;
	}
	.ors-product-card__badge {
		top: 10px;
		right: 8px;
		padding: 4px 12px;
		font-size: 11px;
	}

	/* 分页间距收紧 */
	.ors-pagination {
		padding-top: 32px;
	}
}

@media (max-width: 480px) {
	.ors-collection-selector {
		height: auto;
		padding-bottom: 24px;
	}
	.ors-collection-selector__track {
		grid-auto-columns: 44%;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.ors-collection-selector__track::-webkit-scrollbar { display: none; }
	.ors-collection-selector__track a,
	.ors-collection-selector__track img {
		width: 100%;
	}
	.ors-collection-selector__controls {
		display: none; /* 手机直接手势滑动 */
	}

	.ors-archive__heading h1 {
		font-size: 26px;
		line-height: 32px;
	}

	/* 产品栅格间距进一步收紧 */
	.ors-product-grid {
		gap: 20px 8px;
	}
	.ors-product-grid .ors-product-card__details {
		padding-inline: 4px;
	}
}

/* ============================================================
   商品详情页（woocommerce/single-product.php）
   ============================================================ */

@media (max-width: 768px) {
	/* 图/信息双栏 → 单栏堆叠 */
	.ors-single {
		width: calc(100% - 32px);
		padding: 10px 0 60px;
	}
	.ors-single__grid {
		grid-template-columns: 1fr;
		gap: 0;
	}

	/* 画廊：改为主图全宽 + 横向滚动（scroll-snap 逐张对齐） */
	.ors-gallery {
		display: flex;
		gap: 8px;
		margin-inline: -16px; /* 图片顶到屏幕边缘，全宽观感 */
		padding-inline: 16px;
		overflow-x: auto;
		scroll-snap-type: x mandatory;
		-webkit-overflow-scrolling: touch;
		scrollbar-width: none;
	}
	.ors-gallery::-webkit-scrollbar { display: none; }
	.ors-gallery__item {
		flex: 0 0 88%;
		width: 88%;
		aspect-ratio: 1 / 1;
		scroll-snap-align: center;
	}

	/* 信息区取消粘性定位，恢复文档流 */
	.ors-single__summary {
		position: static;
		padding-top: 20px;
	}
	.ors-single__summary h1 {
		max-width: none;
		margin-top: 14px;
		font-size: 28px;
		line-height: 34px;
	}
	.ors-single__summary .price {
		font-size: 18px;
	}

	/* 变体选择（颜色/尺码）：触控友好 */
	.ors-color-options {
		gap: 14px;
	}
	.ors-color-swatch {
		width: 32px;
		height: 32px; /* 触控区 ≥30px */
	}
	.ors-size-options {
		gap: 10px;
	}
	.ors-size-options label {
		width: 74px;
		height: 44px;
		line-height: 44px;
		font-size: 15px;
	}

	/* 加购表单：竖向堆叠，按钮全宽 */
	.ors-single__summary form.cart {
		flex-direction: column;
		gap: 0;
		margin-top: 20px;
	}
	.ors-cart-form .single_variation_wrap {
		width: 100%;
	}
	.ors-single__summary form.cart button.single_add_to_cart_button {
		width: 100%;
		min-height: 52px;
		font-size: 16px;
	}

	/* 产品说明与手风琴 */
	.ors-product-description {
		margin-top: 40px;
		padding-top: 32px;
	}
	.ors-product-description__copy h3 {
		font-size: 22px;
	}
	.ors-product-tabs {
		margin-top: 40px;
	}
	.ors-product-tabs .wc-tabs {
		gap: 16px;
		overflow-x: auto; /* 标签多时可横向滑动 */
		-webkit-overflow-scrolling: touch;
	}
	.ors-product-tabs .wc-tabs li a {
		padding: 14px 0;
		white-space: nowrap;
	}

	/* 尺码表弹层：小屏全屏化，表格内部横向滚动 */
	.ors-size-chart-modal {
		padding: 0;
		align-items: flex-end;
	}
	.ors-size-chart-modal__panel {
		width: 100%;
		max-height: 85vh;
		overflow-y: auto;
		padding: 20px 16px 32px;
	}
}

@media (max-width: 480px) {
	.ors-single__summary h1 {
		font-size: 24px;
		line-height: 30px;
	}

	/* 尺码方块收窄以便一屏放下更多 */
	.ors-size-options label {
		width: 70px;
	}

	/* 相关产品（复用产品卡片栅格）：2 列保持，间距收紧 */
	.ors-product-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	/* 画廊主图占比更高 */
	.ors-gallery__item {
		flex: 0 0 100%;
		width: 100%;
	}
}

/* ============================================================
   账户/表单等 WooCommerce 页面（通用兜底）
   ============================================================ */

@media (max-width: 768px) {
	/* 登录双栏折单栏 */
	.ors-login-grid {
		grid-template-columns: 1fr;
	}
	.ors-login-panel {
		padding: 24px 16px;
	}

	/* 账户页留白收紧 */
	.ors-account {
		padding: 24px 16px 60px;
	}

	/* 表格兜底：全部允许横向滚动 */
	.ors-account table.shop_table,
	.ors-account .ors-table {
		display: block;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
	}

	/* WooCommerce 提示条改全宽 */
	.woocommerce-message,
	.woocommerce-info,
	.woocommerce-error {
		max-width: calc(100% - 32px);
		margin: 12px 16px;
	}

	/* 政策页固定宽度改流式 */
	.ors-policy {
		width: calc(100% - 32px);
		margin: 20px auto 60px;
	}
	.ors-policy h1 {
		font-size: 28px;
		line-height: 34px;
	}
}
