/* ============================================================================
   代理工作台 · 样式模板（每套代理一套皮肤）

   只改变量与小面积覆盖，不动布局/路由/权限。
   由服务端在 <html> 上注入 data-agent-theme（gold|ink|azure|sand|violet），
   品牌弹窗里的「样式模板」就是写这个值；老部门没有该字段时回落 gold（现状）。

   加载顺序：必须晚于 workspace-theme.css 与 agent-shell-gold.css。
   ============================================================================ */

/* ---------------------------------------------------------------- 黑金（默认） --- */
/* 保持今天的线上配色：这里刻意不写任何规则，gold 的样式全部由 agent-shell-gold.css 决定。 */

/* ------------------------------------------------------------------- 墨黑 --- */
/* 去金化：石墨底 + 白字 + 中性灰高亮，适合"越低调越好"的代理。 */
html[data-agent-theme="ink"] {
  --gold-50: #f6f7f8;
  --gold-100: #e9ebee;
  --gold-200: #d8dbe0;
  --gold-300: #c3c7cd;
  --gold-400: #9aa1aa;
  --gold-500: #7d848d;
  --gold-ink: #0f1114;
  --gold-line: rgba(255, 255, 255, 0.14);
  --gold-line-strong: rgba(255, 255, 255, 0.24);
  --gold-soft: rgba(255, 255, 255, 0.07);
  --ink-950: #050607;
  --ink-900: #0a0b0d;
  --ink-850: #101215;
  --ink-800: #16181c;
  --suite-primary: #1f2328;
  --suite-primary-hover: #000000;
  --suite-primary-soft: #f1f2f4;
  --suite-primary-line: #dfe2e6;
}
html[data-agent-theme="ink"] .agent-shell .agent-sidebar {
  border-right-color: rgba(255, 255, 255, 0.1);
  background: linear-gradient(180deg, #14161a 0%, #0d0f12 56%, #060708 100%);
}
html[data-agent-theme="ink"] .agent-shell .agent-brand {
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.02));
}
html[data-agent-theme="ink"] .agent-shell .agent-menu a.is-active,
html[data-agent-theme="ink"] .agent-shell .agent-menu .is-active > .agent-menu-parent,
html[data-agent-theme="ink"] .agent-shell .agent-tab.is-active {
  background: rgba(255, 255, 255, 0.1);
  color: #ffffff;
}

