/* === CSS Reset & Base === */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { font-size: 16px; -webkit-text-size-adjust: 100%; -webkit-font-smoothing: antialiased; }
body {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;
  background: #FAF7F4;
  color: #3D2E27;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
a { text-decoration: none; color: inherit; }
img { max-width: 100%; display: block; content-visibility: auto; }
/* 首屏图片不需要 content-visibility */
.banner-slide img, .brand-logo, .shop-card img { content-visibility: visible; }
ul, ol { list-style: none; }

/* === CSS Variables === */
:root {
  --primary: #5C4033;
  --primary-light: #B87A5A;
  --accent: #8FA88F;
  --accent-light: #C5D5C5;
  --bg: #FAF7F4;
  --card: #FFFFFF;
  --text: #3D2E27;
  --text-secondary: #8C8C8C;
  --text-light: #9E9590;
  --border: #F0E8E0;
  --shadow: 0 2px 12px rgba(92, 64, 51, 0.06);
  --radius: 12px;
  --radius-sm: 8px;
  --nav-height: 48px;
  --tab-height: 56px;
  /* ── 统一间距系统(8px网格) ── */
  --sp-xxs: 4px;
  --sp-xs: 8px;
  --sp-sm: 12px;
  --sp-md: 16px;
  --sp-lg: 24px;
  --sp-xl: 32px;
  --sp-2xl: 48px;
  /* ── 统一圆角系统 ── */
  --radius-xs: 4px;
  --radius-sm: 6px;
  --radius-md: 10px;
  --radius-lg: 16px;
  --radius-full: 999px;
  /* ── 4级阴影 ── */
  --shadow-elevation-1: 0 2px 8px rgba(92,64,51,0.05);
  --shadow-elevation-2: 0 4px 16px rgba(92,64,51,0.08);
  --shadow-elevation-3: 0 8px 32px rgba(92,64,51,0.12);
  --shadow-elevation-4: 0 12px 48px rgba(92,64,51,0.18);
  /* ── 统一边框体系 ── */
  --border-width: 1px;
  --border-color-container: #F0E8E0;        /* 容器/卡片边框 */
  --border-color-input: #E8E0D5;            /* 输入框/表单边框 */
  --border-color-btn: rgba(184,122,90,0.18); /* 次按钮描边 */
  /* ── 统一按钮尺寸(相对单位，自适应) ── */
  --btn-py: 0.7em;                          /* 按钮上下内边距 */
  --btn-px: 1.2em;                          /* 按钮左右内边距 */
  --btn-radius: 1.5em;                      /* 按钮圆角(胶囊形) */
  --btn-radius-sm: 0.75em;                  /* 小按钮圆角 */
  /* ── 统一阴影 ── */
  --shadow-btn: 0 2px 8px rgba(184,122,90,0.2);
  --shadow-card: 0 2px 12px rgba(92,64,51,0.05);
  /* ── 统一过渡 ── */
  --transition-fast: 0.15s ease;
  /* ── 商品信息层级(名称最重 → 价格次之 → 说明最轻) ── */
  --product-name-color: var(--primary);          /* 名称：最深最重 */
  --product-price-color: #B87A5A;                /* 价格：暖铜醒目 */
  --product-price-bg: rgba(184,122,90,0.06);     /* 可操作价格浅底 */
  --product-desc-color: var(--text-secondary);   /* 说明：灰色弱化 */
  --product-desc-size: 11px;                     /* 说明：小字号 */
  --product-aux-color: var(--text-light);        /* 辅助：最轻 */
  /* ── 折叠面板统一体系 ── */
  --collapsible-panel-border: var(--border-color-container); /* 面板统一描边 */
  --collapsible-panel-gap: 10px;                 /* 面板间距 */
  --collapsible-header-py: 13px;                 /* 面板标题区上下内边距 */
  --collapsible-header-px: 14px;                 /* 面板标题区左右内边距 */
  --collapsible-body-px: 14px;                   /* 面板内容区内边距 */
  --collapsible-arrow-color: var(--text-light);  /* 折叠箭头色 */
  --collapsible-arrow-size: 14px;                /* 折叠箭头字号 */
  /* ── 步骤标题(介于一级标题与正文之间) ── */
  --step-num-bg: var(--primary);                 /* 步骤序号底色 */
  --step-num-color: #fff;                        /* 步骤序号文字色 */
  --step-title-color: var(--primary);            /* 步骤标题色 */
  --step-body-color: var(--text-secondary);      /* 步骤正文色 */
  /* ── 辅助备注(全站最轻视觉) ── */
  --aux-note-color: #B0A79D;                     /* 辅助备注文字色 */
  --aux-note-bg: rgba(184,122,90,0.03);          /* 辅助备注底色 */
  --aux-note-size: 11px;                         /* 辅助备注字号 */
}

/* === Navigation Bar === */
.nav-bar {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--nav-height);
  background: #FFFFFF;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 1px 0 var(--border);
  padding: 0 env(safe-area-inset-right, 16px) 0 env(safe-area-inset-left, 16px);
}
.nav-title {
  font-size: 17px; font-weight: 600; color: var(--primary);
  letter-spacing: 0.5px;
}

/* === Page Container === */
.page-container {
  margin-top: var(--nav-height);
  margin-bottom: var(--tab-height);
  min-height: calc(100vh - var(--nav-height) - var(--tab-height));
  padding: var(--sp-md) var(--sp-md) 40px;
}
.page-container.detail-open {
  margin-bottom: 0;
}

