/* zai-design-tokens · 来源: CIS_SAM_界面设计_v2.html ① / 官网 www.zailaboratory.com */
:root {
  --zai-red: #AF2B2E; --zai-red-dark: #820303; --zai-red-bright: #F22635;
  --zai-teal: #007c78; --zai-teal-bg: #E6F5F5; --zai-navy: #04194E;
  --ink: #32373C; --ink-2: #575757; --ink-3: #656b79; --ink-4: #616873;
  /* --line / --bg / --card 由各系统的 zai-pharma.css 定义，此处不再重复。 */
  --ok: #00803a; --ok-bg: #E8F6EE; --warn: #a26000; --warn-bg: #FCF3E3;
  --err: #A82C3E; --err-bg: #FBEAEC; --info: #2F5FD0; --info-bg: #EAF0FC;
  --font: "Source Sans Pro", "Source Han Sans SC", "Noto Sans SC", -apple-system, "PingFang SC", "Microsoft YaHei", sans-serif;
  --r-s: 8px; --r-m: 12px; --r-l: 16px;
  --shadow: 0 1px 3px rgba(17,22,27,.06), 0 4px 14px rgba(17,22,27,.06);
  --bp-tablet: 768px; --bp-desktop: 1280px;
}

/* 暗色变体。此前本文件只有亮色，于是 var(--ink) 一类在暗色主题下仍是深色文字：
   实测 .report-catalog-copy 一类标签在 #1b2d32 表面上只有 1.27:1，等于看不见。
   下列取值对 #1b2d32 与 #14242a 均 ≥5.4:1。 */
html[data-theme="dark"] {
  --ink: #e9eff0; --ink-2: #cbd8da; --ink-3: #a9bbbd; --ink-4: #8fa4a9;
  --zai-teal: #5fd4cd; --zai-teal-bg: #143234;
  --ok: #5cc98a; --ok-bg: #163024; --warn: #dfa84e; --warn-bg: #33280f;
  --err: #ff8d99; --err-bg: #3a1b20; --info: #8fb0ff; --info-bg: #16203a;
  --shadow: 0 1px 3px rgba(0, 0, 0, .35), 0 4px 14px rgba(0, 0, 0, .3);
}

/* 高度与辉光。投影原本有近 300 种写法，聚类后只剩下面这些意图：
   --elev-* 是中性高度（静置卡片、面板、对话框，不透明度 ≤0.10）；
   --glow-* 是彩色按钮下方自己颜色的渗出（≥0.13），是状态不是高度。
   两者不可互换。焦点环与 inset 内描边语义不同，不在此列。
   暂不设暗色变体：这些声明原本就是字面量，暗色下用的也是亮色值，
   不加变体即暗色零变化；暗色阴影作为后续单独处理。 */
:root {
  --elev-1: 0 1px 3px rgba(0, 0, 0, 0.07);
  --elev-2: 0 2px 6px rgba(21, 59, 67, 0.012);
  --elev-3: 0 5px 14px rgba(28, 51, 68, 0.025);
  --elev-4: 0 1px 2px rgba(15, 23, 41, 0.03),0 4px 16px rgba(15, 23, 41, 0.04);
  --elev-5: 0 7px 22px rgba(30, 53, 69, 0.045);
  --elev-6: 0 1px 2px rgba(18, 23, 28, 0.05),0 8px 24px rgba(18, 23, 28, 0.05);
  --elev-7: 0 10px 28px rgba(27, 58, 61, 0.055);
  --elev-8: 0 12px 30px rgba(20, 34, 52, 0.1);
  --elev-9: 0 14px 40px rgba(24, 35, 55, 0.08);

  --glow-1: 0 4px 9px rgba(195, 38, 49, 0.22);
  --glow-2: 0 5px 12px rgba(130, 3, 3, 0.14);
  --glow-3: 0 7px 16px rgba(79, 107, 183, 0.2);
  --glow-4: 0 8px 20px rgba(175, 43, 46, 0.16);
  --glow-5: 0 10px 26px rgba(91,24,28,.24);
  --glow-6: 0 12px 26px rgba(0, 125, 122, 0.2);
  --glow-7: 0 14px 36px rgba(130, 3, 3, 0.14);
}

/* 高度与辉光的暗色变体。亮色下 2–5% 的浅灰阴影画在深色表面上等于不存在。
   几何（y/blur/spread）保持不变——它决定高度层级；只换颜色与浓度：
   浓度由「亮色下阴影相对亮底的感知差」在暗底上反解得到，中性高度换黑色基底，
   品牌辉光保留色相。 */
html[data-theme="dark"] {
  --elev-1: 0 1px 3px rgba(0, 0, 0, 0.332);
  --elev-2: 0 2px 6px rgba(0, 0, 0, 0.047);
  --elev-3: 0 5px 14px rgba(0, 0, 0, 0.099);
  --elev-4: 0 1px 2px rgba(0, 0, 0, 0.133), 0 4px 16px rgba(0, 0, 0, 0.177);
  --elev-5: 0 7px 22px rgba(0, 0, 0, 0.176);
  --elev-6: 0 1px 2px rgba(0, 0, 0, 0.219), 0 8px 24px rgba(0, 0, 0, 0.219);
  --elev-7: 0 10px 28px rgba(0, 0, 0, 0.212);
  --elev-8: 0 12px 30px rgba(0, 0, 0, 0.412);
  --elev-9: 0 14px 40px rgba(0, 0, 0, 0.33);
  --glow-1: 0 4px 9px rgba(195, 38, 49, 0.231);
  --glow-2: 0 5px 12px rgba(130, 3, 3, 0.196);
  --glow-3: 0 7px 16px rgba(79, 107, 183, 0.217);
  --glow-4: 0 8px 20px rgba(175, 43, 46, 0.188);
  --glow-5: 0 10px 26px rgba(91, 24, 28, 0.482);
  --glow-6: 0 12px 26px rgba(0, 125, 122, 0.274);
  --glow-7: 0 14px 36px rgba(130, 3, 3, 0.196);
}
