/* 统一设计令牌与通用组件。所有页面最先加载本文件；旧 style.css 的变量改为引用这里的令牌。
   顾客页在 <html style> 注入店铺的 --accent / --accent-soft；平台页面使用默认平台蓝。
   不加载外部字体、CDN 或图标库；图标一律用内联 SVG。 */
:root{
  color-scheme:light;
  /* 平台品牌 */
  --brand:#2F5BEA;--brand-dark:#1E3FB8;--brand-soft:#EAF0FF;
  --teal:#0E9F8F;--teal-dark:#0E6B60;--teal-soft:#DDF5F1;
  /* 文字与背景（--muted 在 --bg、--surface、--line-soft 上均 ≥ 5.4:1） */
  --ink:#0F1A2E;--ink-2:#2A3650;--muted:#55627A;
  --bg:#F4F6FB;--surface:#FFFFFF;--surface-2:#F7F9FC;--surface-3:#FBFCFE;
  --line:#E3E8F2;--line-soft:#EEF1F7;--line-strong:#C9D3E6;
  /* 店铺配色：默认平台蓝，顾客页覆盖 */
  --accent:var(--brand);--accent-soft:var(--brand-soft);
  --shop-accent:var(--accent);--shop-accent-soft:var(--accent-soft);
  /* 状态色（文字/底色对比度均 ≥ 4.5:1） */
  --success:#17633A;--success-soft:#E9F7EE;
  --warning:#8A4A12;--warning-soft:#FFF3E0;--warning-line:#F5C9A8;
  --danger:#B42318;--danger-soft:#FDECEA;--danger-line:#F3C7C1;--badge:#C2321F;
  --suggest:#7A5200;--suggest-soft:#FFF1C9;--suggest-line:#E8C766;
  --open:#1FA463;
  /* 圆角、阴影、间距、字体 */
  --radius-xs:6px;--radius-sm:8px;--radius:12px;--radius-lg:16px;--radius-xl:20px;--radius-pill:999px;
  --shadow-sm:0 2px 8px rgba(15,26,46,.04);--shadow:0 8px 24px rgba(15,26,46,.06);--shadow-lg:0 10px 28px rgba(15,26,46,.08);
  --shadow-pop:0 20px 60px rgba(15,26,46,.18);
  --space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;
  --font:"PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif;
  --tap:44px;
  --focus:0 0 0 3px rgba(47,91,234,.28);
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;line-height:1.65}
button,input,select,textarea{font:inherit;color:inherit}
a{color:var(--accent)}
a:hover{color:var(--ink)}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.icon{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.icon-sm{width:16px;height:16px}

/* 按钮：主 / 次 / 文字。可点区域不小于 44px。 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:var(--tap);padding:0 18px;border-radius:var(--radius);border:1px solid transparent;font-size:15px;font-weight:500;line-height:1.2;text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:disabled{opacity:.55;cursor:default}
.btn-primary{background:var(--accent);color:#fff;border-color:var(--accent)}
.btn-primary:hover{background:var(--brand-dark);color:#fff}
.btn-dark{background:var(--ink);color:#fff;border-color:var(--ink)}
.btn-dark:hover{background:var(--ink-2);color:#fff}
.btn-secondary{background:var(--surface);color:var(--ink);border-color:var(--line)}
.btn-secondary:hover{border-color:var(--line-strong);color:var(--ink)}
.btn-text{background:transparent;color:var(--accent);border-color:transparent;padding:0 10px}
.btn-text:hover{background:var(--accent-soft);color:var(--accent)}
.btn-pill{border-radius:var(--radius-pill)}
.icon-button{display:inline-flex;align-items:center;justify-content:center;width:var(--tap);height:var(--tap);flex:none;border-radius:var(--radius);border:1px solid var(--line);background:var(--surface);color:var(--ink-2);cursor:pointer}
.icon-button:hover{border-color:var(--line-strong)}

/* 面板、卡片 */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}
.panel-head{display:flex;align-items:center;gap:12px;padding:16px 20px;border-bottom:1px solid var(--line-soft)}
.panel-title{margin:0;font-size:16px;font-weight:700;line-height:1.4}
.panel-sub{margin:2px 0 0;font-size:12px;color:var(--muted)}
.section-label{margin:0 0 10px;font-size:13px;font-weight:700;color:var(--muted)}