/* === Tab Bar === */
.tab-bar {
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 100;
  height: var(--tab-height);
  background: #FFFFFF;
  display: flex; align-items: center;
  box-shadow: 0 -1px 0 var(--border);
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.tab-item {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 4px 0; color: #999999;
  cursor: pointer; transition: color 0.2s, opacity 0.12s;
  -webkit-tap-highlight-color: transparent;
  pointer-events: auto;          /* 确保可点击 */
  user-select: none;
  -webkit-user-select: none;
}
.tab-item:active {
  opacity: 0.65;                 /* 点击瞬间视觉反馈 */
}
.tab-item.active { color: var(--primary-light); }
.tab-icon { line-height: 1; margin-bottom: 2px; display: flex; align-items: center; justify-content: center; }
.tab-icon svg { display: block; }
.tab-item .tab-icon { opacity: 0.55; transition: opacity 0.25s; }
.tab-item.active .tab-icon { opacity: 1; }
.tab-text { font-size: 11px; line-height: 1; }

/* === Shop Card (Header) === */
.shop-card {
  background: var(--card); border-radius: var(--radius);
  box-shadow: none; padding: 16px;
  margin-bottom: 16px;
  contain: layout style;
  border: none;
}
.shop-card-body { }
/* mirror 模式：垂直反转（按钮在上，联系信息在下） */
.shop-card--mirror .shop-card-body {
  display: flex;
  flex-direction: column-reverse;
}
.brand-header {
  display: flex; align-items: center; gap: 12px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}
.brand-logo {
  width: 84px; height: 84px; /* 56px × 1.5 */
  object-fit: contain; flex-shrink: 0;
  background: transparent !important;
  border: none;
  outline: none;
  /* 强制透明背景，兼容任何图片底色 */
  -webkit-mask-image: none;
  mask-image: none;
  /* 悬浮投影 — 在logo边缘投射柔和阴影 */
  filter: drop-shadow(0 6px 18px rgba(0,0,0,0.35))
          drop-shadow(0 2px 6px rgba(0,0,0,0.20));
  /* 悬浮动画 */
  animation: logoFloat 3.5s ease-in-out infinite;
}


.brand-text { flex: 1; min-width: 0; }
.brand-name { font-size: 15px; font-weight: 600; color: var(--primary); }
.brand-name-large { font-size: 19px; font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brand-tagline {
  font-size: 12px; color: var(--primary-light); margin-top: 3px;
  letter-spacing: 0.5px; font-weight: 500;
}
/* 安心承诺条（首页暖心陪伴Tab） */
.assurance-bar {
  margin: 0 0 12px; padding: 10px 14px; background: var(--card); border-radius: var(--radius);
  display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12px; line-height: 1.6;
}
.assurance-item { display: inline-flex; align-items: baseline; gap: 2px; color: var(--text); }
.assurance-check { color: var(--accent); font-weight: 700; font-size: 13px; }

/* ===== 星星故事（首页用户心声） ===== */
.story-section { margin-bottom: 12px; }
.story-list { display: flex; gap: 10px; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; padding-bottom: 4px; }
.story-list::-webkit-scrollbar { display: none; }
.story-card {
  flex: 0 0 80vw; max-width: 340px; scroll-snap-align: start;
  background: var(--card); border-radius: var(--radius); padding: 16px;
  box-shadow: none; position: relative;
}
.story-quote {
  font-size: 36px; color: var(--primary-light); opacity: 0.25;
  line-height: 1; margin-bottom: -10px; font-family: Georgia, serif;
}
.story-body { font-size: 14px; line-height: 1.75; color: var(--text); margin-bottom: 10px; }
.story-footer { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
.story-author { font-size: 13px; font-weight: 600; color: var(--primary); }
.story-tag {
  font-size: 11px; padding: 2px 8px; border-radius: 10px;
  background: rgba(92,64,51,0.06); color: var(--primary-light);
}

.brand-bigtitle {
  font-size: 18px; font-weight: 700; color: var(--text);
  letter-spacing: 1px; margin-top: 4px;
}
/* 五项服务列表 */
.service-items {
  padding: 10px 0 4px;
}
.service-item {
  display: flex; gap: 6px; padding: 4px 0;
  font-size: 13px; color: var(--text); line-height: 1.7;
  align-items: flex-start;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* .service-dot 已废弃（JS已移除圆点HTML） */
.service-dot {
  font-size: 16px; font-weight: 700; color: var(--primary);
  line-height: 1.6; flex-shrink: 0;
}
.service-body strong { color: var(--primary); font-weight: 600; white-space: nowrap; }
.contact-list { padding-top: 12px; }
.contact-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; font-size: 13px;
}
.contact-row-tappable { cursor: pointer; }
.contact-icon { font-size: 14px; flex-shrink: 0; }
.contact-text { color: var(--text-secondary); flex: 1; }
.contact-text--shop-name {
  font-size: 18px; font-weight: 700; color: #E0C48C;
  text-align: center; letter-spacing: 4px;
}
.contact-row--shop-name { padding: 16px 0 10px; justify-content: center; }
.contact-text-link { color: var(--text-secondary); }
.contact-arrow { color: var(--text-light); font-size: 16px; }

.triple-action-bar {
  display: flex; gap: 12px; margin-top: 14px;
}
.action-btn {
  flex: 1; text-align: center; padding: 13px 0;
  border-radius: var(--btn-radius); font-size: 15px;
  cursor: pointer; font-weight: 600;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.25s ease;
  /* —— 统一按钮：温润渐变底 + 细描边 + 柔阴影 + 暖棕文字 —— */
  background: linear-gradient(135deg, rgba(184,122,90,0.05), rgba(184,122,90,0.12));
  color: var(--primary-light);
  border: var(--border-width) solid var(--border-color-btn);
  box-shadow: 0 2px 8px rgba(184,122,90,0.10);
  backdrop-filter: blur(4px);
}
.action-btn:active {
  transform: scale(0.96);
  background: rgba(184,122,90,0.18);
  box-shadow: 0 1px 3px rgba(184,122,90,0.06);
  color: var(--primary);
}
/* 三按钮视觉统一，不再区分主次 */
.action-btn-nav,
.action-btn-call,
.action-btn-wechat { }

/* 分享按钮（首页卡片底部） */
.card-share-bar {
  margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border);
  text-align: center;
}
.card-share-btn {
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 12px; color: var(--primary-light); cursor: pointer;
  padding: 6px 14px; border-radius: var(--btn-radius);
  background: rgba(92,64,51,0.05); transition: background 0.15s;
}
.card-share-btn:active { background: rgba(92,64,51,0.12); }

/* ===== 三步引导卡片（暖心陪伴Tab） ===== */
.guide-steps {
  display: flex; align-items: center; gap: 6px;
  margin-bottom: 12px; padding: 4px 0; overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.guide-steps::-webkit-scrollbar { display: none; }
.guide-step {
  flex: 1; min-width: 90px; display: flex; flex-direction: column;
  align-items: center; gap: 1px; padding: 10px 8px; border-radius: var(--radius);
  background: var(--card); cursor: pointer; position: relative;
  box-shadow: none;
  transition: transform 0.15s;
}
.guide-step:active { transform: scale(0.96); }
.guide-step-num { font-size: 10px; color: var(--primary-light); font-weight: 600; letter-spacing: 1px; }
.guide-step-icon { font-size: 20px; line-height: 1; margin: 2px 0; }
.guide-step-title { font-size: 13px; font-weight: 600; color: var(--text); white-space: nowrap; }
.guide-step-desc { font-size: 10px; color: var(--text-light); white-space: nowrap; }
.guide-step-arrow {
  position: absolute; right: -8px; top: 50%; transform: translateY(-50%);
  font-size: 16px; color: var(--primary-light); opacity: 0.3;
}

/* === Banner Swiper · 16:9 自适应 === */
.banner-section {
  background: var(--card); border-radius: var(--radius);
  box-shadow: none; overflow: hidden;
  margin: 12px 0 16px;
}
.banner-swiper {
  position: relative; width: 100%;
  padding-top: 56.25%; /* 16:9 */
  overflow: hidden;
  background: var(--border);
}
.banner-track {
  position: absolute; inset: 0;
  display: flex; transition: transform 0.4s ease;
  height: 100%; width: 100%;
}
.banner-slide {
  flex: 0 0 100%; width: 100%; height: 100%;
  position: relative;
  background: var(--border);
}
.banner-slide img {
  width: 100%; height: 100%; object-fit: cover;
  display: block;
}
.banner-slide .banner-empty {
  width: 100%; height: 100%;
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  color: var(--text-light); font-size: 13px; gap: 4px;
  background: linear-gradient(135deg, #FAF7F4 0%, #F0E8E0 100%);
}
/* 轮播图注解文字 */
.banner-caption {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 20px 14px 10px;
  background: linear-gradient(to top, rgba(61,46,39,0.75) 0%, rgba(61,46,39,0.4) 60%, transparent 100%);
  color: #FFF; font-size: 12px; line-height: 1.5;
  letter-spacing: 0.5px; text-align: center;
  pointer-events: none;
}
.banner-dots {
  position: absolute; bottom: 10px; left: 0; right: 0;
  display: flex; justify-content: center; gap: 6px;
  z-index: 3;
}
.banner-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: rgba(92,64,51,0.25); transition: all 0.3s;
  cursor: pointer;
}
.banner-dot.active { background: var(--primary-light); width: 18px; border-radius: 3px; }

/* === Section Header === */
.section-header {
  display: flex; align-items: center; gap: 12px;
  margin-bottom: var(--sp-md); padding: 4px 0;
}
.section-line { flex: 1; height: 1px; border-radius: 1px; }
.section-line:first-child { background: linear-gradient(to right, transparent, var(--border)); }
.section-line:last-child  { background: linear-gradient(to left,  transparent, var(--border)); }
.section-title {
  font-size: 14px; font-weight: 600; color: var(--primary);
  white-space: nowrap;
}

/* === Process List === */
.process-list { }
.process-list + .section-header { margin-top: 8px; }
.process-item {
  display: flex; align-items: center; gap: 0;
  background: var(--card); border-radius: var(--radius);
  padding: var(--sp-md) var(--sp-md); margin-bottom: var(--sp-sm);
  box-shadow: none;
  cursor: pointer; transition: transform 0.15s;
  -webkit-tap-highlight-color: transparent;
}
.process-item:active { transform: scale(0.985); }
.process-num-area {
  width: 38px; height: 38px; border-radius: 50%;
  border: 1.5px solid var(--primary);
  background: transparent;
  color: var(--primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; flex-shrink: 0;
  letter-spacing: -0.5px;
  line-height: 1;
}
.process-info {
  flex: 1; min-width: 0;
  margin-left: var(--sp-md);
  position: relative;
  z-index: 2;
}
.process-name-row {
  display: inline-flex;
  align-items: baseline; gap: 8px; flex-wrap: nowrap;
  margin-left: -12px; /* 横线从圆圈右侧开始 */
  padding-left: 12px; /* 文字回正 */
  padding-bottom: 3px; /* 标题与横线间距 */
  border-bottom: 1px solid var(--primary); /* 标题下划线，随内容宽度 */
  margin-bottom: 6px; /* 横线与描述间距 */
}
.process-name { font-size: 15px; font-weight: 600; color: var(--text); line-height: 1.2; }
.process-name-sub { font-size: 12px; color: var(--primary-light); }
.process-desc {
  font-size: 13px; color: var(--text-secondary); margin-top: 0;
  line-height: 1.5;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.process-right { display: flex; align-items: center; gap: 8px; flex-shrink: 0; }
.process-arrow { color: var(--text-light); font-size: 14px; }

/* === Category Page (用品精选) · 左右分栏布局 === */

/* 空状态 */
.category-empty {
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 80px 20px; text-align: center;
}
.category-empty-icon { font-size: 48px; margin-bottom: 16px; opacity: 0.6; }
.category-empty-text { font-size: 16px; color: var(--text); font-weight: 600; margin-bottom: 8px; }
.category-empty-sub { font-size: 13px; color: var(--text-light); }



/* 左右分栏容器 */
.category-layout {
  display: flex; gap: 0;
  height: calc(100vh - var(--nav-height) - var(--tab-height) - 68px);
  min-height: 400px;
  overflow: hidden;
}

/* -- 左侧一级分类侧边栏 -- */
.category-sidebar {
  width: 100px; min-width: 100px; max-width: 100px;
  background: #FFF; border-right: 1px solid var(--border);
  overflow-y: hidden; overflow-x: hidden;
  display: flex; flex-direction: column;
  justify-content: space-evenly;
  padding: 12px 0;
}
.cat-sidebar-item {
  display: flex; flex-direction: column;
  align-items: center; justify-content: center;
  padding: 10px 4px; gap: 4px;
  cursor: pointer; transition: all 0.15s;
  -webkit-tap-highlight-color: transparent;
  border-bottom: 2px solid transparent;
  position: relative;
}
.cat-sidebar-item:active { background: #FAF7F4; }
.cat-sidebar-item.active {
  background: #FAF7F4;
  border-bottom-color: var(--primary-light);
}
.cat-sidebar-icon { display: none; }
.cat-sidebar-name {
  font-size: 12px; color: var(--text);
  text-align: center; line-height: 1.3;
  max-width: 100%; white-space: nowrap;
  word-break: normal;
}
.cat-sidebar-item.active .cat-sidebar-name {
  color: var(--primary-light); font-weight: 600;
}
.cat-sidebar-count {
  font-size: 10px; color: var(--text-light);
  background: var(--border); border-radius: 8px;
  padding: 1px 6px; min-width: 20px; text-align: center;
  flex-shrink: 0;
}

/* -- 右侧内容区 -- */
.category-content-area {
  flex: 1; min-width: 0;
  overflow-y: auto; overflow-x: hidden;
  -webkit-overflow-scrolling: touch;
  padding: 8px 10px 0;
  background: var(--bg);
}
/* -- 二级分类区域 -- */
.sub-cat-section {
  margin-bottom: 16px;
}
.sub-cat-section-title {
  font-size: 13px; font-weight: 600; color: var(--primary-light);
  margin-bottom: 10px;
  display: flex; align-items: center; gap: 10px;
}
.sub-cat-section-title::before,
.sub-cat-section-title::after {
  content: '';
  flex: 1;
  height: 1px;
  border-radius: 1px;
}
.sub-cat-section-title::before {
  background: linear-gradient(to right, transparent, var(--primary-light));
  opacity: 0.35;
}
.sub-cat-section-title::after {
  background: linear-gradient(to left, transparent, var(--primary-light));
  opacity: 0.35;
}

/* -- 两列商品网格 -- */
.product-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 12px;
}

/* -- 单个商品卡片 -- */
.product-item {
  background: var(--card); border-radius: var(--radius-sm);
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.12s, box-shadow 0.2s;
  box-shadow: none;
}
.product-item:active { transform: scale(0.97); }
.product-item-img-wrap {
  position: relative; width: 100%;
  padding-top: 100%; /* 1:1 正方形 */
  background: transparent; overflow: hidden;
  border-radius: 0;
}
.product-item-img {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.product-item-wish {
  display: none !important;
}

/* 已在清单角标 */
.product-wish-badge {
  position: absolute; top: 4px; right: 4px; z-index: 2;
  font-size: 10px; padding: 2px 6px; border-radius: 6px;
  background: rgba(200,230,201,0.92); color: #2E7D32;
  font-weight: 600; line-height: 1.4;
}
.product-item--wished {
  /* 已在清单的商品 细微边框高亮 */
  border-color: rgba(46,125,50,0.25);
}
.product-item--wished .product-item-name { color: var(--text-secondary); }
.product-item--wished .product-item-img { opacity: 0.75; }
.product-item-info {
  padding: 6px 4px 4px;
}
.product-item-name {
  font-size: 12px; font-weight: 600; color: var(--product-price-color); line-height: 1.4;
  text-align: left;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.product-item-price {
  font-size: 12px; font-weight: 400; color: var(--product-name-color);
  margin-top: 4px; text-align: left;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  display: block; max-width: 100%;
}
.product-item-price .price-inquiry {
  color: var(--text-light); font-weight: 500; font-size: 12px;
  display: inline-block; max-width: 100%;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  vertical-align: bottom;
}

/* === Process Detail Page === */
.detail-overlay {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 200;
  background: #FAF7F4; overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  animation: slideIn 0.3s ease;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
@keyframes slideIn {
  from { transform: translateX(100%); }
  to { transform: translateX(0); }
}
.detail-nav {
  position: sticky; top: 0; z-index: 10;
  display: flex; align-items: center; gap: 10px;
  background: #FFFFFF; padding: 0 12px;
  height: 48px; box-shadow: 0 1px 0 var(--border);
}
.detail-back {
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.detail-nav-title {
  font-size: 16px; font-weight: 600; color: var(--primary);
  flex: 1; text-align: center; padding: 0 50px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.detail-content { padding: 16px 16px 32px; }
.detail-core {
  background: var(--card); border-radius: var(--radius);
  padding: 16px; margin-bottom: var(--collapsible-panel-gap);
  box-shadow: none; border: none;
  border-left: 3px solid var(--primary-light);
}
.detail-core-title { font-size: 15px; font-weight: 700; color: var(--primary); margin-bottom: 8px; }
.detail-core-sub { font-size: 12px; font-weight: 400; color: var(--accent); }
.detail-core-text { font-size: 14px; color: var(--text); line-height: 1.8; }
.detail-step-card {
  background: var(--card); border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 10px;
  box-shadow: none;
}
.detail-step-head { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; }
.detail-step-num {
  display: inline-block; background: var(--step-num-bg);
  color: var(--step-num-color); font-size: 11px; font-weight: 700;
  padding: 2px 10px; border-radius: 10px; flex-shrink: 0;
}
.detail-step-title { font-size: 15px; font-weight: 600; color: var(--step-title-color); }
.detail-step-content { font-size: 13px; color: var(--step-body-color); line-height: 1.8; }
.detail-info-box-item { font-size: 13px; color: var(--step-body-color); line-height: 1.8; padding: 4px 0; }
.detail-notes {
  background: var(--aux-note-bg); border-radius: var(--radius-sm);
  padding: 10px 14px; margin-top: 12px;
  font-size: var(--aux-note-size); color: var(--aux-note-color); line-height: 1.7;
}

/* ===== 折叠面板 ===== */
.collapsible-section {
  background: var(--card); border-radius: var(--radius);
  margin-bottom: var(--collapsible-panel-gap); overflow: hidden;
  box-shadow: none;
  border: none;
}
.collapsible-header {
  display: flex; align-items: center; gap: 6px;
  padding: var(--collapsible-header-py) var(--collapsible-header-px); cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none; position: relative;
}
.collapsible-left-bar {
  position: absolute; left: 0; top: 8px; bottom: 8px;
  width: 3px; border-radius: 0 2px 2px 0;
  background: transparent; transition: background 0.3s;
}
.collapsible-section.open .collapsible-left-bar {
  background: var(--primary-light);
}
.collapsible-icon { font-size: 16px; flex-shrink: 0; }
.collapsible-title { font-size: 15px; font-weight: 600; color: var(--primary); }
.collapsible-sub-title { font-size: 12px; color: var(--text-light); margin-left: 4px; }
.collapsible-arrow {
  margin-left: auto; font-size: var(--collapsible-arrow-size); color: var(--collapsible-arrow-color);
  transition: transform 0.3s ease; flex-shrink: 0;
}
.collapsible-section.open .collapsible-arrow {
  transform: rotate(90deg);
}
.collapsible-body {
  max-height: 0; overflow: hidden;
  padding: 0 var(--collapsible-body-px);
  transition: max-height 0.35s ease-out;
}
.collapsible-section.open .collapsible-body {
  max-height: 6000px;
  padding: 0 var(--collapsible-body-px) var(--collapsible-header-py);
}

.detail-faq-item {
  padding: 8px 0;
}
.detail-faq-q { font-size: 14px; font-weight: 600; color: var(--primary-light); margin-bottom: 4px; }
.detail-faq-a { font-size: 13px; color: var(--step-body-color); line-height: 1.8; margin-bottom: 4px; }
.detail-faq-item:last-child .detail-faq-a { margin-bottom: 0; }

/* === Detail - 按需备物 === */
.detail-checkbar {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 12px; padding: 0 4px;
}
.detail-checkbar-tip { font-size: 13px; color: var(--text-secondary); }
.detail-checkbar-tip b { color: var(--primary-light); font-weight: 700; }
.detail-checkbar-toggle {
  font-size: 13px; color: var(--primary); cursor: pointer;
  padding: 4px 12px; border-radius: 12px; border: var(--border-width) solid var(--border-color-btn);
  background: #fff; -webkit-tap-highlight-color: transparent;
}
.detail-product-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px;
}
.detail-product-card {
  background: var(--card); border-radius: var(--radius);
  padding: 10px; position: relative; cursor: pointer;
  box-shadow: none;
  text-align: center; transition: box-shadow 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.detail-product-card:active { box-shadow: 0 2px 8px rgba(92,64,51,0.12); }
.detail-product-check {
  position: absolute; top: 6px; left: 6px; z-index: 2;
  width: 22px; height: 22px; border-radius: 50%;
  border: 2px solid #ccc; background: #fff;
  display: flex; align-items: center; justify-content: center;
  transition: all 0.2s;
}
.detail-product-check.checked {
  border-color: var(--accent); background: var(--accent);
}
.detail-product-check.checked::after {
  content: '✓'; color: #fff; font-size: 13px; font-weight: 700; line-height: 1;
}
.detail-product-fav {
  display: none !important;
}
.detail-product-fav.fav-active {
  display: none !important;
}
.detail-product-fav:active { transform: none; }
.detail-product-img {
  width: 100%; aspect-ratio: 1 / 1; object-fit: cover;
  border-radius: 0; background: transparent; margin-bottom: 6px;
}
.detail-product-name {
  font-size: 13px; font-weight: 600; color: var(--product-name-color); line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden; margin-bottom: 4px; min-height: 34px;
}
.detail-product-price {
  font-size: 12px; font-weight: 500; color: var(--product-price-color);
}
/* 按需备物区块：隐藏价格，仅展示商品图+名称 */
.detail-product-grid .detail-product-price { display: none; }
.detail-addbar {
  margin-top: 16px; padding-bottom: 10px;
  display: flex; gap: 12px;
}
.detail-contact-split { margin-top: 10px; }
.detail-addbar-btn {
  flex: 1; padding: 13px 0; text-align: center;
  background: var(--primary-light); color: #fff; font-size: 15px; font-weight: 600;
  border: none; border-radius: var(--btn-radius); cursor: pointer;
  box-shadow: 0 2px 10px rgba(184,122,90,0.3);
  -webkit-tap-highlight-color: transparent; transition: all 0.2s;
}
.detail-addbar-btn:active { opacity: 0.85; transform: scale(0.97); }
.detail-contact-btn {
  background: rgba(184,122,90,0.06); color: var(--primary-light);
  border: var(--border-width) solid var(--border-color-btn); box-shadow: none;
}
.detail-contact-btn--phone {
  background: var(--primary-light); color: #fff;
  border: none; box-shadow: 0 4px 10px rgba(184,122,90,0.25);
}
.detail-contact-btn--phone:active {
  filter: brightness(0.85); transform: scale(0.96);
}
.detail-contact-btn--back {
  background: transparent; color: var(--text-light);
  border: var(--border-width) solid rgba(0,0,0,0.08);
}
.detail-contact-btn--back:active { background: rgba(0,0,0,0.04); }

/* === 店长管理流程入口按钮 === */
.detail-nav-edit {
  font-size: 13px; color: #fff; background: var(--primary);
  padding: 0.3em 0.8em; border-radius: 0.9em; cursor: pointer;
  flex-shrink: 0; -webkit-tap-highlight-color: transparent;
  white-space: nowrap;
}

/* === ProcessEdit 流程编辑浮层（1:1复刻C端布局） === */
.pe-overlay { z-index: 210; }

/* 顶部导航栏编辑控件 */
.pe-nav { gap: 8px; }
.pe-nav-title-input {
  flex: 1; min-width: 0; border: 1px solid var(--border);
  border-radius: 6px; padding: 6px 10px; font-size: 15px;
  font-weight: 600; color: var(--primary); background: #FAF7F4;
  -webkit-appearance: none;
}
.pe-nav-title-input:focus { outline: none; border-color: var(--primary); background: #fff; }
.pe-nav-actions { display: flex; gap: 6px; flex-shrink: 0; }
.pe-nav-btn {
  font-size: 12px; padding: 5px 10px; border-radius: 14px;
  border: none; cursor: pointer; white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
}
.pe-nav-btn-discard {
  background: #f0ede8; color: var(--text-secondary);
}
.pe-nav-btn-save {
  background: var(--primary); color: #fff; font-weight: 600;
}

/* 编辑输入控件通用 */
.pe-input {
  width: 100%; border: 1px solid var(--border); border-radius: 6px;
  padding: 8px 12px; font-size: 14px; color: var(--text);
  background: #fff; -webkit-appearance: none; font-family: inherit;
}
.pe-input:focus { outline: none; border-color: var(--primary); }
.pe-textarea {
  width: 100%; border: 1px solid var(--border); border-radius: 6px;
  padding: 10px 12px; font-size: 14px; color: var(--text);
  background: #fff; resize: vertical; line-height: 1.7;
  font-family: inherit; -webkit-appearance: none;
}
.pe-textarea:focus { outline: none; border-color: var(--primary); }
.pe-input-error { border-color: #e8553e !important; background: #fef6f5; }

/* 字数提示 */
.pe-char-hint { font-size: 12px; color: var(--text-light); text-align: right; margin-top: 4px; }

/* 步骤编辑卡片 */
.pe-step-card {
  background: var(--card); border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 10px; position: relative;
  box-shadow: none;
}
.pe-card-top {
  display: flex; align-items: center; gap: 8px; margin-bottom: 8px;
}
.pe-drag-handle {
  cursor: grab; color: var(--text-light); font-size: 16px;
  line-height: 1; padding: 2px 2px; flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.pe-drag-handle:active { cursor: grabbing; }
.pe-faq-label {
  display: inline-block; background: var(--primary); color: #fff;
  font-size: 0.75em; font-weight: 700; padding: 0.15em 0.7em;
  border-radius: 10px; flex-shrink: 0;
}
.pe-del-btn {
  margin-left: auto; width: 24px; height: 24px; border-radius: 50%;
  border: none; background: rgba(232,85,62,0.1); color: #e8553e;
  font-size: 14px; cursor: pointer; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  -webkit-tap-highlight-color: transparent; transition: background 0.2s;
}
.pe-del-btn:active { background: rgba(232,85,62,0.25); }
.pe-step-title { margin-bottom: 8px; font-weight: 600; }
.pe-reorder { display: flex; gap: 8px; margin-top: 8px; }
.pe-reorder-btn {
  width: 2em; height: 2em; border-radius: 6px;
  border: 1px solid var(--border); background: #fff; color: var(--text-secondary);
  font-size: 14px; cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.pe-reorder-btn:active { background: #f5f0eb; }

/* FAQ编辑卡片 */
.pe-faq-card {
  background: var(--card); border-radius: var(--radius);
  padding: 14px 16px; margin-bottom: 10px; position: relative;
  box-shadow: none;
}
.pe-faq-q { margin-bottom: 8px; font-weight: 600; }

/* 新增按钮 */
.pe-add-btn {
  width: 100%; padding: 10px; border: var(--border-width) dashed var(--border-color-container);
  border-radius: var(--radius); background: transparent;
  color: var(--text-secondary); font-size: 14px; cursor: pointer;
  -webkit-tap-highlight-color: transparent; transition: all 0.2s;
}
.pe-add-btn:active { border-color: var(--primary); color: var(--primary); }

/* 商品搜索栏 */
.pe-prod-search { margin-bottom: 12px; }
.pe-prod-stats {
  font-size: 13px; color: var(--text-secondary); margin-bottom: 12px; padding: 0 4px;
}
.pe-prod-stats b { color: var(--accent); font-weight: 700; }

/* 确认弹窗 */
.pe-confirm-mask {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 300;
  background: rgba(0,0,0,0.5); display: flex; align-items: center;
  justify-content: center; animation: peFadeIn 0.2s ease;
}
@keyframes peFadeIn { from { opacity: 0; } to { opacity: 1; } }
.pe-confirm-box {
  background: #fff; border-radius: 14px; padding: 24px 20px 16px;
  width: 300px; max-width: 85%; text-align: center;
}
.pe-confirm-title { font-size: 16px; font-weight: 700; color: var(--text); margin-bottom: 8px; }
.pe-confirm-msg { font-size: 14px; color: var(--text-secondary); line-height: 1.6; margin-bottom: 20px; }
.pe-confirm-actions { display: flex; gap: 12px; }
.pe-confirm-btn {
  flex: 1; padding: 10px 0; border-radius: 8px; border: none;
  font-size: 14px; font-weight: 600; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.pe-confirm-cancel { background: #f0ede8; color: var(--text-secondary); }
.pe-confirm-ok { background: var(--primary); color: #fff; }
.pe-confirm-ok-single { flex: 1; }

/* === Wishlist Page（购物车横排卡片） === */

/* --- Tab切换（当前清单 / 历史订单） --- */
.wl-tabs {
  display: flex; gap: 12px;
  margin: 14px 16px 6px; padding: 0;
  background: transparent; border: none; border-radius: 0;
}
.wl-tab-btn {
  flex: 1; padding: 11px 0; text-align: center; font-size: 14px; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  color: var(--text-secondary); background: var(--card); border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  position: relative; transition: all 0.2s ease;
}
.wl-tab-btn.wl-tab-btn--active {
  color: #FFFFFF; background: var(--primary); border-color: var(--primary);
  box-shadow: 0 2px 10px rgba(92,64,51,0.22);
}
.wl-tab-btn.wl-tab-btn--active::after { display: none; }
.wl-tab-btn:active { transform: scale(0.98); }


/* 历史订单空状态 */
.wl-history-empty {
  text-align: center; padding: 60px 20px 40px; color: var(--text-light);
}
.wl-history-empty-icon { font-size: 44px; margin-bottom: 10px; opacity: 0.4; }
.wl-history-empty-title { font-size: 15px; font-weight: 600; color: var(--text); margin-bottom: 4px; }
.wl-history-empty-sub { font-size: 12px; color: var(--text-secondary); }

/* --- 空状态 --- */
.wl-empty {
  text-align: center; padding: 80px 20px 60px; color: var(--text-light);
}
.wl-empty-icon { font-size: 52px; margin-bottom: 14px; opacity: 0.5; }
.wl-empty-title { font-size: 16px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.wl-empty-sub { font-size: 13px; color: var(--text-secondary); margin-bottom: 20px; }
.wl-empty-btn {
  display: inline-block; padding: 10px 28px;
  background: var(--primary-light); color: #fff;
  border-radius: var(--btn-radius); font-size: 14px; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
}
.wl-empty-btn:active { transform: scale(0.96); opacity: 0.8; }

/* --- 顶部全选栏 --- */
.wl-topbar {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 14px; margin: 12px 12px 0;
  background: var(--card); border-radius: var(--radius-sm);
  box-shadow: 0 1px 4px rgba(92,64,51,0.04);
}
.wl-select-all {
  display: flex; align-items: center; gap: 8px;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  padding: 4px 0;
}
.wl-select-all:active { opacity: 0.7; }
.wl-select-label { font-size: 13px; font-weight: 600; color: var(--text); }
.wl-meta { font-size: 12px; color: var(--text-secondary); }
.wl-meta b { color: var(--primary-light); font-size: 14px; }

/* --- 通用复选框圆圈 --- */
.wl-chk {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%; flex-shrink: 0;
  border: 2px solid #D5C5B5; font-size: 11px; color: transparent;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: all 0.2s;
}
.wl-chk--on {
  border-color: var(--primary-light); background: var(--primary-light); color: #fff;
}

/* --- 商品列表 --- */
.wl-list {
  padding: 10px 8px 8px;
  margin: 8px 6px 0;
  background: transparent;
}

/* 卡片：6列×3行栅格，零边框零装饰 */
.wl-card {
  display: grid !important;
  grid-template-columns: repeat(6, 1fr) !important;
  grid-template-rows: 1fr 1fr 1fr !important;
  gap: 0 2px !important;
  align-items: center !important;
  padding: 0 !important;
  -webkit-tap-highlight-color: transparent !important;
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid var(--border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin: 0 0 14px 0 !important;
  padding-bottom: 14px !important;
}
.wl-card:last-child {
  border-bottom: none !important;
  margin-bottom: 0 !important;
  padding-bottom: 0 !important;
}

/* 勾选框 — C1 R2 左对齐，垂直居中 */
.wl-card > .wl-chk {
  grid-column: 1; grid-row: 2;
  justify-self: start; align-self: center;
  margin: 0;
  padding: 0;
  width: 20px; height: 20px;
  border-radius: 50%;
  border: 2px solid #D5C5B5;
  background: transparent;
  box-shadow: none;
  color: transparent;
}

/* 缩略图 — C2 合并R1-R3，正方形，尺寸=1/6屏宽，无任何图框 */
.wl-img {
  grid-column: 2 !important; grid-row: 1 / 4 !important;
  width: 100% !important; aspect-ratio: 1 / 1 !important;
  object-fit: cover !important; border-radius: var(--radius-sm) !important;
  cursor: pointer !important; background: transparent !important;
  align-self: center !important; justify-self: start !important;
  border: none !important; box-shadow: none !important;
  margin: 0 !important; padding: 0 !important;
  outline: none !important;
  transform: scale(1.2) translateX(-1em); transform-origin: left center;
  transition: opacity 0.15s;
}
.wl-img:active { opacity: 0.7; }

/* 商品名称 — C3-C4 R1，左对齐，上下居中 */
.wl-name {
  grid-column: 3 / 5; grid-row: 1;
  align-self: center; justify-self: start;
  margin: 0; padding: 0;
  border: none; background: transparent; box-shadow: none;
  font-size: 0.858em; font-weight: 600; color: var(--text);
  line-height: 1; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}

/* 删除 — C6 R1，左对齐，上下居中 */
.wl-del {
  grid-column: 6; grid-row: 1;
  align-self: center; justify-self: start;
  margin: 0; padding: 2px 8px;
  border: none; background: transparent; box-shadow: none;
  font-size: 0.65em; color: var(--text-light);
  cursor: pointer; white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  border-radius: var(--radius-sm); transition: all 0.15s;
}
.wl-del:active {
  background: rgba(0,0,0,0.04); color: #C0392B;
}

/* 商品描述 — C3-C5 R2，左对齐，上下居中 */
.wl-desc {
  grid-column: 3 / 6; grid-row: 2;
  align-self: center; justify-self: start;
  margin: 0; padding: 0;
  border: none; background: transparent; box-shadow: none;
  font-size: 0.68em; color: var(--text-secondary);
  line-height: 1; white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
  max-width: 15em;
}

/* 单价 — C3 R3 */
.wl-unit-price {
  grid-column: 3; grid-row: 3;
  align-self: center; justify-self: start;
  margin: 0; padding: 0;
  border: none; background: transparent; box-shadow: none;
  font-size: 0.68em; color: var(--product-price-color);
  line-height: 1;
}
.wl-unit-price.wl-price-inquiry {
  grid-column: 3 / 7;
  color: var(--text-light); font-weight: 500;
  font-size: 0.78em;
}

/* 步进器 — C4-C5 R3，居中，纯文字无装饰 */
.wl-stepper {
  grid-column: 4 / 6; grid-row: 3;
  align-self: center; justify-self: center;
  display: flex; align-items: center; gap: 0.3em;
  margin: 0; padding: 0;
  border: none; background: transparent; box-shadow: none;
}
.wl-step-btn {
  font-size: 1.275em; font-weight: 700; color: var(--primary-light);
  cursor: pointer; user-select: none;
  -webkit-tap-highlight-color: transparent;
  line-height: 1; padding: 2px 4px;
  border-radius: 4px; transition: background 0.15s;
}
.wl-step-btn:active {
  background: rgba(184,122,90,0.08);
}
.wl-step-val {
  font-size: 0.85em; font-weight: 700; color: var(--text);
  user-select: none; line-height: 1;
}

/* 小计 — C6 R3，右对齐，上下居中 */
.wl-sub {
  grid-column: 6; grid-row: 3;
  align-self: center; justify-self: end;
  margin: 0; padding: 0;
  border: none; background: transparent; box-shadow: none;
  font-size: 0.68em; color: var(--product-price-color);
  line-height: 1; white-space: nowrap; text-align: right;
}

/* 激活态 — 淡暖色背景 */
.wl-card--active {
  background: rgba(184,122,90,0.05);
  border-radius: var(--radius-xs);
  margin: 0; padding: 0;
}

/* 激活态中的勾选框 */
.wl-card--active .wl-chk {
  background: var(--primary-light); color: #fff;
}

/* --- 页面底部留白（给固定栏腾空间） --- */
.wl-bottom-spacer { height: 140px; }

/* --- 底部固定操作栏 --- */
.wl-bottom-bar {
  position: fixed; bottom: var(--tab-height); left: 0; right: 0; z-index: 99;
  background: rgba(255,255,255,0.95);
  backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  display: flex; gap: 10px; padding: 0.65em 1em;
  padding-bottom: calc(10px + env(safe-area-inset-bottom, 0));
  box-shadow: 0 -2px 16px rgba(92,64,51,0.06);
  border-top: 1px solid var(--border);
}
.wl-bar-btn {
  flex: 1; text-align: center; padding: 0.8em 0;
  border-radius: var(--btn-radius); font-size: 0.95em; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: all 0.2s ease;
  display: flex; align-items: center; justify-content: center;
}
.wl-bar-btn:active { transform: scale(0.97); opacity: 0.85; }
/* 两行按钮 */
.wl-bar-btn--dual {
  flex-direction: column; padding: 8px 4px;
  line-height: 1.3;
}
.wl-bar-line1 { font-size: 12px; font-weight: 500; opacity: 0.85; }
.wl-bar-line2 { font-size: 15px; font-weight: 600; }
.wl-bar-btn--disabled .wl-bar-line1,
.wl-bar-btn--disabled .wl-bar-line2 { opacity: 0.5; }
.wl-bar-btn--shop {
  background: var(--bg); color: var(--text-secondary);
  border: 1px solid var(--border);
}
.wl-bar-btn--submit {
  background: var(--primary-light); color: #FFFFFF;
  box-shadow: 0 3px 10px rgba(184,122,90,0.30);
}
.wl-bar-btn--history {
  background: #E8E0D8; color: var(--text);
  border: 1px solid var(--border);
}
.wl-bar-btn--disabled {
  background: #D5C5B5; color: #FFFFFF; box-shadow: none;
  pointer-events: none; opacity: 0.5;
}

/* 底部栏双行布局 */
.wl-bottom-bar { flex-direction: column; gap: 6px; }
.wl-bar-row { display: flex; gap: 10px; width: 100%; }
.wl-bar-row--contact { gap: 10px; }
.wl-bar-btn--contact {
  background: var(--bg); color: var(--primary);
  font-size: 0.82em; padding: 0.6em 0; border-radius: var(--btn-radius);
  border: 1px solid var(--border); flex: 1;
  transition: all 0.15s;
}
.wl-bar-btn--contact:active {
  background: rgba(184,122,90,0.06); transform: scale(0.98);
}
.wl-bar-btn--back {
  background: transparent; color: var(--text-light);
  font-size: 0.82em; padding: 0.6em 0; border-radius: var(--btn-radius);
  border: 1px solid var(--border); flex: 0.8;
  transition: all 0.15s;
}
.wl-bar-btn--back:active {
  background: rgba(0,0,0,0.03);
}

/* 已提交商品卡片 */
.wl-card--submitted {
  opacity: 0.65; background: var(--bg-page, #FAFAFA);
}
.wl-chk--submitted {
  cursor: default; background: #E8E0D8; color: var(--text-light);
  border-color: var(--border);
}
.wl-submitted-tag {
  font-size: 11px; padding: 2px 8px; border-radius: 10px;
  background: #E8E0D8; color: var(--text); font-weight: 500;
  white-space: nowrap;
}
.wl-img--ghost {
  width: 72px; height: 72px; border-radius: 8px;
  overflow: hidden; background: var(--bg-card, rgba(0,0,0,0.03));
}

/* 流程详情页清单角标 */
.detail-wish-badge {
  display: inline-block; font-size: 10px; padding: 1px 7px;
  border-radius: 8px; background: #C8E6C9; color: #2E7D32;
  margin-left: 6px; vertical-align: middle; font-weight: 500;
}

/* --- 预约咨询表单弹窗 --- */
.wl-submit-mask {
  position: fixed; inset: 0; z-index: 320;
  background: rgba(0,0,0,0.45);
  display: flex; align-items: flex-end; justify-content: center;
  animation: fadeIn 0.2s ease;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.wl-submit-panel {
  width: 100%; max-width: 480px; max-height: 85vh;
  background: #FFFFFF; border-radius: 16px 16px 0 0;
  overflow-y: auto; display: flex; flex-direction: column;
  animation: slideUp 0.3s ease;
}
.wl-submit-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; background: #fff; z-index: 1;
  border-radius: 16px 16px 0 0;
}
.wl-submit-title { font-size: 17px; font-weight: 700; color: var(--text); }
.wl-submit-close {
  width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
  font-size: 18px; color: var(--text-light); border-radius: 50%;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.wl-submit-close:active { background: var(--bg); }

.wl-submit-body { padding: 16px 20px; flex: 1; }

/* --- 表单内商品摘要 --- */
.wl-sf-summary {
  background: #FAF7F4; border-radius: var(--radius-sm);
  padding: 12px 14px; margin-bottom: 16px;
}
.wl-sf-summary-tit { font-size: 13px; font-weight: 600; color: var(--text); margin-bottom: 8px; }

/* 商品行：缩略图+名称+单价+数量+小计 */
.wl-sf-row {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; border-bottom: 1px dashed var(--border);
  font-size: 12px; color: var(--text-secondary);
}
.wl-sf-row:last-child { border-bottom: none; }
.wl-sf-row-img {
  width: 36px; height: 36px; border-radius: 4px;
  object-fit: cover; flex-shrink: 0; background: transparent;
}
.wl-sf-row-name {
  flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  color: var(--text); font-size: 13px;
}
.wl-sf-row-price { color: var(--text-light); font-size: 12px; white-space: nowrap; }
.wl-sf-row-qty { color: var(--text-light); font-size: 12px; white-space: nowrap; min-width: 40px; text-align: center; }
.wl-sf-row-sub { color: var(--product-price-color); font-weight: 500; font-size: 12px; white-space: nowrap; min-width: 56px; text-align: right; }

.wl-sf-more { font-size: 12px; color: var(--text-light); margin-top: 4px; }
.wl-sf-total {
  font-size: 13px; font-weight: 500; color: var(--product-price-color);
  text-align: right; margin-top: 8px; padding-top: 8px;
  border-top: 1px solid var(--border);
}

/* --- 表单字段：行内布局 --- */
.wl-form-group { margin-bottom: 10px; }
.wl-form-group--inline {
  display: flex; align-items: center; gap: 8px;
}
.wl-form-label {
  font-size: 14px; font-weight: 600; color: var(--text);
  white-space: nowrap; min-width: 70px; text-align: right;
}
.wl-form-label--req::after { content: '*'; color: #E07070; margin-left: 2px; }
.wl-form-input, .wl-form-textarea {
  flex: 1; padding: 10px 12px; font-size: 15px; color: var(--text);
  border: 1px solid var(--border); border-radius: 8px;
  background: var(--bg); outline: none; transition: border-color 0.15s;
}
.wl-form-input:focus, .wl-form-textarea:focus {
  border-color: var(--primary-light);
}
.wl-form-textarea { resize: vertical; min-height: 72px; }
.wl-form-err {
  display: block; font-size: 12px; color: #E07070;
  margin-top: 2px; margin-left: 78px;
}
.wl-form-input, .wl-form-textarea {
  width: 100%; padding: 12px 14px; font-size: 15px; color: var(--text);
  background: #FAF7F4; border: 1px solid var(--border);
  border-radius: var(--radius-sm); outline: none;
  font-family: inherit; box-sizing: border-box;
  -webkit-appearance: none; transition: border-color 0.2s;
}
.wl-form-input:focus, .wl-form-textarea:focus {
  border-color: var(--primary-light);
}
.wl-form-textarea { resize: vertical; min-height: 72px; }
.wl-form-input--date { -webkit-appearance: none; }
.wl-form-err {
  display: block; font-size: 12px; color: #E07070;
  margin-top: 4px; min-height: 18px;
}

/* --- 表单底部按钮 --- */
.wl-submit-actions {
  display: flex; gap: 10px; padding: 12px 20px 20px;
  border-top: 1px solid var(--border);
}
.wl-submit-btn {
  flex: 1; text-align: center; padding: 13px 0;
  border-radius: 24px; font-size: 15px; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
}
.wl-submit-btn:active { transform: scale(0.97); opacity: 0.85; }
.wl-submit-btn--cancel {
  background: var(--bg); color: var(--text-secondary);
  border: 1px solid var(--border);
}
.wl-submit-btn--confirm {
  background: var(--primary-light); color: #FFFFFF;
  box-shadow: 0 2px 8px rgba(184,122,90,0.35);
}

/* --- 已预约历史 --- */
.wl-history-section {
  margin: 8px 12px 0;
}
.wl-history-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 10px 0;
}
.wl-history-hdr-title { font-size: 15px; font-weight: 700; color: var(--primary); }
.wl-history-hdr-count { font-size: 12px; color: var(--text-light); }
.wl-history-card {
  background: var(--card); border-radius: var(--radius-sm);
  margin-bottom: 10px; overflow: hidden;
  box-shadow: 0 1px 4px rgba(92,64,51,0.03);
}
.wl-history-card-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 14px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.wl-history-card-head:active { background: #FAF7F4; }
.wl-history-card-left { display: flex; flex-direction: column; gap: 2px; }
.wl-history-order-no { font-size: 14px; font-weight: 600; color: var(--primary-light); }
.wl-history-order-time { font-size: 11px; color: var(--text-light); }
.wl-history-card-right { display: flex; align-items: center; gap: 8px; }
.wl-history-prod-count { font-size: 12px; color: var(--text-secondary); }
.wl-history-arrow {
  font-size: 14px; color: var(--text-light); transition: transform 0.3s;
}
.wl-history-arrow--up { transform: rotate(180deg); }
.wl-history-card-body {
  padding: 0 14px 14px; border-top: 1px solid var(--border);
  animation: fadeIn 0.2s ease;
}
.wl-history-info {
  display: flex; gap: 8px; padding: 8px 0;
  font-size: 13px;
}
.wl-history-label {
  color: var(--text-light); flex-shrink: 0; min-width: 32px;
}
.wl-history-val { color: var(--text); flex: 1; word-break: break-all; }
.wl-history-prods {
  margin-top: 8px; border-top: 1px dashed var(--border); padding-top: 8px;
}
.wl-history-prod {
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0; font-size: 12px;
}
.wl-history-prod-img {
  width: 36px; height: 36px; border-radius: 6px; object-fit: cover;
  background: var(--bg); flex-shrink: 0;
}
.wl-history-prod-name {
  flex: 1; color: var(--text); white-space: nowrap;
  overflow: hidden; text-overflow: ellipsis;
}
.wl-history-prod-qty { color: var(--text-light); flex-shrink: 0; }

/* --- 订单明细内商品meta --- */
.wl-history-prod-meta { color: var(--text-secondary); font-size: 12px; flex-shrink: 0; }

/* --- 订单合计 --- */
.wl-history-total { text-align: right; padding: 8px 0 4px; font-size: 14px; color: var(--text); border-top: 1px dashed var(--border); margin-top: 6px; }

/* --- 联系信息行 --- */
.wl-history-info-row {
  display: flex; justify-content: space-between; align-items: center;
  padding: 5px 0; font-size: 13px;
}
.wl-history-info-row span:first-child { color: var(--text-light); flex-shrink: 0; }
.wl-history-info-row span:last-child { color: var(--text); text-align: right; word-break: break-all; }

/* --- 状态徽章（历史订单Tab用） --- */
.wl-status-badge {
  font-size: 11px; padding: 2px 8px; border-radius: 10px;
  font-weight: 500; white-space: nowrap;
}
.wl-status--pending { background: rgba(255,167,38,0.12); color: #E69500; }
.wl-status--completed { background: rgba(76,175,80,0.12); color: #388E3C; }

/* --- 订单详情成功横幅 --- */
.wl-history-banner {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; margin: 0 -4px 8px;
  background: linear-gradient(135deg, #E8F5E9, #F1F8E9);
  border-radius: 10px; border: 1px solid rgba(76,175,80,0.2);
}
.wl-history-banner-icon {
  width: 36px; height: 36px; border-radius: 50%;
  background: linear-gradient(135deg, #4CAF50, #388E3C);
  color: #FFF; display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 700; flex-shrink: 0;
}
.wl-history-banner-title { font-size: 14px; font-weight: 600; color: #2E7D32; }
.wl-history-banner-sub { font-size: 11px; color: #558B2F; margin-top: 2px; }

/* --- 订单编号元信息区 --- */
.wl-history-order-meta {
  padding: 8px 0; margin-bottom: 4px;
  border-bottom: 1px dashed var(--border);
}
.wl-history-meta-row {
  display: flex; align-items: center; gap: 6px;
  padding: 4px 0; font-size: 12px;
}
.wl-history-meta-label { color: var(--text-light); flex-shrink: 0; min-width: 52px; }
.wl-history-meta-value { color: var(--text); word-break: break-all; }

/* --- 订单详情分区 --- */
.wl-history-section { padding: 6px 0; }
.wl-history-section-title {
  font-size: 13px; font-weight: 600; color: var(--text);
  padding: 6px 0 4px;
}
.wl-history-items { padding: 4px 0; }

/* --- 订单商品行（带图片） --- */
.wl-history-item {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 0; border-bottom: 1px solid rgba(0,0,0,0.04);
}
.wl-history-item:last-child { border-bottom: none; }
.wl-history-item-img {
  width: 44px; height: 44px; border-radius: 8px;
  object-fit: cover; background: var(--bg); flex-shrink: 0;
}
.wl-history-item-info { flex: 1; min-width: 0; }
.wl-history-item-name {
  font-size: 13px; color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.wl-history-item-meta { font-size: 11px; color: var(--text-secondary); margin-top: 2px; }
.wl-history-item-meta span { margin-right: 6px; }
.wl-history-item-price {
  font-size: 13px; font-weight: 600; color: var(--primary-light);
  flex-shrink: 0;
}

/* --- 价格汇总提示 --- */
.wl-history-total-hint {
  display: block; font-size: 11px; font-weight: 400; color: var(--text-light);
}

/* --- 退出按钮 --- */
.wl-history-reconsult-btn--back {
  color: #666; background: rgba(0,0,0,0.04); border: 1px solid rgba(0,0,0,0.08);
  flex: 0.7;
}

/* --- 重新咨询按钮（历史订单展开底部） --- */
.wl-history-reconsult-btn {
  flex: 1; text-align: center; padding: 9px 0; border-radius: 20px;
  font-size: 13px; font-weight: 600; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  color: var(--primary-light); background: rgba(184,122,90,0.08);
  border: 1px solid var(--border); transition: all 0.15s;
  user-select: none;
}
.wl-history-reconsult-btn:active { background: rgba(184,122,90,0.16); }

/* --- 催办按钮（列表层） --- */
.wl-history-urge-btn {
  padding: 2px 10px;
  border-radius: 10px;
  font-size: 11px; font-weight: 600;
  color: #D2691E; background: #FFF3E0;
  border: 1px solid #FFE0B2;
  cursor: pointer; white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
  user-select: none;
}
.wl-history-urge-btn:active {
  background: #FFE0B2; color: #BF360C;
}

/* ============================================
   全屏订单详情面板（对标京东/淘宝）
   ============================================ */
/* --- 遮罩层 --- */
.wl-order-detail-mask {
  position: fixed; inset: 0; z-index: 999;
  background: rgba(0,0,0,0.5);
  display: flex; justify-content: center; align-items: flex-end;
  animation: wlMaskIn 0.2s ease;
}

/* --- 面板主体（全屏高度） --- */
.wl-order-detail-panel {
  width: 100%; max-width: 480px; max-height: 92vh;
  background: var(--bg-card, #FFFFFF);
  border-radius: 16px 16px 0 0;
  display: flex; flex-direction: column;
  overflow: hidden;
  animation: wlSlideUp 0.25s ease;
}

/* --- 顶部导航栏 --- */
.wl-order-detail-header {
  display: flex; align-items: center;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border);
  background: var(--bg-card, #FFFFFF);
  flex-shrink: 0;
}
.wl-order-detail-back {
  display: flex; align-items: center; gap: 4px;
  font-size: 15px; color: var(--primary-light, #B87A5A);
  cursor: pointer; font-weight: 500;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.wl-order-detail-back:active { opacity: 0.7; }
.wl-order-detail-back-icon { font-size: 18px; }
.wl-order-detail-title {
  flex: 1; text-align: center; font-size: 16px;
  font-weight: 600; color: var(--text);
  margin-right: 52px; /* 和返回按钮等宽保持居中 */
}

/* --- 可滚动内容区 --- */
.wl-order-detail-body {
  flex: 1; overflow-y: auto;
  padding: 16px;
  -webkit-overflow-scrolling: touch;
}

/* --- 底部固定功能栏 --- */
.wl-order-detail-footer {
  display: flex; gap: 10px;
  padding: 12px 16px;
  padding-bottom: max(12px, env(safe-area-inset-bottom));
  border-top: 1px solid var(--border);
  background: var(--bg-card, #FFFFFF);
  flex-shrink: 0;
}
.wl-order-detail-footer-btn {
  flex: 1; text-align: center;
  padding: 10px 0; border-radius: 22px;
  font-size: 14px; font-weight: 600;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  transition: all 0.15s;
  color: var(--primary-light, #B87A5A);
  background: rgba(184,122,90,0.08);
  border: 1px solid var(--border);
}
.wl-order-detail-footer-btn:active {
  filter: brightness(0.88); transform: scale(0.97);
}
.wl-order-detail-footer-btn--wx {
  color: #07C160;
  background: rgba(7,193,96,0.08);
  border-color: rgba(7,193,96,0.2);
}
.wl-order-detail-footer-btn--back {
  flex: 0.7;
  color: #666;
  background: rgba(0,0,0,0.04);
  border-color: rgba(0,0,0,0.08);
}

/* --- 催办区域（待处理订单内容区） --- */
.wl-history-urge-area {
  padding: 16px 0 4px;
  text-align: center;
  border-top: 1px solid var(--border);
  margin-top: 8px;
}
.wl-history-urge-btn-popup {
  display: inline-block;
  padding: 10px 36px;
  border-radius: 22px;
  font-size: 14px; font-weight: 600;
  cursor: pointer;
  border: none;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
  transition: all 0.15s;
  color: #FFF;
  background: linear-gradient(135deg, #FF9800, #F57C00);
  box-shadow: 0 2px 8px rgba(255,152,0,0.3);
}
.wl-history-urge-btn-popup:active {
  filter: brightness(0.9); transform: scale(0.97);
}
.wl-history-urge-hint {
  font-size: 12px; color: var(--text-light);
  margin-top: 8px;
}

/* --- 动画 --- */
@keyframes wlMaskIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes wlSlideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}

/* --- 联系操作区（展开详情底部 - 保留兼容） --- */
.wl-history-card-footer {
  display: flex; gap: 10px;
  padding: 10px 14px 14px;
  border-top: 1px solid var(--border);
}
.wl-history-contact-btn {
  flex: 1; text-align: center;
  padding: 10px 0; border-radius: 20px;
  font-size: 13px; font-weight: 600;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
  user-select: none;
}
.wl-history-contact-btn--phone {
  color: #FFF; background: var(--primary);
  box-shadow: 0 2px 6px rgba(61,46,39,0.2);
}
.wl-history-contact-btn--phone:active {
  background: #2E221D;
}
.wl-history-contact-btn--wechat {
  color: var(--primary-light); background: #F5F0EB;
  border: 1px solid var(--border);
}
.wl-history-contact-btn--wechat:active {
  background: #E8DED5;
}

/* --- 微信二维码弹窗 --- */
.wl-qr-panel {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 300px; max-width: 90vw;
  background: var(--card); border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  animation: fadeIn 0.25s ease;
}
.wl-qr-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 18px 12px;
  font-size: 16px; font-weight: 600; color: var(--text);
}
.wl-qr-close {
  font-size: 20px; color: var(--text-light);
  cursor: pointer; padding: 0 4px;
  -webkit-tap-highlight-color: transparent;
}
.wl-qr-body {
  text-align: center; padding: 0 18px 20px;
}
.wl-qr-img {
  width: 200px; height: 200px; display: block;
  margin: 0 auto 12px; border-radius: 8px;
  border: 1px solid var(--border);
}
.wl-qr-tip {
  font-size: 12px; color: var(--text-light);
  margin: 0 0 12px;
}
.wl-qr-orderno {
  font-size: 13px; color: var(--primary-light); font-weight: 600;
  margin: 8px 0 0; padding: 4px 12px;
  background: rgba(184,122,90,0.06); border-radius: 6px;
  display: inline-block;
}
.wl-qr-copy-btn {
  display: inline-block; padding: 8px 24px;
  border-radius: var(--btn-radius); font-size: 12px;
  color: var(--primary-light); background: #F5F0EB;
  border: 1px solid var(--border);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.wl-qr-copy-btn:active {
  background: #E8DED5;
}
.wl-qr-fallback {
  padding: 32px 0; font-size: 15px; color: var(--text);
}

/* --- 咨询渠道选择弹窗 --- */
.wl-channel-panel {
  position: absolute; top: 50%; left: 50%;
  transform: translate(-50%, -50%);
  width: 300px; max-width: 85vw;
  background: var(--card); border-radius: var(--radius);
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0,0,0,0.18);
  animation: fadeIn 0.25s ease;
}
.wl-channel-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 18px 20px 14px;
}
.wl-channel-title {
  font-size: 16px; font-weight: 700; color: var(--text);
}
.wl-channel-close {
  font-size: 20px; color: var(--text-light);
  cursor: pointer; padding: 0 4px;
  -webkit-tap-highlight-color: transparent;
}
.wl-channel-body {
  padding: 0 20px 24px; text-align: center;
}
.wl-channel-order-hint {
  font-size: 14px; color: var(--primary-light); font-weight: 600;
  margin-bottom: 20px; padding: 8px 16px;
  background: rgba(184,122,90,0.06); border-radius: 8px;
  display: inline-block;
}
.wl-channel-actions {
  display: flex; gap: 12px;
}
.wl-channel-btn {
  flex: 1; display: flex; flex-direction: column;
  align-items: center; gap: 8px;
  padding: 18px 0; border-radius: var(--radius-sm);
  cursor: pointer; transition: all 0.2s;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
.wl-channel-btn--phone {
  background: var(--primary); color: #FFF;
  box-shadow: 0 2px 8px rgba(92,64,51,0.25);
}
.wl-channel-btn--phone:active {
  background: #3D2E27; transform: scale(0.96);
}
.wl-channel-btn--wechat {
  background: #F0F7F0; color: #3D5E3D;
  border: 1px solid #C5D5C5;
}
.wl-channel-btn--wechat:active {
  background: #E0EFE0; transform: scale(0.96);
}
.wl-channel-btn-icon {
  font-size: 28px; line-height: 1;
}
.wl-channel-btn-text {
  font-size: 14px; font-weight: 600;
}

/* --- 再次咨询按钮（历史卡片中） --- */
.wl-history-reconsult-btn {
  padding: 3px 10px; border-radius: 12px;
  font-size: 11px; font-weight: 600;
  color: var(--primary-light); background: rgba(184,122,90,0.08);
  border: var(--border-width) solid var(--border-color-btn);
  cursor: pointer; white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
  user-select: none;
}
.wl-history-reconsult-btn:active {
  background: rgba(184,122,90,0.16);
}

/* --- 再次咨询按钮（表格中） --- */
.wl-table-reconsult {
  padding: 0.3em 0.8em; border-radius: 0.9em;
  font-size: 12px; font-weight: 600;
  color: var(--primary-light); background: rgba(184,122,90,0.08);
  border: var(--border-width) solid var(--border-color-btn);
  cursor: pointer; white-space: nowrap;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.15s;
  user-select: none;
  display: inline-block;
}
.wl-table-reconsult:active {
  background: rgba(184,122,90,0.16);
}
.wl-table-cell--action { text-align: center; }

/* --- 历史记录表格 --- */
.wl-table-wrap {
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  margin: 0 -4px;
}
.wl-table {
  width: 100%; border-collapse: collapse; font-size: 13px;
  min-width: 480px;
}
.wl-table-head { background: #F5F0EB; }
.wl-table-th {
  padding: 10px 8px; text-align: left; font-weight: 600;
  color: var(--text); white-space: nowrap;
  border-bottom: 1px solid var(--border);
}
.wl-table-row { border-bottom: 1px solid var(--border); }
.wl-table-row:last-child { border-bottom: none; }
.wl-table-cell {
  padding: 10px 8px; color: var(--text);
  white-space: nowrap; vertical-align: top;
}
.wl-table-cell--no { color: var(--primary-light); font-weight: 500; font-size: 12px; }
.wl-table-cell--remark {
  white-space: normal; max-width: 160px; font-size: 12px;
  color: var(--text-secondary); word-break: break-all;
}

@keyframes popIn {
  0% { transform: scale(0.92); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* === 统一返回/关闭按钮（全站规范）===
   图标下方标注文字，弹窗用「关闭」、页面用「返回」
   ================================================================ */
.uni-back-btn {
  display: inline-flex; flex-direction: column; align-items: center; justify-content: center;
  cursor: pointer; padding: 8px 12px; border-radius: 10px; line-height: 1.2;
  -webkit-tap-highlight-color: transparent; user-select: none;
  min-width: 48px; min-height: 48px; transition: background 0.15s, box-shadow 0.15s;
  background: rgba(92,64,51,0.04); /* 醒目：弱底衬增加可见性 */
  border: 1px solid transparent;
}
.uni-back-btn:active { background: rgba(92,64,51,0.12); box-shadow: 0 0 0 3px rgba(92,64,51,0.08); }
.uni-back-btn-icon {
  font-size: 28px; line-height: 1; color: var(--primary);
  display: block; margin-bottom: 1px; pointer-events: none;
}
.uni-back-btn-label {
  font-size: 12px; color: var(--primary); font-weight: 600;
  white-space: nowrap; pointer-events: none;
}

/* --- 联系商家弹窗 --- */
.contact-modal {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 310;
  background: rgba(0,0,0,0.4); display: flex; align-items: flex-end;
  animation: fadeIn 0.25s ease;
  overflow: hidden;
  padding-bottom: env(safe-area-inset-bottom, 0);
}
.contact-modal-content {
  width: 100%; background: var(--card); border-radius: 16px 16px 0 0;
  max-height: 85vh; overflow-y: auto;
  animation: slideUp 0.3s ease;
}
.contact-modal-hdr {
  display: flex; align-items: center; justify-content: space-between;
  padding: 16px 20px; border-bottom: 1px solid var(--border);
  position: sticky; top: 0; background: var(--card); z-index: 1;
  border-radius: 16px 16px 0 0;
}
.contact-modal-title { font-size: 17px; font-weight: 700; color: var(--text); }
.contact-modal-close {
  width: 28px; height: 28px; display: flex; align-items: center; justify-content: center;
  font-size: 16px; color: var(--text-light); border-radius: 50%;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
}
.contact-modal-close:active { background: var(--bg); }
.contact-modal-body { padding: 16px 20px 10px; }
.contact-modal-shop {
  font-size: 15px; font-weight: 700; color: var(--primary); margin-bottom: 12px;
  padding: 10px 14px; background: var(--bg); border-radius: var(--radius-sm);
  text-align: center;
}
.contact-modal-success {
  display: flex; align-items: center; gap: 10px;
  padding: 12px 14px; margin-bottom: 14px;
  background: #F0F7F0; border-radius: var(--radius-sm);
  font-size: 13px; color: #3D5E3D; line-height: 1.5;
}
.contact-modal-check {
  width: 24px; height: 24px; border-radius: 50%;
  background: var(--accent); color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 14px; flex-shrink: 0;
}
.contact-item {
  padding: 14px; margin-bottom: 10px;
  border-radius: var(--radius-sm); background: var(--bg);
}
.contact-item-label { font-size: 14px; font-weight: 600; color: var(--text); margin-bottom: 6px; }
.contact-item-val {
  font-size: 16px; font-weight: 700; color: var(--primary-light);
  margin-bottom: 4px; word-break: break-all;
}
.contact-item-hint { font-size: 12px; color: var(--text-light); }
.contact-item-wx .contact-item-val {
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  user-select: all; -webkit-user-select: all;
}
.contact-item-phone {
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  border: 2px solid var(--accent); background: rgba(143,168,143,0.04);
}
.contact-item-phone:active { background: rgba(143,168,143,0.1); }
.contact-item-text {
  font-size: 13px; color: var(--text-secondary); line-height: 1.8;
  white-space: pre-wrap; margin: 0; background: var(--card);
  padding: 12px; border-radius: 6px; border: 1px solid var(--border);
  font-family: inherit;
}
.contact-modal-footer {
  padding: 12px 20px 20px; text-align: center;
  font-size: 12px; color: var(--text-light); line-height: 1.7;
}
.contact-modal-footer span { display: block; }

/* === Product Modal (统一查看/编辑/新增弹窗) v3 === */
@keyframes slideUp {
  from { transform: translateY(100%); }
  to { transform: translateY(0); }
}
.product-modal {
  position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 300;
  background: rgba(0,0,0,0.4); display: flex; align-items: stretch;
  animation: fadeIn 0.25s ease;
}
.product-modal-content {
  background: #FFFFFF; border-radius: 0;
  width: 100%; height: 100%; max-height: 100%; overflow-y: auto;
  padding: 0;
  animation: slideUp 0.3s ease;
  -webkit-overflow-scrolling: touch;
}

/* ---- 顶部栏：关闭 + 编辑 ---- */
.pm-top-bar {
  position: sticky; top: 0; z-index: 5;
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px; background: #FFFFFF;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
}
.pm-close-btn {
  font-size: 14px; color: var(--text-secondary); cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}
.pm-close-btn:active { color: var(--primary); }
.pm-edit-btn {
  font-size: 14px; color: var(--primary-light); font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  padding: 4px 12px; border-radius: 12px; background: rgba(184,122,90,0.08);
}
.pm-edit-btn:active { opacity: 0.7; }
.pm-save-btn { color: var(--primary); background: rgba(92,64,51,0.06); }

/* ---- 第一层：1:1 正方形图片 ---- */
.pm-img-wrap {
  width: 100%;
  position: relative;
  padding-top: 100%; /* 1:1 正方形 */
  background: #FAF7F4;
  overflow: hidden;
}
.pm-img {
  position: absolute; top: 0; left: 0;
  width: 100%; height: 100%;
  object-fit: cover;
}
.pm-img-edit-wrap { background: #F5F0EB; }
.pm-upload-hint {
  position: absolute; bottom: 0; left: 0; right: 0;
  padding: 8px 12px; text-align: center;
  background: linear-gradient(to top, rgba(92,64,51,0.7) 0%, transparent 100%);
  color: #fff; font-size: 12px;
}

/* ---- 第二层：文字信息区 ---- */
.pm-info { padding: 16px 16px 8px; }
.pm-cat { font-size: 12px; color: var(--text-light); margin-bottom: 4px; }
.pm-name { font-size: 12px; font-weight: 700; color: var(--product-price-color); margin-bottom: 12px; }
.pm-price-row {
  display: flex; align-items: center; justify-content: space-between;
  gap: 12px; margin-bottom: 4px; flex-wrap: wrap;
}
.pm-price-block { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.pm-price { font-size: 12px; font-weight: 500; color: var(--product-name-color); line-height: 1; }
.pm-price-note { font-size: 12px; color: var(--product-desc-color); font-weight: 400; }
.pm-price-inquiry {
  font-size: 15px; color: var(--product-aux-color); font-weight: 500;
  padding: 4px 0;
}
.pm-subtotal {
  font-size: 14px; font-weight: 600; color: var(--primary);
  margin-top: 4px; width: 100%;
}
.pm-desc {
  font-size: 13px; color: var(--product-desc-color); line-height: 1.6;
  padding: 0; margin: 12px 0 0;
}

/* ---- 数量步进器 ---- */
.pm-qty-area {
  display: flex; align-items: center; gap: 12px; flex-shrink: 0;
}
.pm-stepper {
  display: flex; align-items: center; gap: 0;
  border: 1px solid var(--border); border-radius: 8px;
  overflow: hidden;
}
.pm-step-btn {
  width: 46px; height: 36px; display: flex; align-items: center; justify-content: center;
  font-size: 18px; font-weight: 600; color: var(--primary);
  cursor: pointer; user-select: none;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.15s, opacity 0.15s;
}
.pm-step-btn:active { background: var(--bg); }
.pm-step-btn.pm-step-disabled {
  color: var(--text-light); opacity: 0.4; pointer-events: none;
}
.pm-step-val {
  width: 56px; text-align: center; font-size: 16px; font-weight: 600;
  color: var(--text); border-left: 1px solid var(--border);
  border-right: 1px solid var(--border);
  line-height: 36px; user-select: none;
}

/* ---- 底部操作按钮栏 ---- */
.pm-actions {
  display: flex; flex-direction: column; gap: 10px;
  padding: 12px 16px calc(24px + env(safe-area-inset-bottom, 0));
}
.pm-actions-row {
  display: flex; gap: 10px; width: 100%;
}
.pm-actions-row .pm-btn-add,
.pm-actions-row .pm-consult-group { flex: 1; }
.pm-btn {
  text-align: center; padding: 12px 0;
  border-radius: 24px; font-size: 15px; font-weight: 600;
  cursor: pointer; -webkit-tap-highlight-color: transparent;
  transition: opacity 0.2s;
  display: flex; align-items: center; justify-content: center;
}
.pm-btn:active { opacity: 0.8; }
.pm-btn-add { background: var(--primary); color: #fff; flex: 1; }
.pm-consult-group { display: flex; gap: 12px; flex: 1; }
.pm-btn-consult {
  background: transparent; color: var(--primary);
  border: 1px solid var(--primary); flex: 1;
  font-size: 15px; font-weight: 600;
  border-radius: var(--btn-radius); padding: 13px 0;
}
.pm-btn-consult--phone {
  background: var(--primary); color: #fff;
  border: none; box-shadow: 0 4px 10px rgba(92,64,51,0.3);
}
.pm-btn-consult--phone:active {
  filter: brightness(0.85); transform: scale(0.96);
}
.pm-btn--back {
  background: transparent; color: var(--text-light);
  border: 1px solid rgba(0,0,0,0.1); flex: 1;
  font-size: 15px; font-weight: 600;
  border-radius: var(--btn-radius); padding: 13px 0;
}
.pm-btn--back:active { background: rgba(0,0,0,0.04); }
.pm-btn-cancel-edit {
  background: var(--border); color: var(--text-secondary); flex: 1;
}
.pm-edit-actions { gap: 10px; }
.pm-edit-actions .pm-btn-add { flex: 2; }

/* ---- FAQ 折叠区 ---- */
.pm-faq-section {
  margin: 8px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  overflow: hidden;
}
.pm-faq-header {
  display: flex; align-items: center; gap: 6px;
  padding: 12px 14px; cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  user-select: none; background: #FAF7F4;
}
.pm-faq-icon { font-size: 14px; }
.pm-faq-header > span:nth-child(2) {
  font-size: 14px; font-weight: 600; color: var(--primary); flex: 1;
}
.pm-faq-arrow {
  font-size: 16px; color: var(--text-light);
  transition: transform 0.3s ease;
}
.pm-faq-section.pm-faq-open .pm-faq-arrow { transform: rotate(90deg); }
.pm-faq-body {
  max-height: 0; overflow: hidden;
  transition: max-height 0.3s ease-out;
}
.pm-faq-section.pm-faq-open .pm-faq-body { max-height: 500px; }
.pm-faq-item { padding: 8px 14px; border-top: 1px solid var(--border); }
.pm-faq-item:first-child { border-top: none; }
.pm-faq-q { font-size: 13px; font-weight: 600; color: var(--primary-light); margin-bottom: 4px; }
.pm-faq-a { font-size: 12px; color: var(--text-secondary); line-height: 1.7; }

/* ---- 编辑/新增面板表单 ---- */
.pm-edit-content { max-height: 90vh; }
.pm-edit-info { padding: 16px; }
.pm-edit-row { margin-bottom: 16px; }
.pm-edit-label {
  display: block; font-size: 14px; font-weight: 600; color: var(--text);
  margin-bottom: 6px;
}
.pm-edit-input {
  width: 100%; padding: 12px 14px; font-size: 15px; color: var(--text);
  background: #FAF7F4; border: 1px solid var(--border);
  border-radius: var(--radius-sm); outline: none;
  font-family: inherit; box-sizing: border-box;
  -webkit-appearance: none; transition: border-color 0.2s;
}
.pm-edit-input:focus { border-color: var(--primary-light); }
.pm-edit-textarea {
  width: 100%; padding: 12px 14px; font-size: 15px; color: var(--text);
  background: #FAF7F4; border: 1px solid var(--border);
  border-radius: var(--radius-sm); outline: none;
  font-family: inherit; box-sizing: border-box;
  resize: vertical; min-height: 72px;
}
.pm-edit-textarea:focus { border-color: var(--primary-light); }
.pm-edit-select {
  width: 100%; padding: 10px 12px; font-size: 14px; color: var(--text);
  background: #FAF7F4; border: 1px solid var(--border);
  border-radius: var(--radius-sm); outline: none;
  -webkit-appearance: none; box-sizing: border-box;
}
.pm-cat-selects { display: flex; gap: 8px; }
.pm-cat-selects .pm-edit-select { flex: 1; }
.pm-cat-display {
  flex: 1;
  padding: 10px 12px;
  font-size: 14px;
  color: var(--text);
  background: #FAF7F4;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  min-height: 40px;
  display: flex;
  align-items: center;
}
.pm-price-inputs { display: flex; gap: 8px; align-items: flex-end; }
.pm-price-field { flex: 1; display: flex; flex-direction: column; gap: 4px; }
.pm-price-field-ratio { flex: 0 0 80px; }
.pm-price-field-label { font-size: 12px; color: #8C7D73; line-height: 1; }
.pm-cost-input { width: 100%; }
.pm-ratio-input { width: 100%; }
.pm-price-input { width: 100%; }
.pm-price-readonly { background: #F5F2EE; color: #8C7D73; }
.pm-note-input { width: 100%; }

/* ---- 状态开关行 ---- */
.pm-status-row { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
.pm-status-switches { display: flex; gap: 12px; flex-wrap: wrap; }
.pm-switch-item { display: flex; align-items: center; gap: 6px; }
.pm-switch-label { font-size: 13px; color: var(--text-secondary); }
.pm-switch-toggle {
  width: 42px; height: 24px; border-radius: 12px;
  background: #E0D5C8; position: relative; cursor: pointer;
  transition: background 0.25s; flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.pm-switch-toggle.pm-switch-on { background: var(--accent); }
.pm-switch-knob {
  position: absolute; top: 2px; left: 2px;
  width: 20px; height: 20px; border-radius: 50%;
  background: #fff; transition: left 0.25s;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.pm-switch-toggle.pm-switch-on .pm-switch-knob { left: 20px; }

/* === Compliance Footer === */
.compliance-area {
  text-align: center; padding: 20px 16px;
  margin-top: 12px;
}
.compliance-line {
  display: block; font-size: 11px; color: var(--text-light);
  line-height: 1.8;
}

/* === Toast === */
.toast {
  position: fixed; top: 80px; left: 50%; transform: translateX(-50%);
  z-index: 500; background: rgba(92,64,51,0.9); color: #fff;
  font-size: 13px; padding: 10px 24px; border-radius: 20px;
  animation: toastIn 0.3s ease, toastOut 0.3s ease 1.7s forwards;
  pointer-events: none;
}
@keyframes toastIn { from { opacity: 0; transform: translateX(-50%) translateY(-10px); } }
@keyframes toastOut { to { opacity: 0; transform: translateX(-50%) translateY(-10px); } }

/* === Loading Skeleton === */
.skeleton {
  background: linear-gradient(90deg, #F0E8E0 25%, #E8DED4 50%, #F0E8E0 75%);
  background-size: 200% 100%;
  animation: shimmer 1.5s infinite;
  border-radius: var(--radius-sm);
}
@keyframes shimmer {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* === No Results === */
.no-results {
  text-align: center; padding: 40px 20px; color: var(--text-light);
}
.no-results-icon { font-size: 36px; margin-bottom: 8px; }
.no-results-text { font-size: 14px; color: var(--text-secondary); }
.no-results-sub { font-size: 12px; color: var(--text-light); margin-top: 4px; }

/* priceNote 显示样式（"建议自备"/"建议租赁"等非数字价格） */
.product-item-price .price-inquiry {
  font-size: 12px; font-weight: 400; color: var(--text-secondary);
}

/* === 微信二维码弹窗 === */
.qr-modal-mask {
  position: fixed; inset: 0; z-index: 350;
  background: rgba(0,0,0,0.55);
  display: flex; align-items: center; justify-content: center;
  padding: 20px;
  animation: fadeIn 0.2s ease;
}
.qr-modal-panel {
  background: #FFFFFF; border-radius: 16px;
  padding: 28px 24px 22px; width: 280px; text-align: center;
  position: relative;
  box-shadow: 0 8px 32px rgba(0,0,0,0.2);
  animation: popIn 0.25s ease;
}
.qr-modal-close {
  position: absolute; top: 12px; right: 16px;
  width: 32px; height: 32px;
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: #999; cursor: pointer;
  background: none; border: none; border-radius: 50%;
  -webkit-tap-highlight-color: transparent;
}
.qr-modal-close:active { background: #f0f0f0; }
.qr-modal-qr-img {
  width: 200px; height: 200px; margin: 0 auto 8px;
  border: 1px solid #eee; border-radius: 8px;
  object-fit: contain;
}
.qr-modal-tip { font-size: 12px; color: #999; margin-bottom: 2px; }
.qr-modal-id { font-size: 15px; color: var(--primary); font-weight: 600; }

/* === Unified Order Template（四端通用统一订单版式） === */
.order-template {
  background: var(--card);
  border-radius: 12px;
  overflow: hidden;
}
.order-template--compact {
  border-radius: 0;
}

/* 订单头部 */
.ot-header {
  padding: 14px 16px 10px;
  border-bottom: 1px solid var(--border);
}
.ot-header-top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 4px;
}
.ot-order-no {
  font-size: 18px;
  font-weight: 700;
  color: var(--primary);
  letter-spacing: 0.5px;
}
.ot-status-tag {
  padding: 3px 10px;
  border-radius: 20px;
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}
.ot-create-time {
  font-size: 12px;
  color: var(--text-light);
}

/* 通用区块 */
.ot-section {
  padding: 12px 16px;
  border-bottom: 1px solid var(--border);
}
.ot-section:last-child {
  border-bottom: none;
}
.ot-section-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--primary-light);
  margin-bottom: 8px;
  padding-left: 8px;
  border-left: 3px solid var(--primary-light);
}

/* 客户信息区 */
.ot-customer-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 6px 16px;
}
.ot-info-item {
  display: flex;
  gap: 6px;
  font-size: 13px;
  align-items: baseline;
}
.ot-info-full {
  grid-column: 1 / -1;
}
.ot-label {
  color: var(--text-light);
  flex-shrink: 0;
  min-width: 32px;
}
.ot-value {
  color: var(--text);
  flex: 1;
  word-break: break-all;
}

/* 商品清单区 */
.ot-items-list {
  border: 1px solid var(--border);
  border-radius: 8px;
  overflow: hidden;
}
.ot-item-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border-bottom: 1px solid var(--border);
}
.ot-item-row:last-child {
  border-bottom: none;
}
.ot-item-img {
  width: 44px;
  height: 44px;
  border-radius: 0;
  overflow: hidden;
  flex-shrink: 0;
  background: transparent;
  position: relative;
}
.ot-item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.ot-item-noimg {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: var(--text-light);
}
.ot-item-info {
  flex: 1;
  min-width: 0;
}
.ot-item-name {
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.ot-item-meta {
  display: flex;
  gap: 8px;
  margin-top: 2px;
  font-size: 12px;
  color: var(--text-light);
}
.ot-item-price {
  color: var(--product-price-color);
}
.ot-item-sub {
  font-size: 14px;
  font-weight: 600;
  color: var(--product-price-color);
  flex-shrink: 0;
}

/* 订单合计行 */
.ot-total-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 14px 16px;
  border-top: 2px solid var(--primary);
  margin-top: 0;
  background: var(--bg);
}
.ot-total-label {
  font-size: 15px;
  font-weight: 600;
  color: var(--primary);
}
.ot-total-value {
  font-size: 20px;
  font-weight: 700;
  color: var(--product-price-color);
}
.ot-total-inquiry {
  font-size: 14px;
  color: var(--text-light);
  font-weight: 500;
}

/* B端附加区（门店信息） */
.ot-store-extra {
  padding: 16px;
  text-align: center;
  border-top: 1px solid var(--border);
  background: var(--bg);
}
.ot-store-name {
  font-size: 16px;
  font-weight: 700;
  color: var(--primary);
  margin-bottom: 6px;
}
.ot-store-info {
  font-size: 12px;
  color: var(--text-light);
  line-height: 1.8;
}
.ot-operator {
  font-size: 12px;
  color: var(--text-secondary);
  margin-top: 4px;
}
.ot-time-line {
  font-size: 12px;
  color: var(--text-light);
}
.ot-cancel-reason {
  font-size: 12px;
  color: #CF1322;
}
.ot-tips {
  font-size: 12px;
  color: var(--primary-light);
  margin-top: 10px;
  padding: 8px 12px;
  background: #FFF7E6;
  border-radius: 6px;
  line-height: 1.6;
}
.ot-slogan {
  font-size: 13px;
  color: var(--primary);
  font-weight: 600;
  margin-top: 8px;
  letter-spacing: 2px;
}

/* C端历史展开中的订单模板（紧凑模式） */
.order-template--compact .ot-header {
  padding: 10px 0 8px;
  border-bottom: 1px dashed var(--border);
}
.order-template--compact .ot-section {
  padding: 10px 0;
  border-bottom: 1px dashed var(--border);
}
.order-template--compact .ot-total-row {
  padding: 10px 0;
  background: transparent;
  border-top: 1px solid var(--border);
}

/* C端历史状态标签 */
.wl-history-status {
  padding: 2px 8px;
  border-radius: 12px;
  font-size: 11px;
  font-weight: 600;
  white-space: nowrap;
}

/* === 快捷备注标签 === */
.wl-remark-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}
.wl-remark-tag {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 5px 12px;
  border-radius: 16px;
  font-size: 12px;
  color: var(--text-secondary);
  background: var(--bg);
  border: 1px solid var(--border);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: all 0.2s;
  user-select: none;
}
.wl-remark-tag:active {
  opacity: 0.7;
}
.wl-remark-tag--active {
  background: var(--accent-light);
  color: var(--accent);
  border-color: var(--accent);
}
.wl-remark-tag--budget {
  cursor: default;
}
.wl-budget-input {
  width: 50px;
  padding: 2px 4px;
  border: 1px solid var(--border);
  border-radius: 4px;
  font-size: 12px;
  text-align: center;
  background: var(--card);
}

/* B端订单详情弹窗主体 */
.order-detail-body {
  max-height: 60vh;
  overflow-y: auto;
  padding: 0 20px;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}
@keyframes popIn {
  0% { transform: scale(0.92); opacity: 0; }
  100% { transform: scale(1); opacity: 1; }
}

/* ================================================================
   视觉层级统一体系（C端浅色主题）
   ─ 按钮统一：var(--primary-light) 暖棕色 = 可操作控件
   ─ 一级标题：var(--primary) 深棕 = 最强视觉
   ─ 二级标题：var(--text-secondary) 灰 = 中弱
   ─ 正文内容：var(--text) 褐 = 标准
   ─ 辅助提示：var(--text-light) 浅灰褐 = 最弱
   ─ 按压反馈：亮度微调 + scale(0.97)
   ─ 禁用状态：opacity 0.45 + 灰度
   ================================================================ */

/* ═══ 原则一：全部可点击控件统一视觉色彩 ═══ */
/* 三按钮操作栏统一 */
.action-btn-nav { background: rgba(184,122,90,0.1); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
.action-btn-call { background: var(--primary-light); color: #fff; box-shadow: 0 4px 10px rgba(184,122,90,0.25); }
.action-btn-wechat { background: rgba(184,122,90,0.06); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
/* 联系按钮统一 */
.pm-btn-consult { background: transparent; color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
.pm-btn-consult--phone { background: var(--primary); color: #fff; border: none; box-shadow: 0 4px 10px rgba(92,64,51,0.3); }
.pm-btn-consult--phone:active { filter: brightness(0.85); transform: scale(0.96); }
.detail-contact-btn { background: rgba(184,122,90,0.06); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); box-shadow: none; }
/* 渠道选择统一 */
.wl-channel-btn--wechat { background: rgba(184,122,90,0.06); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
.wl-history-contact-btn--wechat { background: rgba(184,122,90,0.06); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
/* 次要操作统一 */
.wl-bar-btn--history { background: rgba(184,122,90,0.06); color: var(--primary-light); border: var(--border-width) solid var(--border-color-btn); }
/* 详情页选中绿色→主色 */
.detail-product-price { color: var(--primary-light); }
.detail-product-check.checked { border-color: var(--primary-light); background: var(--primary-light); }
.detail-checkbar-toggle { border: var(--border-width) solid var(--border-color-btn); color: var(--primary-light); }
/* 步进器统一 */
.pm-step-btn { color: var(--primary-light); }
.detail-step-num { background: var(--primary-light); }
/* 确保按钮按压反馈 */
.action-btn-nav:active,
.action-btn-call:active,
.action-btn-wechat:active,
.wl-bar-btn--submit:active,
.wl-submit-btn--confirm:active,
.wl-empty-btn:active,
.pm-btn-add:active,
.detail-addbar-btn:active,
.detail-nav-edit:active,
.pe-nav-btn-save:active,
.pe-confirm-ok:active,
.wl-channel-btn--phone:active,
.wl-channel-btn--wechat:active,
.wl-history-contact-btn--phone:active,
.wl-history-contact-btn--wechat:active {
  filter: brightness(0.85) !important;
  transform: scale(0.96) !important;
}
/* 次要/描边按钮 */
.pm-btn-consult,
.detail-contact-btn,
.pe-nav-btn-discard,
.pe-confirm-cancel,
.pm-btn-cancel-edit,
.wl-bar-btn--shop,
.wl-bar-btn--history,
.wl-submit-btn--cancel,
.wl-history-reconsult-btn,
.wl-table-reconsult,
.wl-qr-copy-btn,
.pm-edit-btn,
.pe-add-btn,
.detail-checkbar-toggle {
  transition: transform 0.15s, filter 0.15s, background 0.15s, border-color 0.15s !important;
}
.pm-btn-consult:active,
.detail-contact-btn:active,
.pe-nav-btn-discard:active,
.pe-confirm-cancel:active,
.pm-btn-cancel-edit:active,
.wl-bar-btn--shop:active,
.wl-bar-btn--history:active,
.wl-submit-btn--cancel:active,
.wl-history-reconsult-btn:active,
.wl-table-reconsult:active,
.wl-qr-copy-btn:active,
.pm-edit-btn:active {
  filter: brightness(0.88) !important;
  transform: scale(0.97) !important;
}
.pe-add-btn:active { border-color: var(--primary); color: var(--primary); transform: scale(0.97); }

/* 禁用/不可操作 */
.wl-bar-btn--disabled,
.wl-bar-btn--disabled:active {
  filter: grayscale(0.5) !important; opacity: 0.45 !important; pointer-events: none !important; transform: none !important;
}
.pm-step-btn.pm-step-disabled {
  color: var(--text-light); opacity: 0.35; pointer-events: none;
}

/* 通用按钮按压 */
.btn:active, button:active { filter: brightness(0.85); }
.btn:disabled, button:disabled { opacity: 0.45; filter: grayscale(0.3); cursor: not-allowed; }

/* ═══ 原则二：文字层级功能权重递减 ═══ */
/* 一级标题 → 最强视觉，深棕，跟按钮拉开色阶 */
.collapsible-title, .detail-core-title, .detail-step-title,
.process-name, .wl-history-hdr-title, .wl-select-label, .guide-step-title, .pe-step-title,
.pm-name, .wl-name, .product-item-name, .detail-product-name,
.section-title {
  font-weight: 600 !important; color: var(--primary) !important;
}
/* 二级标题 → 中等权重，灰色弱化 */
.collapsible-sub-title, .detail-core-sub, .process-name-sub,
.brand-tagline, .guide-step-num, .pm-cat, .wl-desc {
  font-weight: 400 !important; color: var(--text-secondary) !important;
}
/* 辅助提示 → 最弱层级 */
.guide-step-desc, .guide-step-arrow, .wl-history-arrow,
.wl-history-label, .wl-history-prod-qty, .wl-history-hdr-count,
.contact-arrow, .process-arrow, .wl-sf-more, .compliance-area,
.compliance-line, .no-results-icon, .no-results-text, .no-results-sub,
.pm-price-note, .banner-empty, .ot-label, .ot-create-time,
.ot-store-info, .ot-operator, .wl-history-order-time,
.contact-item-hint, .pe-char-hint, .wl-form-err,
.contact-modal-footer, .qr-modal-tip, .wl-history-prods,
.detail-notes, .detail-checkbar-tip {
  color: var(--text-light) !important;
}

/* ═══ 原则三：辅助文字/报错提示存在感最弱 ═══ */
.wl-form-err, .pe-char-hint, .contact-modal-footer,
.qr-modal-tip, .wl-sf-more {
  font-size: 11px !important; opacity: 0.85;
}
/* 报错保留可识别对比，但不抢主视觉 */
.wl-form-err { opacity: 0.9; }
.pe-input-error { border-color: #e8553e !important; background: rgba(232,85,62,0.03); }
.ot-cancel-reason { color: #CF1322; opacity: 0.75; }

/* ═══ 原则四：交互反馈（hover + active + disabled 统一） ═══ */
/* 全局可点击元素反馈 */
[onclick], .cursor-pointer, .tappable, .clickable,
.process-item, .guide-step, .product-item, .detail-product-card,
.wl-card, .cat-sidebar-item, .wl-history-card-head,
.collapsible-header, .pm-faq-header, .contact-item-phone,
.wl-history-urge-btn, .wl-history-reconsult-btn, .wl-table-reconsult,
.card-share-btn, .pm-edit-btn, .detail-checkbar-toggle {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: transform 0.15s, filter 0.15s, background 0.15s;
}
/* 卡片类按压缩放 */
.process-item:active, .guide-step:active, .product-item:active,
.detail-product-card:active, .wl-history-card-head:active {
  transform: scale(0.97); filter: brightness(0.95);
}
.cat-sidebar-item:active, .collapsible-header:active, .pm-faq-header:active {
  filter: brightness(0.92);
}

/* ═══ 原则五：仅框架元素，不动商品/流程素材 ═══ */
/* 已通过选择器作用域控制，不动：
   - .banner-slide img / .product-item-img / .brand-logo 等图片素材
   - .story-body / .detail-core-text 等业务富文本（仅调层级，不改色值）
   - 所有 background-image / object-fit 等图片属性 */
/* ═══ 以上 = 视觉层级统一体系（C端浅色主题） ═══ */

/* ═══ Logo悬浮动画 ═══ */
@keyframes logoFloat {
  0%, 100% { transform: translateY(0); }
  50%      { transform: translateY(-5px); }
}

/* === Utility === */
.hidden { display: none !important; }
.safe-bottom { padding-bottom: env(safe-area-inset-bottom, 0); }

/* ================================================================
   订单确认页 — 全屏页面（对标京东/淘宝订单成功页）
   ================================================================ */
.oc-page {
  padding: 0 14px 20px;
  animation: ocFadeIn 0.35s ease;
}
@keyframes ocFadeIn {
  from { opacity: 0; transform: translateY(12px); }
  to { opacity: 1; transform: translateY(0); }
}

/* 顶部成功标识 */
.oc-hero {
  text-align: center;
  padding: 36px 0 24px;
}
.oc-hero-icon {
  width: 64px; height: 64px;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: linear-gradient(135deg, #6bbf6b, #4caf50);
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 4px 20px rgba(76,175,80,0.3);
}
.oc-hero-title {
  font-size: 22px; font-weight: 700;
  color: var(--text, #E8E0D5);
  margin-bottom: 8px;
  letter-spacing: 1px;
}
.oc-hero-sub {
  font-size: 13px; color: var(--text-light, #706858);
  letter-spacing: 0.5px;
}

/* 通用卡片 */
.oc-card {
  background: var(--bg-card, rgba(255,255,255,0.04));
  border: var(--border-width, 1px) solid var(--border-color-container, rgba(255,255,255,0.06));
  border-radius: 14px;
  padding: 14px 16px;
  margin-bottom: 12px;
}
.oc-card-header {
  font-size: 14px; font-weight: 600;
  color: var(--text, #E8E0D5);
  margin-bottom: 10px;
  padding-bottom: 8px;
  border-bottom: 1px solid var(--border-color-container, rgba(255,255,255,0.06));
}
.oc-card-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 6px 0;
  font-size: 13px;
}
.oc-card-row + .oc-card-row {
  border-top: 1px solid var(--border-color-container, rgba(255,255,255,0.04));
  margin-top: 2px;
  padding-top: 8px;
}
.oc-label {
  color: var(--text-light, #706858);
  font-size: 12px; flex-shrink: 0;
}
.oc-value {
  color: var(--text, #E8E0D5);
  font-size: 13px; text-align: right;
  flex: 1; margin-left: 12px;
}
.oc-value--order-no {
  font-family: 'SF Mono', 'Menlo', monospace;
  font-size: 14px; font-weight: 600;
  color: var(--primary, #D4A853);
  letter-spacing: 0.5px;
}
.oc-copy-btn {
  font-size: 11px; padding: 3px 10px;
  border-radius: 12px;
  background: rgba(212,168,83,0.1);
  color: var(--primary, #D4A853);
  border: 1px solid rgba(212,168,83,0.2);
  cursor: pointer; flex-shrink: 0; margin-left: 8px;
  transition: all 0.2s;
}
.oc-copy-btn:active {
  background: rgba(212,168,83,0.2);
  transform: scale(0.95);
}

/* 状态徽章 */
.oc-status-badge {
  display: inline-block;
  font-size: 12px; font-weight: 600;
  padding: 3px 12px;
  border-radius: 12px;
}
.oc-status--pending {
  background: rgba(255,167,38,0.15);
  color: #FFA726;
}

/* 商品列表 */
.oc-items {
  display: flex; flex-direction: column;
}
.oc-item {
  display: flex; align-items: center; gap: 10px;
  padding: 10px 0;
  border-bottom: 1px solid var(--border-color-container, rgba(255,255,255,0.04));
}
.oc-item:last-child { border-bottom: none; }
.oc-item-img {
  width: 52px; height: 52px;
  border-radius: 8px;
  object-fit: cover; flex-shrink: 0;
  background: var(--bg-card, rgba(255,255,255,0.04));
}
.oc-item-info {
  flex: 1; min-width: 0;
}
.oc-item-name {
  font-size: 14px; color: var(--text, #E8E0D5);
  font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.oc-item-meta {
  font-size: 12px; color: var(--text-light, #706858);
  margin-top: 2px;
  display: flex; gap: 8px;
}
.oc-item-price {
  font-size: 14px; font-weight: 600;
  color: var(--primary, #D4A853);
  flex-shrink: 0; white-space: nowrap;
}

/* 价格汇总 */
.oc-price-summary {
  border-top: 1px solid var(--border-color-container, rgba(255,255,255,0.06));
  padding-top: 10px;
  margin-top: 8px;
}
.oc-price-row {
  display: flex; justify-content: space-between; align-items: center;
  font-size: 13px; color: var(--text-light, #706858);
  padding: 3px 0;
}
.oc-price-row--total {
  font-size: 16px; font-weight: 700;
  color: var(--text, #E8E0D5);
  padding-top: 6px;
}
.oc-price-total {
  color: var(--primary, #D4A853);
  font-size: 18px;
}
.oc-price-hint {
  font-size: 11px; color: var(--text-light, #706858);
  margin-top: 4px; text-align: right;
}

/* 联系信息网格 */
.oc-info-grid {
  display: flex; flex-wrap: wrap; gap: 8px 20px;
}
.oc-info-item {
  display: flex; flex-direction: column; gap: 2px;
  font-size: 12px;
}
.oc-info-item--full {
  width: 100%;
}

/* 温馨提示 */
.oc-card--tips {
  display: flex; gap: 10px; align-items: flex-start;
}
.oc-tips-icon {
  font-size: 20px; flex-shrink: 0; line-height: 1.3;
}
.oc-tips-text { flex: 1; }
.oc-tips-title {
  font-size: 13px; font-weight: 600; color: var(--text, #E8E0D5);
  margin-bottom: 4px;
}
.oc-tips-desc {
  font-size: 12px; color: var(--text-light, #706858);
  line-height: 1.7;
}

/* 操作按钮区 */
.oc-actions {
  margin-top: 16px;
}
.oc-actions-row {
  display: flex; gap: 12px; margin-bottom: 10px;
}
.oc-btn {
  flex: 1; text-align: center; padding: 13px 0;
  border-radius: var(--btn-radius);
  font-size: 15px; font-weight: 600;
  cursor: pointer;
  transition: all 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.oc-btn:active { transform: scale(0.96); }
.oc-btn--primary {
  background: linear-gradient(135deg, #D4A853, #B8860B);
  color: #0D0D1A;
  box-shadow: 0 4px 14px rgba(212,168,83,0.25);
}
.oc-btn--secondary {
  background: rgba(255,255,255,0.06);
  color: var(--text-light, #A09888);
  border: 1px solid var(--border-color-container, rgba(255,255,255,0.08));
}
.oc-btn--contact {
  background: rgba(212,168,83,0.06);
  color: var(--primary, #D4A853);
  border: 1px solid rgba(212,168,83,0.2);
  font-weight: 600;
}
.oc-btn--contact-phone {
  background: linear-gradient(135deg, #D4A853, #C8963A);
  color: #1A1815;
  border: none; font-weight: 600;
  box-shadow: 0 4px 12px rgba(212,168,83,0.3);
}
.oc-btn--contact-phone:active {
  filter: brightness(0.85); transform: scale(0.96);
}
.oc-btn--back {
  background: transparent; color: var(--text-light, #A09888);
  border: 1px solid rgba(0,0,0,0.08); font-weight: 600;
}
.oc-btn--back:active { background: rgba(0,0,0,0.04); }

/* 订单详情页顶部 */
.oc-detail-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 0 10px;
  margin-bottom: 8px;
}
.oc-back-btn {
  font-size: 14px; color: var(--primary, #D4A853);
  cursor: pointer; font-weight: 500;
  padding: 4px 0;
}
.oc-detail-title {
  font-size: 16px; font-weight: 700;
  color: var(--text, #E8E0D5);
}

/* ================================================================
   购物车底部栏（合计 + 按钮行）
   ================================================================ */
.wl-cart-bar {
  position: fixed; bottom: var(--tab-height, 56px);
  left: 0; right: 0; z-index: 99;
  background: var(--bg, #FFFFFF) !important;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  display: flex !important;
  flex-direction: column !important;
  padding: 10px 14px !important;
  gap: 8px !important;
  box-shadow: 0 -2px 12px rgba(0,0,0,0.06);
  border-top: 1px solid var(--border-color-container, rgba(0,0,0,0.06));
}
.wl-cart-bar-row--total {
  text-align: right;
  padding: 4px 0 12px 0;
}
.wl-cart-bar-row--action {
  display: flex; align-items: center;
  gap: 10px;
}
.wl-cart-bar-row--action .wl-cart-btn { flex: 1; }
.wl-cart-select-all {
  display: flex; align-items: center; gap: 6px;
  cursor: pointer; flex-shrink: 0;
}
.wl-cart-total {
  display: flex; align-items: baseline; gap: 2px;
  white-space: nowrap; overflow: hidden;
}
.wl-cart-total-label {
  font-size: 13px; color: var(--text, #333);
}
.wl-cart-total-price {
  font-size: 18px; font-weight: 700;
  color: var(--primary, #D4A853);
}
.wl-cart-bar-right {
  display: flex; gap: 8px; flex-shrink: 0;
}
.wl-cart-btn {
  padding: 10px 18px; border-radius: 22px;
  font-size: 14px; font-weight: 600;
  cursor: pointer; white-space: nowrap;
  transition: all 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.wl-cart-btn:active { transform: scale(0.96); }
.wl-cart-btn--checkout {
  background: linear-gradient(135deg, #D4A853, #B8860B);
  color: #FFFFFF;
  box-shadow: 0 3px 12px rgba(212,168,83,0.3);
}
.wl-cart-btn--history {
  background: rgba(0,0,0,0.04);
  color: var(--text-light, #706858);
  border: 1px solid var(--border-color-container, rgba(0,0,0,0.08));
}
/* 联系按钮（底部按钮行内，与提交咨询等宽） */
.wl-cart-btn--contact {
  text-align: center;
  padding: 10px 0; font-size: 13px; font-weight: 600;
  border-radius: 22px;
  color: var(--primary-light); background: transparent;
  border: 1px solid var(--border-color-btn, rgba(184,122,90,0.3));
}
.wl-cart-btn--contact:active { transform: scale(0.96); filter: brightness(0.92); }
.wl-cart-btn--contact-phone {
  background: var(--primary-light); color: #fff;
  border: none; box-shadow: 0 2px 8px rgba(184,122,90,0.2);
}
.wl-cart-btn--contact-phone:active { filter: brightness(0.85); }
.wl-cart-btn--disabled {
  background: #ccc !important;
  color: #999 !important;
  box-shadow: none !important;
  pointer-events: none;
  opacity: 0.6;
}

/* 联系商家常驻条（购物车底部栏下方） */
.wl-contact-strip {
  position: fixed; bottom: calc(var(--tab-height, 56px) + 60px);
  left: 0; right: 0; z-index: 98;
  display: flex; gap: 12px;
  padding: 8px 16px;
  background: var(--bg, #FFFFFF);
  border-top: 1px solid var(--border-color-container, rgba(0,0,0,0.04));
}
.wl-contact-strip-btn {
  flex: 1; text-align: center;
  padding: 11px 0; font-size: 14px; font-weight: 600;
  border-radius: 22px; cursor: pointer;
  color: var(--primary-light); background: transparent;
  border: 1px solid var(--border-color-btn, rgba(184,122,90,0.3));
  -webkit-tap-highlight-color: transparent;
  transition: all 0.2s ease;
}
.wl-contact-strip-btn:active {
  transform: scale(0.96);
  filter: brightness(0.92);
}
.wl-contact-strip-btn--phone {
  background: var(--primary-light); color: #fff;
  border: none;
  box-shadow: 0 4px 10px rgba(184,122,90,0.25);
}
.wl-contact-strip-btn--phone:active {
  filter: brightness(0.85);
}


/* ================================================================
   结算面板 (Checkout Panel)
   ================================================================ */
.wl-checkout-panel {
  border-radius: 16px 16px 0 0 !important;
}
.wl-co-section {
  margin-bottom: 16px;
}
.wl-co-section-title {
  font-size: 14px; font-weight: 600;
  color: var(--text, #333);
  margin-bottom: 8px;
  display: flex; align-items: center; gap: 8px;
}
.wl-co-section-title::after {
  content: '';
  flex: 1; height: 1px;
  background: var(--border-color-container, rgba(0,0,0,0.06));
}
.wl-co-items {
  background: var(--bg-card, rgba(0,0,0,0.02));
  border-radius: 10px; padding: 8px 12px;
}
.wl-co-item {
  display: flex; align-items: center; gap: 10px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--border-color-container, rgba(0,0,0,0.06));
}
.wl-co-item:last-child { border-bottom: none; }
.wl-co-item-img {
  width: 44px; height: 44px;
  border-radius: 6px; object-fit: cover;
  flex-shrink: 0;
  background: var(--bg-card, rgba(0,0,0,0.04));
}
.wl-co-item-info { flex: 1; min-width: 0; }
.wl-co-item-name {
  font-size: 13px; color: var(--text, #333);
  font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.wl-co-item-meta {
  font-size: 12px; color: var(--text-light, #706858);
  margin-top: 2px;
  display: flex; gap: 10px; align-items: center;
}
.wl-co-item-sub {
  color: var(--primary, #D4A853);
  font-weight: 600;
  margin-left: auto;
}
.wl-co-total {
  display: flex; justify-content: space-between; align-items: center;
  padding-top: 8px; margin-top: 6px;
  border-top: 1px solid var(--border-color-container, rgba(0,0,0,0.08));
  font-size: 15px; font-weight: 600;
  color: var(--text, #333);
}
.wl-co-total-price {
  font-size: 20px; font-weight: 700;
  color: var(--primary, #D4A853);
}

/* 结算面板底部按钮 */
.wl-checkout-actions {
  display: flex; gap: 10px; padding: 12px 16px 20px;
}
.wl-checkout-actions .wl-submit-btn--confirm {
  flex: 2;
}

/* ================================================================
   历史订单列表
   ================================================================ */
.wl-history-list {
  padding: 0;
}
.wl-history-card-item {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 16px;
  border-bottom: 1px solid var(--border-color-container, rgba(0,0,0,0.04));
  cursor: pointer;
  transition: background 0.15s;
}
.wl-history-card-item:active {
  background: rgba(0,0,0,0.03);
}
.wl-history-card-left {
  flex: 1; min-width: 0;
}
.wl-history-card-no {
  font-size: 14px; font-weight: 600;
  color: var(--primary, #D4A853);
  margin-bottom: 4px;
}
.wl-history-card-meta {
  font-size: 12px; color: var(--text-light, #706858);
}
.wl-history-card-right {
  display: flex; align-items: center; gap: 8px;
  flex-shrink: 0;
}
.wl-history-card-status {
  font-size: 12px; padding: 2px 10px;
  border-radius: 10px;
  background: rgba(255,167,38,0.1);
  color: #FFA726;
  font-weight: 500;
}
.wl-history-card-arrow {
  font-size: 18px; color: var(--text-light, #706858);
}

/* ================================================================
   页面底部留白（购物车双栏 + 联系条）
   ================================================================ */
.wl-page--has-items ~ .wl-cart-bar + .wl-contact-strip + .compliance-area {
  /* 不需要额外空间，留白由 wl-bottom-spacer 处理 */
}
/* 有清单内容时，底部留白需要同时容纳购物车栏 + 联系条 */
.wl-bottom-spacer { height: 160px; }

/* ================================================================
   清单分区标题
   ================================================================ */
.wl-section-divider {
  display: flex; align-items: center;
  padding: 16px 0 8px; margin: 0 0 4px;
}
.wl-section-divider-text {
  font-size: 12px; color: var(--text-light, #706858);
  font-weight: 500;
  padding-right: 10px;
}
.wl-section-divider::after {
  content: '';
  flex: 1; height: 1px;
  background: var(--border-color-container, rgba(0,0,0,0.06));
}



/* ================================================================
   暗色主题适配 — 订单确认页
   ================================================================ */
/* 暗色下覆盖 */
#starTheme ~ .oc-page .oc-hero-icon,
body .oc-page .oc-hero-icon {
  background: linear-gradient(135deg, #4caf50, #388e3c);
}
#starTheme ~ .oc-page .oc-hero-title,
body .oc-page .oc-hero-title {
  color: #E8E0D5;
}
#starTheme ~ .oc-page .oc-hero-sub,
body .oc-page .oc-hero-sub {
  color: #A09888;
}
/* 暗色卡片 */
body .oc-card {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.06);
}
body .oc-card-header {
  color: #E8E0D5;
  border-bottom-color: rgba(255,255,255,0.06);
}
body .oc-card-row {
  border-top-color: rgba(255,255,255,0.04);
}
body .oc-label { color: #706858; }
body .oc-value { color: #A09888; }
body .oc-value--order-no { color: #D4A853; }
body .oc-copy-btn {
  background: rgba(212,168,83,0.1);
  color: #D4A853;
  border-color: rgba(212,168,83,0.2);
}
body .oc-status--pending {
  background: rgba(255,167,38,0.12);
  color: #FFA726;
}
body .oc-item-name { color: #E8E0D5; }
body .oc-item-price { color: #D4A853; }
body .oc-item-meta { color: #706858; }
body .oc-item { border-bottom-color: rgba(255,255,255,0.04); }
body .oc-price-summary { border-top-color: rgba(255,255,255,0.06); }
body .oc-price-row { color: #A09888; }
body .oc-price-row--total { color: #E8E0D5; }
body .oc-price-total { color: #D4A853; }
body .oc-price-hint { color: #706858; }
body .oc-tips-title { color: #E8E0D5; }
body .oc-tips-desc { color: #A09888; }
body .oc-btn--primary {
  background: linear-gradient(135deg, #D4A853, #B8860B);
  color: #0D0D1A;
  box-shadow: 0 4px 14px rgba(212,168,83,0.3);
}
body .oc-btn--secondary {
  background: rgba(255,255,255,0.06);
  color: #A09888;
  border-color: rgba(255,255,255,0.08);
}
body .oc-btn--contact {
  background: rgba(212,168,83,0.08);
  color: #D4A853;
  border-color: var(--border-color-btn, rgba(212,168,83,0.2));
}
body .oc-btn--contact-phone {
  background: linear-gradient(135deg, #D4A853, #C8963A);
  color: #1A1815;
  border: none; box-shadow: 0 4px 12px rgba(212,168,83,0.35);
}
body .oc-btn--contact-phone:active {
  filter: brightness(0.82); transform: scale(0.96);
}
body .oc-btn--back { color: #706858; border-color: rgba(255,255,255,0.06); }
body .oc-back-btn { color: #D4A853; }
body .oc-detail-title { color: #E8E0D5; }

/* 暗色购物车栏 */
body .wl-cart-bar {
  background: rgba(13,13,26,0.92) !important;
  border-top-color: rgba(255,255,255,0.06);
  box-shadow: 0 -4px 16px rgba(0,0,0,0.4);
}
body .wl-cart-total-label { color: #A09888; }
body .wl-cart-total-price { color: #D4A853; }
body .wl-cart-btn--history {
  background: rgba(255,255,255,0.06);
  color: #A09888;
  border-color: rgba(255,255,255,0.08);
}
body .wl-cart-btn--checkout {
  background: linear-gradient(135deg, #D4A853, #B8860B);
  color: #0D0D1A;
}
/* 暗色购物车栏内联系按钮 */
body .wl-cart-btn--contact {
  color: #D4A853; background: transparent; border-color: rgba(212,168,83,0.25);
}
body .wl-cart-btn--contact:active { transform: scale(0.96); filter: brightness(0.92); }
body .wl-cart-btn--contact-phone {
  background: #D4A853; color: #1A1A1A; box-shadow: 0 2px 8px rgba(212,168,83,0.2);
}
body .wl-cart-btn--contact-phone:active { filter: brightness(0.85); }
body .wl-contact-strip {
  background: rgba(13,13,26,0.92);
  border-top-color: rgba(255,255,255,0.04);
}
body .wl-contact-strip-btn { color: #D4A853; background: transparent; border-color: rgba(212,168,83,0.3); }
body .wl-contact-strip-btn:active { transform: scale(0.96); filter: brightness(0.92); }
body .wl-contact-strip-btn--phone { background: #D4A853; color: #1A1A1A; box-shadow: 0 4px 10px rgba(212,168,83,0.25); }
body .wl-contact-strip-btn--phone:active { filter: brightness(0.85); }


/* 暗色结算面板 */
body .wl-co-section-title { color: #E8E0D5; }
body .wl-co-section-title::after { background: rgba(255,255,255,0.06); }
body .wl-co-items { background: rgba(255,255,255,0.04); }
body .wl-co-item { border-bottom-color: rgba(255,255,255,0.04); }
body .wl-co-item-name { color: #E8E0D5; }
body .wl-co-item-meta { color: #706858; }
body .wl-co-item-sub { color: #D4A853; }
body .wl-co-total { color: #E8E0D5; border-top-color: rgba(255,255,255,0.08); }
body .wl-co-total-price { color: #D4A853; }

/* 暗色历史列表 */
body .wl-history-card-item { border-bottom-color: rgba(255,255,255,0.04); }
body .wl-history-card-item:active { background: rgba(255,255,255,0.04); }
body .wl-history-card-no { color: #D4A853; }
body .wl-history-card-meta { color: #706858; }
body .wl-history-card-status { background: rgba(255,167,38,0.1); color: #FFA726; }
body .wl-history-card-arrow { color: #706858; }

/* 暗色Tab切换 */
body .wl-tabs { background: transparent; border: none; }
body .wl-tab-btn { color: #706858; background: rgba(255,255,255,0.04); border-color: rgba(255,255,255,0.08); }
body .wl-tab-btn.wl-tab-btn--active { color: #1A1A1A; background: #D4A853; border-color: #D4A853; box-shadow: 0 2px 10px rgba(212,168,83,0.25); }
body .wl-tab-btn.wl-tab-btn--active::after { display: none; }
body .wl-tab-btn:active { background: rgba(255,255,255,0.08); }


/* 暗色历史订单详情 */
body .wl-history-card-body { border-top-color: rgba(255,255,255,0.06); }
body .wl-history-prod-meta { color: #706858; }
body .wl-history-total { color: #E8E0D5; border-top-color: rgba(255,255,255,0.08); }
body .wl-history-info-row span:first-child { color: #706858; }
body .wl-history-info-row span:last-child { color: #E8E0D5; }
body .wl-history-reconsult-btn {
  color: #D4A853; background: rgba(212,168,83,0.08);
  border-color: rgba(212,168,83,0.15);
}
body .wl-history-reconsult-btn:active { background: rgba(212,168,83,0.16); }
body .wl-history-reconsult-btn--back {
  color: #888; background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
}

/* 暗色：订单详情横幅 */
body .wl-history-banner { background: linear-gradient(135deg, #1B3D1B, #1A2E1A); border-color: rgba(76,175,80,0.15); }
body .wl-history-banner-title { color: #81C784; }
body .wl-history-banner-sub { color: #66BB6A; }

/* 暗色：订单编号元信息 */
body .wl-history-order-meta { border-bottom-color: rgba(255,255,255,0.08); }
body .wl-history-meta-label { color: #706858; }
body .wl-history-meta-value { color: #C8BFB0; }
body .wl-history-section-title { color: #C8BFB0; }

/* 暗色：订单商品行 */
body .wl-history-item { border-bottom-color: rgba(255,255,255,0.04); }
body .wl-history-item-name { color: #E8E0D5; }
body .wl-history-item-meta { color: #706858; }
body .wl-history-item-price { color: #D4A853; }
body .wl-history-total-hint { color: #706858; }

body .wl-history-empty { color: #706858; }
body .wl-history-empty-title { color: #E8E0D5; }
body .wl-history-empty-sub { color: #706858; }

/* 暗色：全屏订单详情面板 */
body .wl-order-detail-mask { background: rgba(0,0,0,0.7); }
body .wl-order-detail-panel { background: #1E1B18; }
body .wl-order-detail-header { background: #1E1B18; border-bottom-color: rgba(255,255,255,0.06); }
body .wl-order-detail-back { color: #D4A853; }
body .wl-order-detail-title { color: #E8E0D5; }
body .wl-order-detail-body { color: #E8E0D5; }
body .wl-order-detail-footer { background: #1E1B18; border-top-color: rgba(255,255,255,0.06); }
body .wl-order-detail-footer-btn {
  color: #D4A853; background: rgba(212,168,83,0.08);
  border-color: rgba(212,168,83,0.15);
}
body .wl-order-detail-footer-btn--wx {
  color: #43E97B; background: rgba(67,233,123,0.08);
  border-color: rgba(67,233,123,0.15);
}
body .wl-order-detail-footer-btn--back {
  color: #888; background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.08);
}
body .wl-history-urge-area { border-top-color: rgba(255,255,255,0.06); }
body .wl-history-urge-btn-popup {
  background: linear-gradient(135deg, #E65100, #BF360C);
  box-shadow: 0 2px 8px rgba(230,81,0,0.3);
}
body .wl-history-urge-hint { color: #706858; }

/* 暗色分区标题 */
body .wl-section-divider-text { color: #706858; }
body .wl-section-divider::after { background: rgba(255,255,255,0.06); }

/* ================================================================
   Responsive
   ================================================================ */
@media (min-width: 768px) {
  .page-container { max-width: 600px; margin-left: auto; margin-right: auto; }
  .tab-bar { max-width: 600px; left: 50%; transform: translateX(-50%); }
  .nav-bar { max-width: 600px; left: 50%; transform: translateX(-50%); }
  .wl-bottom-bar, .wl-cart-bar { max-width: 600px; left: 50%; transform: translateX(-50%); }
  .wl-contact-strip { max-width: 600px; left: 50%; transform: translateX(-50%); }
  .detail-overlay { max-width: 600px; left: 50%; transform: translateX(-50%); }
  .product-modal-content { max-width: 600px; margin: 0 auto; }
  .pm-edit-content { max-width: 600px; margin: 0 auto; }
  .toast { left: 50%; }
}