/* ----------------------------------------------------------------- 科技蓝 --- */
/* 深海军蓝 + 青蓝高亮，适合工具型/技术型代理。 */
html[data-agent-theme="azure"] {
  --gold-50: #eaf3ff;
  --gold-100: #cfe4ff;
  --gold-200: #a8d0ff;
  --gold-300: #7bb9ff;
  --gold-400: #4d9dff;
  --gold-500: #2b7ce0;
  --gold-ink: #08121f;
  --gold-line: rgba(93, 160, 255, 0.28);
  --gold-line-strong: rgba(93, 160, 255, 0.46);
  --gold-soft: rgba(93, 160, 255, 0.12);
  --ink-950: #050a12;
  --ink-900: #0a1220;
  --ink-850: #0e1826;
  --ink-800: #12202f;
  --suite-primary: #1f6fe5;
  --suite-primary-hover: #1657bb;
  --suite-primary-soft: #eaf2ff;
  --suite-primary-line: #c8dcff;
}
html[data-agent-theme="azure"] .agent-shell .agent-sidebar {
  border-right-color: rgba(93, 160, 255, 0.22);
  background:
    radial-gradient(620px 260px at 50% -12%, rgba(77, 157, 255, 0.18), transparent 72%),
    linear-gradient(180deg, #0e1826 0%, #0a1220 54%, #050a12 100%);
}
html[data-agent-theme="azure"] .agent-shell .agent-brand {
  background: linear-gradient(145deg, rgba(77, 157, 255, 0.16), rgba(255, 255, 255, 0.02));
}
html[data-agent-theme="azure"] .agent-shell .agent-menu a.is-active,
html[data-agent-theme="azure"] .agent-shell .agent-menu .is-active > .agent-menu-parent,
html[data-agent-theme="azure"] .agent-shell .agent-tab.is-active {
  background: rgba(77, 157, 255, 0.18);
  color: #eaf3ff;
}

/* ------------------------------------------------------------------- 暖沙 --- */
/* 浅米白壳 + 赭石点缀，适合传统行业/偏线下的代理；侧栏是浅色，字要压深。 */
html[data-agent-theme="sand"] {
  --gold-50: #fffaf0;
  --gold-100: #f6e8cf;
  --gold-200: #e9d3ae;
  --gold-300: #d8b98a;
  --gold-400: #c19a63;
  --gold-500: #a67c45;
  --gold-ink: #3b2c1c;
  --gold-line: rgba(166, 124, 69, 0.24);
  --gold-line-strong: rgba(166, 124, 69, 0.42);
  --gold-soft: rgba(166, 124, 69, 0.1);
  --ink-950: #ffffff;
  --ink-900: #fdf8f0;
  --ink-850: #f8f0e3;
  --ink-800: #f2e6d3;
  --suite-primary: #a67c45;
  --suite-primary-hover: #8a6536;
  --suite-primary-soft: #fbf3e6;
  --suite-primary-line: #ecdcc4;
}
html[data-agent-theme="sand"] .agent-shell .agent-sidebar {
  border-right-color: rgba(166, 124, 69, 0.24);
  background: linear-gradient(180deg, #fdf8f0 0%, #f7efe2 60%, #f1e6d5 100%);
  scrollbar-color: rgba(166, 124, 69, 0.4) transparent;
  color: #4a3a28;
}
/* 浅色侧栏：金壳默认是浅字，这里统一压深，否则品牌名/分组标题会看不见。 */
html[data-agent-theme="sand"] .agent-shell .agent-sidebar :is(strong, small, span, p, button, a) {
  color: inherit;
}
html[data-agent-theme="sand"] .agent-shell .agent-sidebar .agent-submenu :is(button, a) {
  color: #5c4a34;
}
html[data-agent-theme="sand"] .agent-shell .agent-topbar {
  background: #fdf8f0;
  border-bottom: 1px solid rgba(166, 124, 69, 0.22);
}
html[data-agent-theme="sand"] .agent-shell .agent-topbar .agent-tab {
  color: #5c4a34;
}
html[data-agent-theme="sand"] .agent-shell .agent-sidebar,
html[data-agent-theme="sand"] .agent-shell .agent-menu a,
html[data-agent-theme="sand"] .agent-shell .agent-menu .agent-menu-parent {
  color: #4a3a28;
}
html[data-agent-theme="sand"] .agent-shell .agent-brand {
  background: linear-gradient(145deg, rgba(166, 124, 69, 0.12), rgba(255, 255, 255, 0.6));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 10px 22px rgba(120, 92, 50, 0.12);
}
html[data-agent-theme="sand"] .agent-shell .agent-menu a.is-active,
html[data-agent-theme="sand"] .agent-shell .agent-menu .is-active > .agent-menu-parent,
html[data-agent-theme="sand"] .agent-shell .agent-tab.is-active {
  background: rgba(166, 124, 69, 0.16);
  color: #3b2c1c;
}

/* ------------------------------------------------- 暖沙：浅色顶栏可读性 ---
   金壳的标签/关闭按钮是给深底写的浅色，落到浅色顶栏上几乎看不见（2026-10-27 反馈）。
   这里只补对比度，不改布局。 */
html[data-agent-theme="sand"] .agent-shell .agent-topbar .agent-tab {
  color: #5c4a34;
}
html[data-agent-theme="sand"] .agent-shell .agent-topbar .agent-tab.is-active,
html[data-agent-theme="sand"] .agent-shell .agent-topbar .agent-tab.is-active:hover {
  border-color: rgba(166, 124, 69, 0.55);
  background: rgba(166, 124, 69, 0.2);
  color: #2f2317;
  font-weight: 600;
}
html[data-agent-theme="sand"] .agent-shell .agent-tab-close {
  color: rgba(59, 44, 28, 0.62);
}
html[data-agent-theme="sand"] .agent-shell .agent-tab-close:hover,
html[data-agent-theme="sand"] .agent-shell .agent-tab-close:focus-visible {
  background: rgba(166, 124, 69, 0.2);
  color: #2f2317;
}
html[data-agent-theme="sand"] .agent-shell .agent-topbar .agent-tab.is-active .agent-tab-close {
  color: rgba(59, 44, 28, 0.75);
}
html[data-agent-theme="sand"] .agent-shell .agent-tabs-scroll {
  background: #ffffff;
  border-color: rgba(166, 124, 69, 0.26);
  color: #7a5a2e;
}
html[data-agent-theme="sand"] .agent-shell .agent-tabs-scroll:hover {
  background: #f6e8cf;
  color: #3b2c1c;
}

/* ------------------------------------------------------------------- 紫夜 --- */
/* 深靛紫侧栏 + 香槟金描边 + 淡紫画布：金色只留描边与图标点缀，主强调色改紫，
   顶栏转白、画布转淡紫（2026-10-27 反馈的那套紫色）。 */
html[data-agent-theme="violet"] {
  --violet-50: #f4f2ff;
  --violet-100: #e7e2ff;
  --violet-200: #cfc6fb;
  --violet-300: #b3a5f6;
  --violet-400: #8d7aea;
  --violet-500: #5b4fd6;
  --ink-950: #1e1a31;
  --ink-900: #241f3b;
  --ink-850: #2a2444;
  --ink-800: #322b52;
  --suite-sidebar: #322b52;
  --suite-sidebar-bottom: #241f3b;
  --suite-sidebar-selected: #453b68;
  --suite-primary: #5b4fd6;
  --suite-primary-hover: #4a3fc0;
  --suite-primary-soft: #f4f2ff;
  --suite-primary-line: #d8d1f9;
  --suite-canvas: #eef1f9;
  --suite-surface: #ffffff;
  --suite-surface-muted: #f8f9fd;
  --suite-line: #e4e7f1;
  --suite-text: #26304a;
  --suite-muted: #64708a;
}

html[data-agent-theme="violet"] .agent-shell .agent-sidebar {
  border-right-color: rgba(255, 255, 255, 0.09);
  background:
    radial-gradient(620px 260px at 50% -12%, rgba(154, 136, 248, 0.24), transparent 72%),
    radial-gradient(420px 240px at 88% 92%, rgba(91, 79, 214, 0.18), transparent 74%),
    linear-gradient(180deg, #35305a 0%, #2f294c 52%, #241f3b 100%);
  scrollbar-color: rgba(190, 176, 255, 0.38) transparent;
}

html[data-agent-theme="violet"] .agent-shell .agent-sidebar::before {
  border-color: rgba(255, 255, 255, 0.08);
}

html[data-agent-theme="violet"] .agent-shell .agent-brand {
  border-color: rgba(255, 255, 255, 0.16);
  background: linear-gradient(145deg, rgba(255, 255, 255, 0.13), rgba(255, 255, 255, 0.03));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.14), 0 12px 26px rgba(22, 16, 46, 0.32);
}

html[data-agent-theme="violet"] .agent-shell .agent-brand::after {
  border-color: rgba(255, 255, 255, 0.14);
}

/* 金色品牌标在白底上才清楚；深紫底会把金色图案吃掉。 */
html[data-agent-theme="violet"] .agent-shell .agent-brand-mark {
  border-color: rgba(210, 171, 88, 0.45);
  background: radial-gradient(circle at 32% 26%, #ffffff 0%, #fbf6ec 62%, #efe6d4 100%);
  box-shadow: inset 0 1px 0 #ffffff, 0 8px 18px rgba(22, 16, 46, 0.28);
}

html[data-agent-theme="violet"] .agent-shell .agent-brand strong {
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-brand small {
  color: rgba(226, 220, 255, 0.62);
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-home,
html[data-agent-theme="violet"] .agent-shell .agent-menu-parent {
  color: rgba(240, 238, 255, 0.9);
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-home:hover,
html[data-agent-theme="violet"] .agent-shell .agent-menu-home:focus-visible,
html[data-agent-theme="violet"] .agent-shell .agent-menu-parent:hover,
html[data-agent-theme="violet"] .agent-shell .agent-menu-parent:focus-visible {
  border-color: rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-home.is-active {
  border-color: transparent;
  background: linear-gradient(90deg, rgba(167, 150, 255, 0.3), rgba(255, 255, 255, 0.06));
  box-shadow: inset 3px 0 var(--gold-400, #d2ab58), 0 10px 22px rgba(18, 13, 40, 0.3);
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-group.is-open {
  border-color: rgba(255, 255, 255, 0.12);
  background: rgba(255, 255, 255, 0.04);
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-group.is-open .agent-menu-parent {
  background: rgba(167, 150, 255, 0.14);
}

html[data-agent-theme="violet"] .agent-shell .agent-menu-group.is-open .agent-menu-parent.is-active {
  background: rgba(167, 150, 255, 0.2);
}

html[data-agent-theme="violet"] .agent-shell .agent-submenu button,
html[data-agent-theme="violet"] .agent-shell .agent-submenu a {
  color: rgba(238, 235, 255, 0.76);
}

html[data-agent-theme="violet"] .agent-shell .agent-submenu button:hover,
html[data-agent-theme="violet"] .agent-shell .agent-submenu a:hover {
  background: rgba(167, 150, 255, 0.16);
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-submenu button.is-active {
  background: linear-gradient(90deg, rgba(167, 150, 255, 0.32), rgba(255, 255, 255, 0.05));
  color: #ffffff;
  box-shadow: inset 2px 0 var(--gold-400, #d2ab58);
}

html[data-agent-theme="violet"] .agent-shell .agent-submenu button::before,
html[data-agent-theme="violet"] .agent-shell .agent-submenu a::before {
  background: rgba(190, 176, 255, 0.55);
}

/* 顶栏转白：截图里标签栏是白的，只有侧栏是靛紫。 */
html[data-agent-theme="violet"] .agent-shell .agent-topbar {
  border-bottom: 1px solid #e4e7f1;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfe 100%);
  box-shadow: 0 1px 3px rgba(38, 48, 74, 0.05);
}

html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab {
  color: #5a6478;
}

html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab:hover {
  border-color: #d8d1f9;
  background: #f4f2ff;
  color: #3c3453;
}

html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab.is-active,
html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab.is-active:hover {
  border-color: #cdc5f8;
  background: #f4f2ff;
  color: var(--violet-500);
  box-shadow: inset 0 -2px var(--violet-500);
}

html[data-agent-theme="violet"] .agent-shell .agent-tab-close {
  color: rgba(90, 100, 120, 0.5);
}

html[data-agent-theme="violet"] .agent-shell .agent-tab-close:hover,
html[data-agent-theme="violet"] .agent-shell .agent-tab-close:focus-visible {
  background: rgba(91, 79, 214, 0.12);
  color: #3c3453;
}

html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab.is-active .agent-tab-close {
  color: rgba(91, 79, 214, 0.55);
}

html[data-agent-theme="violet"] .agent-shell .agent-topbar .agent-tab.is-active .agent-tab-close:hover {
  background: rgba(91, 79, 214, 0.16);
  color: #3c3453;
}

html[data-agent-theme="violet"] .agent-shell .agent-tabs-scroll {
  border-color: #e4e7f1;
  background: #ffffff;
  color: #64708a;
}

html[data-agent-theme="violet"] .agent-shell .agent-tabs-scroll:hover {
  border-color: #d8d1f9;
  background: #f4f2ff;
  color: var(--violet-500);
}

html[data-agent-theme="violet"] .agent-shell .agent-top-actions button,
html[data-agent-theme="violet"] .agent-shell .agent-top-actions a {
  color: #4a5470;
}

html[data-agent-theme="violet"] .agent-shell .agent-top-actions .notification-action:hover,
html[data-agent-theme="violet"] .agent-shell .agent-top-actions .profile-action:hover {
  color: #1f2740;
}

html[data-agent-theme="violet"] .agent-shell .action-divider {
  background: #e4e7f1;
}

html[data-agent-theme="violet"] .agent-shell .download-action {
  border-color: #d8d1f9;
  background: #f4f2ff !important;
  color: var(--violet-500);
  box-shadow: none;
}

html[data-agent-theme="violet"] .agent-shell .download-action:hover {
  border-color: var(--violet-500);
  background: #ece7ff !important;
  color: #4a3fc0;
}

html[data-agent-theme="violet"] .agent-shell .download-action[aria-expanded="true"] {
  border-color: var(--violet-500);
  background: #ece7ff !important;
  color: #4a3fc0;
}

html[data-agent-theme="violet"] .agent-shell .profile-action {
  color: #4a5470;
}

html[data-agent-theme="violet"] .agent-shell .profile-action[aria-expanded="true"] {
  color: var(--violet-500);
}

html[data-agent-theme="violet"] .agent-shell .profile-avatar {
  border-color: #d8d1f9;
  background: radial-gradient(circle at 34% 28%, #ffffff, #ece8ff);
  color: #4a3fc0;
}

/* 弹层跟着白顶栏走，否则白底上挂一块黑卡片。 */
html[data-agent-theme="violet"] .agent-shell .agent-plugin-popover,
html[data-agent-theme="violet"] .agent-shell .agent-profile-menu {
  border-color: #e4e7f1;
  background: linear-gradient(180deg, #ffffff 0%, #fafbfe 100%);
  color: #26304a;
  box-shadow: 0 26px 60px rgba(38, 48, 74, 0.18), inset 0 1px 0 #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-popover::before,
html[data-agent-theme="violet"] .agent-shell .agent-profile-menu::before {
  border-color: #e4e7f1;
  background: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-heading h2,
html[data-agent-theme="violet"] .agent-shell .agent-plugin-choice-card h3,
html[data-agent-theme="violet"] .agent-shell .agent-profile-summary strong {
  color: #1f2740;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-heading small,
html[data-agent-theme="violet"] .agent-shell .agent-plugin-choice-card p,
html[data-agent-theme="violet"] .agent-shell .agent-plugin-choice-card header p,
html[data-agent-theme="violet"] .agent-shell .agent-profile-summary span {
  color: #64708a;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-choice-card {
  border-color: #e4e7f1;
  background: #f8f9fd;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-primary,
html[data-agent-theme="violet"] .agent-shell .agent-plugin-popover .primary-button {
  border-color: var(--violet-500);
  background: linear-gradient(180deg, #6c5fe0, var(--violet-500));
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-plugin-primary:hover,
html[data-agent-theme="violet"] .agent-shell .agent-plugin-popover .primary-button:hover {
  background: linear-gradient(180deg, var(--violet-500), #4a3fc0);
  color: #ffffff;
}

html[data-agent-theme="violet"] .agent-shell .agent-profile-menu :is(button, a) {
  color: #3b4459;
}

html[data-agent-theme="violet"] .agent-shell .agent-profile-menu :is(button, a):hover {
  background: #f4f2ff;
  color: #1f2740;
}

html[data-agent-theme="violet"] .agent-shell .agent-profile-actions button.danger:hover {
  background: #fff0f2;
  color: #b63549;
}

/* 画布与 iframe 周围留白跟截图一致：淡紫，而不是黑金的纯黑。 */
html[data-agent-theme="violet"] body,
html[data-agent-theme="violet"] .agent-shell {
  background-color: #eef1f9;
}

html[data-agent-theme="violet"] .agent-shell .agent-workspace {
  border-left: 1px solid #dfe3ef;
}

html[data-agent-theme="violet"] .agent-shell :is(button, a, input, select, textarea):focus-visible {
  outline-color: var(--violet-500);
}

html[data-agent-theme="violet"] .agent-shell ::-webkit-scrollbar-thumb {
  background: rgba(91, 79, 214, 0.28);
}