/* chip、状态 pill、AI 建议标签、角标 */
.chip{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:var(--radius-pill);border:1px solid var(--line);background:var(--surface);color:var(--ink-2);font-size:13px;line-height:1.3;cursor:pointer;text-decoration:none}
.chip:hover{border-color:var(--line-strong);color:var(--ink)}
.pill{display:inline-flex;align-items:center;min-height:24px;padding:2px 10px;border-radius:var(--radius-pill);font-size:12px;font-weight:500;line-height:1.4;white-space:nowrap;background:var(--line-soft);color:var(--muted)}
.pill-info{background:var(--brand-soft);color:var(--brand-dark)}
.pill-success{background:var(--teal-soft);color:var(--teal-dark)}
.pill-warning{background:var(--warning-soft);color:var(--warning)}
.pill-danger{background:var(--danger-soft);color:var(--danger)}
.pill-muted{background:var(--line-soft);color:var(--muted)}
.tag-suggest{display:inline-flex;align-items:center;min-height:22px;padding:1px 8px;border-radius:11px;background:var(--suggest-soft);color:var(--suggest);font-size:12px;font-weight:700;line-height:1.5}
.count-dot{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:10px;background:var(--badge);color:#fff;font-size:12px;font-weight:700;line-height:1}

/* 输入框 */
.input{width:100%;min-width:0;min-height:var(--tap);padding:10px 14px;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface-2);color:var(--ink);font-size:16px;outline:none}
.input:focus{border-color:var(--accent);box-shadow:var(--focus)}
::placeholder{color:var(--muted);opacity:1}

/* 聊天气泡：AI（左，带小头像）/ 我（右，主色） */
.msg-row{display:flex;gap:8px;align-items:flex-start}
.ai-avatar{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;flex:none;border-radius:9px;background:var(--accent);color:#fff;font-size:12px;font-weight:700;line-height:1}
.bubble-ai{max-width:82%;padding:10px 13px;border-radius:4px 16px 16px 16px;background:var(--surface);border:1px solid var(--line);box-shadow:var(--shadow-sm);font-size:15px;line-height:1.6}
.bubble-me{align-self:flex-end;max-width:78%;padding:10px 13px;border-radius:16px 4px 16px 16px;background:var(--accent);color:#fff;font-size:15px;line-height:1.6}

/* 确认卡片（票据样式）：顶部色条 + 明细 + 按钮 */
.ticket{background:var(--surface);border:1px solid var(--line);border-radius:18px;overflow:hidden;box-shadow:var(--shadow-lg)}
.ticket-head{padding:14px 16px 12px;background:linear-gradient(135deg,var(--accent),var(--accent) 55%,var(--brand-dark));color:#fff}
.ticket-body{padding:12px 16px 14px}

/* 侧边导航项 */
.nav-item{display:flex;align-items:center;gap:10px;width:100%;min-height:var(--tap);padding:0 12px;border:0;border-radius:10px;background:transparent;color:var(--ink-2);font-size:14px;text-align:left;text-decoration:none;cursor:pointer}
.nav-item:hover{background:var(--bg);color:var(--ink)}
.nav-item[aria-selected="true"],.nav-item[aria-current="page"]{background:var(--brand-soft);color:var(--brand-dark);font-weight:700}

/* 差异着色：增绿 / 删红（删除线）/ 改橙 */
.diff-added{background:var(--success-soft);color:var(--success)}
.diff-deleted{background:var(--danger-soft);color:var(--danger);text-decoration:line-through}
.diff-modified{background:var(--warning-soft);color:var(--warning)}

/* 页面级小部件 */
.status-dot{display:inline-block;width:7px;height:7px;flex:none;border-radius:50%;background:var(--open)}
.status-dot.closed{background:var(--muted)}
.empty-note{padding:32px 16px;text-align:center;color:var(--muted);font-size:14px}
.soft-gradient{background:radial-gradient(420px 260px at 90% 0%,#DCE7FF 0%,rgba(220,231,255,0) 70%),radial-gradient(360px 240px at 0% 8%,#DDF5F1 0%,rgba(221,245,241,0) 70%),var(--bg)}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
