/* Tools and MavenCAT use their original brand colors in light mode. */

/* ============================================================
   V1 设计令牌（2026-09-22 视觉升级 V1-1/V1-3/V1-4，单一来源落位）
   —— 分节：①主色板与当前态金 ②表面与文字 ③禁用态 ④字号阶梯 ⑤深色映射
   浅色值在此（:root）集中定义；深色在 §⑤ 覆盖；QA 模块不消费 --ui-*，不受影响。
   有意不在此定义（避免污染 Tools 品牌别名，见 readme-前端视觉升级方案v2 §七）：
   --ui-danger/warning/success 三族（浅色沿用各消费处回退，色相族已被测试锁定）、
   --ui-surface-muted（Tools --brand-orange-soft 派生自它，定义会抹掉门户暖底）、
   --ui-text（Tools 首页暖色径向光晕派生自它）、--ui-overlay。
   ============================================================ */

/* ① 主色板：深蓝为主（与 biz 侧栏 navy #142d40、登录页深蓝 #00467f 同语系；
      白字对比 8.9:1），teal #185573/#187bb5 由各消费处回退统一切换至此。
      当前态点缀金只用于「当前选中/激活」与焦点环，不大面积使用（§七 决策 5）。 */
:root{
 --ui-accent:#1d4c78;--ui-accent-hover:#163c5e;--ui-accent-soft:#e8eff5;--ui-accent-line:#cbdae8;
 --ui-trial-text:#63339b;--ui-trial-bg:#f3ebfb;--ui-trial-line:#cbb4e2;
 --ui-on-accent:#ffffff;
 --ui-gold:#e8b775;--ui-gold-strong:#dca668;
 /* ② 表面与文字（浅色取 business.css/businessLayout.css 既有回退众数） */
 --ui-border:#e1e6eb;--ui-border-strong:#cdd9e3;
 --ui-text-strong:#203447;--ui-muted:#5d7080;
 --ui-bg-alt:#f4f7f9;
 /* ③ 禁用态：可读配色替代一刀切 opacity（V1-2/V2-4 同一令牌落地） */
 --ui-disabled-bg:#eef2f5;--ui-disabled-border:#d5dee5;--ui-disabled-text:#5d7080;
 /* ④ 字号阶梯（V1-3）：12 注脚/表头 · 13 次要（占位/缩写+计数） · 14 正文 · 16 次标题 · 19 标题 · 24 展示 */
 --ui-fs-note:12px;--ui-fs-secondary:13px;--ui-fs-body:14px;--ui-fs-lead:16px;--ui-fs-title:19px;--ui-fs-display:24px;
}
html[data-mode="light"]{color-scheme:light}
html[data-mode="dark"]{
 color-scheme:dark;
 /* ⑤ 深色映射：主色改为主色同色相（h≈209）的浅色阶，修掉 #79c2f0 天蓝漂色（V1-1）；
      深色主按钮使用 --ui-on-accent 深色字，作正文色时对深卡面保持可读。 */
 --ui-accent:#8ab3d8;--ui-accent-hover:#a9cbe8;--ui-accent-soft:#233d52;--ui-accent-line:#4d7497;
 --ui-trial-text:#dec5ff;--ui-trial-bg:#39284d;--ui-trial-line:#8c6cad;
 --ui-on-accent:#10202e;
 --ui-gold:#e8b775;--ui-gold-strong:#dca668;
 --ui-surface:#202a36;--ui-surface-muted:#17212c;--ui-border:#344455;--ui-border-strong:#53687d;
 --ui-text-strong:#edf3fa;--ui-text:#d0dce9;--ui-muted:#9eb0c4;
 --ui-bg-alt:#263342;
 /* ③ 禁用态（深色）：文本对禁用底 5.5:1，替代 opacity:.5 */
 --ui-disabled-bg:#242f3c;--ui-disabled-border:#3c4d5f;--ui-disabled-text:#93a7bb;
 /* ④ 字号阶梯深色与浅色共用同一组值 */
 --ui-fs-note:12px;--ui-fs-secondary:13px;--ui-fs-body:14px;--ui-fs-lead:16px;--ui-fs-title:19px;--ui-fs-display:24px;
 --ui-overlay:rgb(8 18 30 / 55%);
 /* 深色语义三色复核（V1-2）：文字/底色配对均 ≥4.5:1，色相族保持不变 */
 --ui-danger:#ed837c;--ui-danger-text:#ffa19b;--ui-danger-soft:#43272a;--ui-danger-line:#875550;
 --ui-warning:#efb55e;--ui-warning-text:#ffd18b;--ui-warning-soft:#3e3423;--ui-warning-line:#7f6843;
 --ui-success:#71c59b;--ui-success-text:#8bd9b2;--ui-success-soft:#213c33;--ui-success-line:#487760;
 --brand-blue:#79c2f0;--brand-blue-light:#a5d8f7;--brand-blue-dark:#4c7c9b;--brand-blue-soft:#233d52;
 --brand-orange:#f3b174;--brand-orange-light:#ffcc9b;--brand-orange-dark:#bc783c;--brand-orange-soft:#443326;
 --gradient-brand:linear-gradient(135deg,#e0892b 0%,#00467f 100%);
 --gradient-warm:linear-gradient(135deg,#f2a85b 0%,#e0892b 100%);
 --gradient-cool:linear-gradient(135deg,#1a5a9c 0%,#00467f 100%);
}
html[data-mode="dark"] body{background:var(--ui-surface-muted);color:var(--ui-text)}
html[data-mode="dark"] :is(input,textarea,select){caret-color:var(--ui-accent)}
html[data-mode="dark"] :is(input,textarea)::placeholder{color:var(--ui-muted);opacity:1}
html[data-mode="dark"] :is(input[type=checkbox],input[type=radio]){accent-color:var(--ui-accent)}
html[data-mode="dark"] :is(.primary-button,.project-btn.primary,.btn-primary,.cat-dialog button.primary,.preferences-footer button.primary,.users-primary){background:var(--ui-accent);border-color:var(--ui-accent);color:var(--ui-on-accent)}
html[data-mode="dark"] :is(.primary-button,.project-btn.primary,.btn-primary,.cat-dialog button.primary):hover:not(:disabled){background:var(--ui-accent-hover);border-color:var(--ui-accent-hover)}
html[data-mode="dark"] :is(.browser-tab.active,.users-tabs button.active,.preferences-nav button.active){color:var(--ui-accent);border-color:var(--ui-accent);background:var(--ui-accent-soft)}
html[data-mode="dark"] :is(.users-person.selected,.tool-card:hover){border-color:var(--ui-accent);background:var(--ui-accent-soft)}
html[data-mode="dark"] :focus-visible{outline-color:var(--ui-accent)}
html[data-mode="dark"] :is(.project-shell .project-table tbody tr.selected,.library-table tbody tr.selected,.light-select-option.active,.light-select-option:hover,.light-select-option.selected,.export-choice.selected){background:var(--ui-accent-soft)}
html[data-mode="dark"] .project-import-card{border-color:var(--ui-accent-line);background:var(--ui-accent-soft)}
html[data-mode="dark"] .project-search-btn{background:var(--ui-surface);border:1px solid var(--ui-border);color:var(--ui-text)}
html[data-density="compact"] :is(.tool-card,.users-person){padding:10px 12px}
html[data-density="compact"] :is(.users-card,.preferences-row){padding:12px}
html[data-density="compact"] .project-table :is(th,td){padding-top:6px;padding-bottom:6px}
/* The source logo is transparent. Lift its blue ink for dark surfaces. */
html[data-mode="dark"] .brand-logo{filter:url(#brand-dark-ink)}
html[data-mode="dark"] .tool-icon{color:#fff}
html[data-mode="dark"] .language-switcher button.active{background:var(--brand-orange);color:var(--ui-on-accent)}

/* ============================================================
   ⑥ 控件组件（V2-1，2026-09-22）：自定义开关 .ui-toggle
   原型：Tools 偏好设置 toggle（src/settings/SettingsHost.vue 偏好控件段，走查 D2-1 样板）。
   语义保持原生 <input type="checkbox">（键盘 Space、表单 v-model、role=checkbox 不变，
   flowPolicySettings/salesBusiness 既有断言依赖），仅呈现开关化；色值全部引用
   §①—③ 令牌，浅深两态自动切换；禁用态走 --ui-disabled-*（V1-2 口径），不用 opacity。
   ============================================================ */
/* 选择器带 :root 前缀（0,3,1），压过 business.css/businessLayout.css 的通用 input 背景规则（0,2,1），
   否则未勾选轨道被刷成白色（2026-09-22 走查实测）。 */
:root input[type=checkbox].ui-toggle{appearance:none;-webkit-appearance:none;position:relative;flex-shrink:0;box-sizing:border-box;width:34px;height:20px;min-height:0;border:1px solid transparent;border-radius:12px;background:var(--ui-border-strong,#c4d0db);margin:0;cursor:pointer;transition:background .15s}
:root input[type=checkbox].ui-toggle::after{content:'';position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:var(--ui-surface,#fff);transition:transform .15s}
:root input[type=checkbox].ui-toggle:checked{background:var(--ui-accent,#137f99)}
:root input[type=checkbox].ui-toggle:checked::after{transform:translateX(14px)}
:root input[type=checkbox].ui-toggle:disabled{background:var(--ui-disabled-bg,#eef2f5);border-color:var(--ui-disabled-border,#d5dee5);cursor:default}
:root input[type=checkbox].ui-toggle:disabled::after{background:var(--ui-disabled-text,#5d7080)}
:root input[type=checkbox].ui-toggle:focus-visible{outline:2px solid var(--ui-gold-strong,#dca668);outline-offset:2px}

/* ============================================================
   ⑦ 弹层共享规格（V3-3，2026-09-22）：以 CAT 资源库弹层 .cat-dialog（走查样板
   cat-resources-desktop）为基准——圆角 12px、遮罩 --ui-overlay（浅色回退
   rgba(8,18,30,.55)，深色 §⑤ 已定义）、无背景模糊、头区 min-height 58px/13px 20px。
   收编「用户与岗位」modal（.users-overlay/.users-workspace、.unified-overlay/.unified-users）
   ——仅样式层统一，类名/aria/DOM 结构与既有 adminPanel/delegatedUsers 断言全部不动。
   选择器加 body 前缀（0,1,1+）压过各组件样式注入顺序；biz 侧 .biz-leave-overlay/
   .biz-customer-picker 的对齐规则见 businessLayout.css「V3 壳与导航统一」段。
   ============================================================ */
body :is(.users-overlay,.unified-overlay){backdrop-filter:none}
body :is(.users-workspace,.unified-users){border-radius:12px}
body .unified-users>header{min-height:58px;padding:13px 20px}
body .users-topbar{min-height:58px;padding:13px 20px}
body .users-topbar h2{font-size:16px;font-weight:600}

/* ============================================================
   ⑧ 动效令牌与出入场（V6-1，2026-09-22 视觉升级·收官批）：全站统一时长与缓动。
   --ui-motion-fast 150ms＝hover 反馈、details 摘要指示符等微过渡；
   --ui-motion 200ms＝浮层/弹层出入场；曲线统一 --ui-ease（标准 ease-in-out 类）。
   三类消费（方案 §三 V6-1，走查 D7-1/D7-2）：
   a. details 折叠——FlowPolicySettings.vue scoped（分组摘要指示符旋转＋内容轻显）、
      businessLayout.css「V6 动效与品牌」段（详情「更多」菜单面板）；
   b. RecipientPicker 展开浮层——RecipientPicker.vue scoped（.rp-panel 入场）；
   c. 弹层出入场——本节下方规则（V3 §⑦ 收编家族）＋ transcollab.css「V6」段（CAT modal 换 token）。
   prefers-reduced-motion: reduce：令牌归零并禁用位移类入场动画（保留即时显隐）；
   biz 模块全域兜底（transition+animation 双禁）见 businessLayout.css 同名媒体查询规则。
   ============================================================ */
:root{
 --ui-motion-fast:150ms;--ui-motion:200ms;
 --ui-ease:cubic-bezier(.4,0,.2,1);
}
@keyframes ui-overlay-in{from{opacity:0}to{opacity:1}}
@keyframes ui-dialog-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* V6-1c 弹层出入场：遮罩轻淡入（fast 档）、面板淡入+6px 上移（标准档 ≤200ms）。
   biz 侧 .biz-leave-overlay 同时承载离开确认与「选择客户新建订单」两类 dialog
   （src/business/BusinessApp.vue:241-242）；Tools 侧 .users-overlay 有 embedded 内嵌形态
   （src/tools/UserPermissions.vue:475），排除以免内嵌挂载时反复闪动。 */
body :is(.biz-leave-overlay,.users-overlay:not(.users-embedded),.unified-overlay){animation:ui-overlay-in var(--ui-motion-fast,150ms) var(--ui-ease,cubic-bezier(.4,0,.2,1))}
body .biz-leave-overlay :is(.biz-leave-dialog,.biz-customer-picker),
body .users-overlay:not(.users-embedded) .users-workspace,
body .unified-overlay .unified-users{animation:ui-dialog-in var(--ui-motion,200ms) var(--ui-ease,cubic-bezier(.4,0,.2,1))}
/* V6-遗留1（2026-09-23）弹层退出：与入场对称的 fast 档淡出，关闭不再瞬切。
   biz 离开确认/客户选择用 Vue <Transition name="ui-exit"> 包裹（BusinessApp.vue，DOM 结构与
   既有 aria/类名不变，仅 leave 阶段挂 ui-exit-leave-* 类；入场仍走上方 ui-overlay-in/-dialog-in）；
   Tools 统一用户与岗位弹层为 Teleport 根组件（父级 v-if 挂载，无法被 <Transition> 包裹），
   按遮罩淡出方案走 UnifiedUserManagement.vue 内部 ui-exiting 两段式（淡出 150ms 后再卸载）。
   pointer-events 在退出开始即隔离，防止淡出期间误点；reduce 下令牌归零→0ms 过渡即时移除
   （下方 reduce 块与 businessLayout.css .biz-app 全域规则双保险）。 */
body .ui-exit-leave-active{transition:opacity var(--ui-motion-fast,150ms) var(--ui-ease,cubic-bezier(.4,0,.2,1));pointer-events:none}
body .ui-exit-leave-to{opacity:0}
body .unified-overlay.ui-exiting{opacity:0;transition:opacity var(--ui-motion-fast,150ms) var(--ui-ease,cubic-bezier(.4,0,.2,1));pointer-events:none}
@media(prefers-reduced-motion:reduce){
 :root{--ui-motion-fast:0ms;--ui-motion:0ms}
 body :is(.biz-leave-overlay,.users-overlay,.unified-overlay,.modal-overlay.open),
 body :is(.biz-leave-dialog,.biz-customer-picker,.users-workspace,.unified-users),
 body .modal-overlay.open .modal-box{animation:none!important}
 body .ui-exit-leave-active,body .unified-overlay.ui-exiting{transition:none!important}
}