/* 乐之卡网店面主题：由客户网关在 HTML </head> 前注入（见 gateway/nginx.conf），不改 Dujiao 镜像。
   只覆盖 classic 模板的设计令牌 + 少量结构性修正；升级店铺版本后要复查下面的类名还能不能命中。 */

/* ---------- 设计令牌：浅色 ---------- */
html:root {
  --ui-bg-page: #f6f7f9;
  --ui-bg-elevated: #ffffff;
  --ui-bg-soft: #f3f4f7;
  --ui-bg-muted: #eceef2;
  --ui-bg-overlay: #ffffffd9;
  --ui-bg-overlay-strong: #fffffff0;
  --ui-text-primary: #111318;
  --ui-text-secondary: #3b3f4a;
  --ui-text-muted: #6b7080;
  --ui-text-on-accent: #ffffff;
  --ui-border: #0f172a14;
  --ui-border-strong: #0f172a29;
  --ui-accent: #4f46e5;
  --ui-accent-hover: #4338ca;
  --ui-accent-soft: #4f46e514;
  --ui-focus-ring: #4f46e533;
  --ui-success: #0f9f6e;
  --ui-success-soft: #0f9f6e14;
  --ui-warning: #b45309;
  --ui-warning-soft: #f59e0b1a;
  --ui-danger: #dc2626;
  --ui-danger-soft: #dc262614;
  --ui-info: #2563eb;
  --ui-info-soft: #2563eb12;
  --ui-price-primary: #111318;
  --ui-price-promotion: #e11d48;
  --ui-price-original: #8a8f9c;
  --ui-shadow-1: 0 1px 2px #1018280a, 0 1px 3px #1018280d;
  --ui-shadow-2: 0 4px 12px -2px #1018280f, 0 2px 4px -2px #1018280a;
  --ui-shadow-3: 0 16px 32px -12px #1018281f;
  --ui-shadow-soft: 0 1px 2px #1018280a;
  --ui-shadow-card: 0 1px 2px #1018280a, 0 1px 3px #1018280d;
  --lz-font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "PingFang SC", "HarmonyOS Sans SC", "Microsoft YaHei", "Segoe UI", sans-serif;
}

/* ---------- 设计令牌：深色（店铺自带深浅切换，跟随其 .dark） ---------- */
html:root.dark {
  --ui-bg-page: #0b0c10;
  --ui-bg-elevated: #131419;
  --ui-bg-soft: #1a1c22;
  --ui-bg-muted: #1f2128;
  --ui-bg-overlay: #131419d9;
  --ui-bg-overlay-strong: #131419f0;
  --ui-text-primary: #ececf1;
  --ui-text-secondary: #c3c6d0;
  --ui-text-muted: #8c909c;
  --ui-text-on-accent: #ffffff;
  --ui-border: #ffffff12;
  --ui-border-strong: #ffffff24;
  --ui-accent: #6366f1;
  --ui-accent-hover: #7477f4;
  --ui-accent-soft: #6366f124;
  --ui-focus-ring: #6366f14d;
  --ui-success: #34d399;
  --ui-success-soft: #34d3991f;
  --ui-warning: #fbbf24;
  --ui-warning-soft: #fbbf241a;
  --ui-danger: #f87171;
  --ui-danger-soft: #f871711f;
  --ui-info: #7dd3fc;
  --ui-info-soft: #7dd3fc1a;
  --ui-price-primary: #ececf1;
  --ui-price-promotion: #fb7185;
  --ui-price-original: #7d818d;
  --ui-shadow-1: 0 1px 2px #00000066;
  --ui-shadow-2: 0 8px 24px -8px #00000099;
  --ui-shadow-3: 0 20px 40px -16px #000000b3;
  --ui-shadow-soft: 0 1px 2px #00000066;
  --ui-shadow-card: 0 1px 2px #00000066;
}

/* ---------- 基础排版 ---------- */
html, body { font-family: var(--lz-font); -webkit-font-smoothing: antialiased; }
::selection { background: var(--ui-accent-soft); }

