/* ============================================================
   T10-1 商城风格皮肤（顾客端 Mini App / index.html）
   ------------------------------------------------------------
   规则：
   1. 皮肤只覆盖「皮肤层 token」与少量选择器差异；
      绝不触碰 6 个 var(--tg-theme-*) 主题 token
      （bg/card/text/hint/btn/btn-text）—— Telegram 明暗永远优先。
   2. 可覆盖的根级 token：--price / --line / --shadow
      （index.html :root 声明保持逐字节不变，classic 零变化锚点）。
   3. 皮肤数与 id 必须与 db.SKINS、index.html 的 SKINS 数组三处一致。
   4. classic = 默认现状，仅声明同值作一致性锚点，无选择器规则。
   ============================================================ */

html[data-skin="classic"] {
  --price: #e5484d;
  --line: #ececf0;
  --shadow: 0 1px 3px rgba(31, 35, 41, .05);
  --sk-accent: var(--btn);
  --sk-accent-2: transparent;
  --sk-radius: 14px;
  --sk-hero: none;
  --sk-head: inherit;
}

/* ---------- sunny 明快暖阳（餐饮/生鲜，暖色食欲） ---------- */
html[data-skin="sunny"] {
  --price: #e8590c;
  --line: #f2e3d5;
  --shadow: 0 2px 8px rgba(232, 89, 12, .10);
  --sk-accent: #f76707;
  --sk-accent-2: #ffe8cc;
  --sk-radius: 16px;
  --sk-hero: linear-gradient(135deg, #fff7ed, #ffedd5);
  --sk-head: inherit;
}
html[data-skin="sunny"] .storehero { background: var(--sk-hero); border-radius: var(--sk-radius); }
html[data-skin="sunny"] .storehero .shopen { color: var(--sk-accent); background: var(--sk-accent-2); }
html[data-skin="sunny"] .storehero .shopen.off { color: #ff6b35; background: rgba(255, 107, 53, .12); }
html[data-skin="sunny"] .cats button.on::before { background: var(--sk-accent); }
html[data-skin="sunny"] .card { border-radius: var(--sk-radius); }
html[data-skin="sunny"] .card .tag.promo { border-color: var(--sk-accent-2); }
html[data-skin="sunny"] .notice { border-radius: var(--sk-radius); }
html[data-skin="sunny"] .storehero .shname { font-family: var(--sk-head); }

/* ---------- fresh 清新薄荷（零售/母婴/花植） ---------- */
html[data-skin="fresh"] {
  --price: #0d9488;
  --line: #d9f0ec;
  --shadow: 0 2px 8px rgba(13, 148, 136, .10);
  --sk-accent: #0ea5a4;
  --sk-accent-2: #d7f5f2;
  --sk-radius: 14px;
  --sk-hero: linear-gradient(135deg, #f0fdfa, #ccfbf1);
  --sk-head: inherit;
}
html[data-skin="fresh"] .storehero { background: var(--sk-hero); border-radius: var(--sk-radius); }
html[data-skin="fresh"] .storehero .shopen { color: var(--sk-accent); background: var(--sk-accent-2); }
html[data-skin="fresh"] .storehero .shopen.off { color: #ff6b35; background: rgba(255, 107, 53, .12); }
html[data-skin="fresh"] .cats button.on::before { background: var(--sk-accent); }
html[data-skin="fresh"] .card { border-radius: var(--sk-radius); }
html[data-skin="fresh"] .card .tag.promo { border-color: var(--sk-accent-2); }
html[data-skin="fresh"] .notice { border-radius: var(--sk-radius); }
html[data-skin="fresh"] .storehero .shname { font-family: var(--sk-head); }

/* ---------- vivid 活力亮彩（零食/潮玩/运动） ---------- */
html[data-skin="vivid"] {
  --price: #e11d48;
  --line: #fbe0e6;
  --shadow: 0 4px 12px rgba(225, 29, 72, .14);
  --sk-accent: #f0503c;
  --sk-accent-2: #ffe4e6;
  --sk-radius: 18px;
  --sk-hero: linear-gradient(135deg, #fff1f2, #ffe4e6);
  --sk-head: inherit;
}
html[data-skin="vivid"] .storehero { background: var(--sk-hero); border-radius: var(--sk-radius); }
html[data-skin="vivid"] .storehero .shopen { color: var(--sk-accent); background: var(--sk-accent-2); }
html[data-skin="vivid"] .storehero .shopen.off { color: #ff6b35; background: rgba(255, 107, 53, .12); }
html[data-skin="vivid"] .cats button.on::before { background: var(--sk-accent); }
html[data-skin="vivid"] .card { border-radius: var(--sk-radius); }
html[data-skin="vivid"] .card .tag.promo { border-color: var(--sk-accent-2); }
html[data-skin="vivid"] .notice { border-radius: var(--sk-radius); }
html[data-skin="vivid"] .storehero .shname { font-family: var(--sk-head); }

/* ---------- editorial 杂志雅致（珠宝/美妆/书店，衬线标题） ---------- */
html[data-skin="editorial"] {
  --price: #0f766e;
  --line: #e2e8f0;
  --shadow: 0 1px 2px rgba(15, 23, 42, .08);
  --sk-accent: #0f766e;
  --sk-accent-2: #e6fffb;
  --sk-radius: 8px;
  --sk-hero: linear-gradient(135deg, #f8fafc, #f1f5f9);
  --sk-head: Georgia, "Times New Roman", "Songti SC", serif;
}
html[data-skin="editorial"] .storehero { background: var(--sk-hero); border-radius: var(--sk-radius); }
html[data-skin="editorial"] .storehero .shopen { color: var(--sk-accent); background: var(--sk-accent-2); }
html[data-skin="editorial"] .storehero .shopen.off { color: #ff6b35; background: rgba(255, 107, 53, .12); }
html[data-skin="editorial"] .cats button.on::before { background: var(--sk-accent); }
html[data-skin="editorial"] .card { border-radius: var(--sk-radius); }
html[data-skin="editorial"] .card .tag.promo { border-color: var(--sk-accent-2); }
html[data-skin="editorial"] .notice { border-radius: var(--sk-radius); }
html[data-skin="editorial"] .storehero .shname { font-family: var(--sk-head); }