/* css/views/mappings.css — 视图私有样式,owner: mappings 视图 agent。
 * 只许本视图 agent 写;全部选择器前缀 .v-mappings;颜色/间距用 var(--*)。 */

/* 表格行内操作按钮:右对齐,不换行(紧凑档统一走 app.css 的 .btn-sm) */
.v-mappings-actions {
  display: flex;
  gap: var(--space-2);
  justify-content: flex-end;
  white-space: nowrap;
}

/* upsert 表单的服务端错误区:within-provider 等 400 的后端 message 原样展示。
 * 信号色语义固定(DESIGN.md §2):crimson tint 底 + crimson 字,只用于错误。 */
.v-mappings-form-error {
  background: var(--color-danger-tint);
  color: var(--color-danger);
  border: 1px solid var(--color-danger);
  border-radius: var(--radius-control);
  padding: var(--space-2) var(--space-3);
  font-size: 13px;
}
.v-mappings-form-error[hidden] { display: none; }
.v-mappings-form-error p { margin: 0; }
.v-mappings-form-error .trace-id { margin-top: var(--space-1); }
.v-mappings-form-error-hint {
  color: var(--color-text-secondary);
  margin-top: var(--space-1);
}

/* ---- 白画布 + 版头(§9g,2026-07-14,P2 轻改):主动作上区块版头,页头槽退役 ---- */
.v-map-canvas {
  background: var(--color-surface);
  border-radius: 24px;
  padding: var(--space-6);
  margin-bottom: var(--space-6);
}
.v-map-canvas .section { margin-bottom: 0; }
.v-map-sub { font-size: 12px; font-weight: 400; color: var(--color-text-muted); margin-left: var(--space-2); }
.v-map-sec-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-3);
  flex-wrap: wrap;
  margin-bottom: var(--space-3);
}
.v-map-sec-head .section-title { margin-bottom: 0; }
.v-map-canvas .table th,
.v-map-canvas .table td { white-space: nowrap; } /* 基础排版:不竖排 */
/* 画布内老 .card 面板转灰卡(§9g 第二层) */
.v-map-canvas .card {
  background: var(--color-card);
  border: none;
  box-shadow: none;
  border-radius: 18px;
}

/* ---- 2026-07-14 用户规格:空态 + 数据列表 ---- */
.v-mappings-hidden { display: none; }
/* 空态:压缩高度、内容垂直居中(规格 A3) */
.v-mappings-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--space-3);
  padding: var(--space-6) var(--space-4);
  text-align: center;
}
.v-mappings-empty-text {
  margin: 0;
  max-width: 46em;
  font-size: 13px;
  line-height: 1.6;
  color: var(--color-text-secondary);
}
/* 半透明示例映射卡(规格 A2):灰卡 + 右上「示例」小签,不可点 */
.v-mappings-sample {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: var(--space-2);
  padding: var(--space-3) var(--space-6) var(--space-3) var(--space-4);
  background: var(--color-card);
  border-radius: 14px;
  font-size: 13px;
  opacity: 0.5;
  pointer-events: none;
  user-select: none;
}
.v-mappings-sample-tag {
  position: absolute;
  top: 4px;
  right: 8px;
  font-size: 10px;
  color: var(--color-text-muted);
}
.v-mappings-sample-prov { margin-left: var(--space-2); font-size: 12px; color: var(--color-text-muted); }
/* 橙色改写箭头(列表列与示例卡共用) */
.v-mappings-arrow { color: var(--color-accent); font-weight: 700; }
/* Provider 标签(灰底 chip) */
.v-mappings-prov {
  display: inline-flex;
  padding: 1px var(--space-2);
  border-radius: 999px;
  background: var(--color-card);
  font-size: 12px;
  color: var(--color-text-secondary);
}
/* 别名旁重复警告(规格 B4):红色小图标 + title 悬浮 */
.v-mappings-alias { display: inline-flex; align-items: center; gap: var(--space-1); }
.v-mappings-dup { display: inline-flex; color: var(--color-danger); cursor: help; }
.v-mappings-dup:focus-visible { outline: none; box-shadow: var(--focus-ring); border-radius: 4px; }
/* 筛选栏(对拍员工页) */
.v-mappings-filters { margin-bottom: var(--space-3); }
.v-mappings-q { min-width: 240px; }


/* Provider 厂商柔和色(2026-07-14 用户规格:openai 绿 / anthropic 橙 / deepseek 蓝,
 * 品牌色只做身份 §9g;未知厂商回落灰) */
.v-mappings-prov-openai { background: rgba(16, 163, 127, 0.12); color: var(--color-prov-openai); }
.v-mappings-prov-anthropic { background: rgba(249, 115, 22, 0.14); color: var(--color-prov-anthropic); }
.v-mappings-prov-deepseek { background: rgba(77, 107, 254, 0.12); color: var(--color-prov-deepseek); }
.v-mappings-prov-gemini { background: rgba(79, 143, 208, 0.14); color: var(--color-prov-gemini); }