/* 价格不用等宽字体，改为常规字体 + 等宽数字 */
.theme-price-lg, .theme-price-sm, .lg\:sticky .font-mono {
  font-family: var(--lz-font);
  font-variant-numeric: tabular-nums;
}
.theme-price-lg { font-size: 2.25rem; font-weight: 700; letter-spacing: -.02em; }
.theme-price-sm { font-size: 1.0625rem; font-weight: 700; }

/* ---------- 顶部导航 ---------- */
nav.fixed { box-shadow: none; }
.theme-wordmark, .theme-wordmark:hover { border: 0; padding-inline: 0; gap: .5rem; background: transparent; box-shadow: none; }
.theme-wordmark::before {
  content: "乐";
  display: inline-grid; place-items: center;
  width: 1.75rem; height: 1.75rem; border-radius: .5rem;
  background: linear-gradient(135deg, #6366f1, #8b5cf6);
  color: #fff; font-size: .875rem; font-weight: 800; line-height: 1;
}
.theme-wordmark-text { font-size: 1.0625rem; font-weight: 700; }
nav.fixed a.h-8, nav.fixed button.h-8 { border-radius: .5rem; font-size: .8125rem; }

/* ---------- 通用组件 ---------- */
.rounded-md { border-radius: .625rem; }
.bg-primary { box-shadow: none; }
button.bg-primary:hover:not(:disabled), a.bg-primary:hover { background-color: var(--ui-accent-hover); }
input.border-input, textarea.border-input, select.border-input {
  background-color: var(--ui-bg-elevated);
  min-height: 2.5rem;
  transition: border-color .15s, box-shadow .15s;
}
input.border-input:focus-visible, textarea.border-input:focus-visible {
  border-color: var(--ui-accent);
  box-shadow: 0 0 0 3px var(--ui-focus-ring);
  --tw-ring-shadow: 0 0 #0000;
}
/* 徽标：去边框，做成柔和的小胶囊 */
.rounded-md.border.font-semibold.text-\[10px\],
.rounded-md.border.font-semibold.px-2\.5.py-0\.5 { border-color: transparent; border-radius: 999px; }

/* ---------- 首页 ---------- */
.home-page #featured { padding-top: 7rem; }
.home-page .theme-section-heading.text-3xl { font-size: 1.75rem; }
/* 没有公告时整块「最新动态」空板块不显示 */
.home-page section:has(> .container > .border-dashed),
.home-page hr.theme-section-divider:has(+ section > .container > .border-dashed) { display: none; }

/* ---------- 商品卡 ---------- */
.group.rounded-2xl.border.bg-card { box-shadow: var(--ui-shadow-card); }
.group.rounded-2xl.border.bg-card:hover { border-color: var(--ui-border-strong); box-shadow: var(--ui-shadow-2); transform: translateY(-2px); }
/* 原样式里 md:block 覆盖了两行截断，导致整段说明铺满卡片 */
@media (min-width: 48rem) {
  p.line-clamp-2.md\:block { display: -webkit-box; margin-bottom: 1rem; }
}
/* 卡片做减法：同一行只留「游客可购 / 人工交付」，库存、「价格」字样、箭头都不显示 */
.group .rounded-md.border.font-semibold.border-info\/30 { display: none !important; }
.group .border-t .text-xs.uppercase.tracking-wider { display: none !important; }
.group .border-t .flex.items-center.gap-2 > svg:last-child,
.group .border-t .flex.items-center.gap-2 > span.hidden.md\:flex { display: none !important; }
.group h3.font-bold { font-size: 1rem; font-weight: 600; letter-spacing: -.01em; }
.group p.line-clamp-2 { font-size: .8125rem; line-height: 1.6; }
.group .border-t.mt-auto { border-top-style: dashed; }
.group .theme-price-sm { color: var(--ui-accent); font-size: 1.125rem; }
.group button[aria-label="快速购买"] { border-radius: 999px; border-color: var(--ui-border); }
.group:hover button[aria-label="快速购买"] { background: var(--ui-accent); border-color: var(--ui-accent); color: #fff; }
/* 商品只有几个时也按 4 列排，不在右侧留一大块空白 */
@media (min-width: 80rem) { .grid.xl\:grid-cols-5 { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
/* 封面：完整显示上传图（不裁切），去掉压暗遮罩；浅色下用白底，和白底商品图融为一体 */
.group > .aspect-\[4\/3\] { aspect-ratio: 16 / 10; background: var(--ui-bg-soft); border-bottom: 1px solid var(--ui-border); }
html:root:not(.dark) .group > .aspect-\[4\/3\] { background: #fff; }
.group > .aspect-\[4\/3\] > .bg-black\/15 { display: none; }
.group > .aspect-\[4\/3\] > img { object-fit: contain; padding: .75rem; }
.group > .aspect-\[4\/3\] > img.group-hover\:scale-105 { transform: none; }
.group .text-xs.uppercase.tracking-wider.truncate { text-transform: none; letter-spacing: 0; }
.theme-price-sm { white-space: nowrap; }
/* 手机两列卡片很窄：不显示分类行，价格字号收小，避免「CNY」折到第二行 */
@media (max-width: 47.99rem) {
  .group .text-xs.uppercase.tracking-wider.truncate { display: none; }
  .group .theme-price-sm { font-size: .9375rem; }
}

/* ---------- 商品详情 ---------- */
.product-detail-page .shadow-2xl { box-shadow: var(--ui-shadow-card); }
.product-detail-page .rounded-3xl { border-radius: 1.25rem; }
.product-detail-page h1.font-black { font-size: clamp(1.625rem, 2.6vw, 2.25rem); font-weight: 700; letter-spacing: -.02em; }
.product-detail-page img.aspect-\[4\/3\] { object-fit: contain; background: #fff; box-shadow: none; }
.product-detail-page .bg-secondary.border-r { background: var(--ui-bg-soft); }
html:root:not(.dark) .product-detail-page .bg-secondary.border-r { background: #fff; }
html:root:not(.dark) .product-detail-page img.aspect-\[4\/3\] { border-color: var(--ui-border); }
.product-detail-page p.text-lg { font-size: .9375rem; line-height: 1.75; }
.product-detail-page .text-xs.uppercase.tracking-wider { text-transform: none; letter-spacing: 0; }
.product-detail-page h2.uppercase.tracking-widest { text-transform: none; letter-spacing: 0; font-weight: 600; font-size: .875rem; }
.product-detail-page h2.text-2xl { font-size: 1.25rem; padding-bottom: 1.25rem; margin-bottom: 1.5rem; }
.product-detail-page .prose { font-size: .9375rem; line-height: 1.8; }

/* ---------- 结算页（按其进度条识别） ---------- */
.container:has(> ol[aria-label]) h1.font-black { font-weight: 700; font-size: 1.75rem; letter-spacing: -.02em; }
.container:has(> ol[aria-label]) > ol[aria-label] { padding: .75rem 1rem; background: var(--ui-bg-elevated); }
/* 只有一个交付字段时占满整行，不再截断提示文字 */
.container:has(> ol[aria-label]) .md\:grid-cols-2 > .space-y-1\.5:only-child { grid-column: 1 / -1; }
/* 填写说明：去掉大块绿色，改为中性提示 */
.container:has(> ol[aria-label]) .border-success\/40.bg-success\/10 {
  border-color: var(--ui-border); background: var(--ui-bg-soft); color: var(--ui-text-secondary);
}
.container:has(> ol[aria-label]) .border-success\/40.bg-success\/10 p.font-semibold { color: var(--ui-text-primary); }
/* 必填提醒：柔和底色 */
[role="alert"].border-warning\/40 { background: var(--ui-warning-soft); border-color: transparent; }
.lg\:sticky .text-lg.font-bold.font-mono { color: var(--ui-accent); font-size: 1.375rem; }

/* ---------- 页脚 ---------- */
footer .bg-primary.rounded-lg { background: linear-gradient(135deg, #6366f1, #8b5cf6); }
footer > .container { padding-top: 3rem; padding-bottom: 2.5rem; }
footer .mb-16 { margin-bottom: 2.5rem; }
/* 底栏「隐私政策 / 服务条款」与「Telegram 交流群」原为两行右对齐，长短不一看着像缩进：电脑端并成一行 */
@media (min-width: 48rem) {
  footer .border-t.pt-8 > .flex-col.md\:items-end { flex-direction: row; align-items: center; column-gap: 1rem; }
}
