/* ============================================================
   健康知因 · 标准组件库（2026-10-23 引入，命名空间 .zy-）
   设计令牌见 _design_tokens.css。本文件只【新增】类，不覆盖现有样式
   （现有 .btn/.card/.input/.tag/.pager 等一律不动，避免回滚破坏）。
   老 WebView 约束：不用 position:fixed;inset:0 简写；flex 用 flexgap.js；
   焦点双写 :focus + :focus-visible。
   ============================================================ */

/* ---- 全局焦点可见性（WCAG 2.1 AA：键盘与点按均可感知）----
   老内核不支持 :focus-visible → 用 :focus 兜底（始终显示轮廓，已知 trade-off）。
   仅加 outline，不占布局，不影响现有视觉结构。 */
a:focus,button:focus,input:focus,select:focus,textarea:focus,[tabindex]:focus,
.zy-btn:focus,.zy-input:focus,.zy-card:focus{
  outline:2px solid #1f6b4b;   /* 硬编码兜底：老 WebView 不支持 CSS 变量时焦点轮廓仍可见 */
  outline-offset:2px;
}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,
textarea:focus-visible,[tabindex]:focus-visible,.zy-btn:focus-visible,
.zy-input:focus-visible,.zy-card:focus-visible{
  outline:2px solid #1f6b4b;   /* 硬编码兜底：老 WebView 不支持 CSS 变量时焦点轮廓仍可见 */
  outline-offset:2px;
}

/* ---- 按钮 .zy-btn（sm/md/lg × primary/ghost/danger × 状态）---- */
.zy-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);
  border:0;border-radius:var(--r-md);font-weight:700;font-family:inherit;
  cursor:pointer;min-height:44px;padding:0 var(--sp-5);font-size:var(--fs-base);
  background:var(--brand-600);color:var(--text-inverse);line-height:1.2;
  text-decoration:none;
  transition:transform var(--tr),box-shadow var(--tr),background var(--tr);
}
.zy-btn:active{transform:translateY(1px)}
.zy-btn.primary{background:var(--brand-600)}
.zy-btn.ghost{background:transparent;color:var(--brand-600);box-shadow:inset 0 0 0 1px var(--border-strong)}
.zy-btn.danger{background:var(--danger)}
.zy-btn.sm{min-height:36px;padding:0 var(--sp-4);font-size:var(--fs-sm)}
.zy-btn.lg{min-height:52px;font-size:var(--fs-md);width:100%}
.zy-btn.block{width:100%}
.zy-btn[disabled],.zy-btn.disabled{opacity:.5;pointer-events:none}

/* ---- 卡片 .zy-card ---- */
.zy-card{
  background:var(--surface);border:1px solid var(--border);border-radius:var(--r-lg);
  padding:var(--sp-5);box-shadow:var(--sh-sm);
}
.zy-card .zy-ttl{font-weight:700;font-size:var(--fs-md);margin:0 0 var(--sp-2)}

/* ---- 输入 .zy-input ---- */
.zy-input{
  width:100%;border:1px solid var(--border);border-radius:var(--r-md);
  padding:var(--sp-3);font-size:var(--fs-base);font-family:inherit;
  background:var(--surface);color:var(--text);
}
.zy-input::placeholder{color:var(--text-muted)}

/* ---- 标签 .zy-tag ---- */
.zy-tag{
  display:inline-block;font-size:var(--fs-xs);padding:2px 10px;border-radius:var(--r-pill);
  color:var(--text-inverse);background:var(--brand-600);line-height:1.6;
}
.zy-tag.off{background:var(--status-off)}     /* 已停用（深灰，白字 6.06:1） */
.zy-tag.danger{background:var(--danger)}
.zy-tag.warn{background:var(--warning)}       /* 白字 5.65:1 */
.zy-tag.info{background:var(--info)}          /* 白字 4.9:1 */

/* ---- 分页器 .zy-pager（最小 44px 触控靶）---- */
.zy-pager{
  min-width:40px;height:44px;padding:0 var(--sp-3);border:1px solid var(--border-strong);
  background:var(--surface);border-radius:var(--r-sm);font-size:var(--fs-sm);
  cursor:pointer;font-family:inherit;color:var(--text);
}
.zy-pager.active{background:var(--brand-600);color:var(--text-inverse);border-color:var(--brand-600)}

/* ---- 提示块 .zy-note / .zy-risk ---- */
.zy-note{background:var(--brand-100);border-left:3px solid var(--brand-500);
  padding:var(--sp-3);border-radius:var(--r-sm);font-size:var(--fs-sm);margin:var(--sp-3) 0}
.zy-risk{background:var(--danger-soft);border-left:3px solid var(--danger);
  padding:var(--sp-3);border-radius:var(--r-sm);font-size:var(--fs-sm);margin:var(--sp-3) 0}

/* ---- 尊重用户减弱动效偏好 ---- */
@media (prefers-reduced-motion:reduce){
  .zy-btn,.zy-card{transition:none}
}