/* /Layout/CommandPalette.razor.rz.scp.css */
/* Ctrl+K 命令面板浮层。⚠ 本文件同样受 G2 约束（禁裸色值），一律 var(--app-*)。
   ⚠ 刻意不用 @media/@keyframes——WebScopedCssSelectorMatchTests 对 .razor.css 里出现的
   嵌套 at-rule 一律响亮报红（提取器只解析扁平 selector { ... }，见该护栏类头注释：T14 fix
   round 3 把"看不懂就静默放行"改成了"看不懂就报红"，专门点名 T15/T16 是最可能踩中它的两个
   任务）。宽度用 min() 做出响应式效果、开合不做过渡动画（Blazor 的 @if 是整段插入/移除 DOM，
   没有中间态可过渡），完全绕开这条陷阱，不需要挪任何规则去全局 shell.css。 */

.cmdk-backdrop[b-czwdg29pqo] {
  position: fixed;
  inset: 0;
  background: var(--app-scrim);
  display: flex;
  justify-content: center;
  align-items: flex-start;
  padding-top: 12vh;
  /* ⚠ 必须高于 iframe（ChatRenderer.razor 里的 <iframe> 无 position/z-index，默认 static
     层叠上下文；理论上任何 position!=static 的元素都会盖住它）。这里给一个明显高于
     primitives.css 既有 .modal-scrim(100) 的值，防"命令面板与既有确认弹窗恰好同时出现"时
     层叠打架，也给真机验证留冗余。
     ⚠ 只能真机验证——原生 iframe 不像桌面端原生 WebView 那样必然盖住 DOM 浮层，这里做不到
     自动化验证，见任务报告"真机核验"一节。 */
  z-index: 1000;
}

.cmdk-panel[b-czwdg29pqo] {
  width: min(560px, 92vw);
  max-height: min(420px, 70vh);
  display: flex;
  flex-direction: column;
  background: var(--app-surface-overlay);
  border: 1px solid var(--app-border-strong);
  border-radius: var(--app-radius-xl);
  box-shadow: var(--app-shadow-xl);
  overflow: hidden;
}

/* 复用 primitives.css 的 .field 打底（边框/圆角/内边距/字号基线），这里只覆盖"面板顶部搜索框
   不需要独立圆角边框、字号更大"这几点差异——两个类同时挂在同一个元素上（class="cmdk-input field"）。 */
.cmdk-input[b-czwdg29pqo] {
  border: none;
  border-bottom: 1px solid var(--app-border-subtle);
  border-radius: 0;
  font-size: var(--app-font-size-title);
  padding: var(--app-space-lg) var(--app-space-xl);
}
.cmdk-input:focus[b-czwdg29pqo] { outline: none; box-shadow: none; }

.cmdk-list[b-czwdg29pqo] {
  list-style: none;
  overflow-y: auto;
  padding: var(--app-space-sm);
}

.cmdk-item[b-czwdg29pqo] {
  display: flex;
  align-items: center;
  gap: var(--app-space-md);
  padding: var(--app-space-sm) var(--app-space-md-lg);
  border-radius: var(--app-radius-md);
  cursor: pointer;
  color: var(--app-text-primary);
}
.cmdk-item:hover[b-czwdg29pqo],
.cmdk-item-active[b-czwdg29pqo] { background: var(--app-state-hover); }
.cmdk-item-active[b-czwdg29pqo] { color: var(--app-accent); }

.cmdk-item-icon[b-czwdg29pqo] {
  width: 16px; height: 16px; flex-shrink: 0;
  fill: none; stroke: currentColor; stroke-width: 1.75;
  stroke-linecap: round; stroke-linejoin: round;
}
.cmdk-item-title[b-czwdg29pqo] { font-size: var(--app-font-size-body-lg); font-weight: 600; flex-shrink: 0; }
.cmdk-item-desc[b-czwdg29pqo] {
  font-size: var(--app-font-size-caption);
  color: var(--app-text-muted);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cmdk-empty[b-czwdg29pqo] {
  padding: var(--app-space-xxl);
  text-align: center;
  color: var(--app-text-muted);
  font-size: var(--app-font-size-body-lg);
}
/* /Layout/NavRail.razor.rz.scp.css */
/* 组件内部布局补丁。⚠ 本文件同样受 G2 约束（禁裸色值），一律 var(--app-*)。
   shell.css 已经定义了 .nav-rail / .nav-rail-mid / .nav-item / .nav-item-label /
   .nav-divider 等跨组件共享的视觉语言（三段式 Grid 的行高即由它规定）；这里只补
   shell.css 没有覆盖的、纯属本组件内部子容器排布细节——两者不重叠、不冲突。 */

/* 顶部：命令面板入口，单枚图标按钮居中即可 —— 不需要 .nav-rail-mid 那种多按钮纵向堆叠。 */
.nav-rail-top[b-tvonp0jmfd] {
    display: flex;
    justify-content: center;
    padding: var(--app-space-md-lg) 0 var(--app-space-xs);
}

/* 中部：让 shell.css 的 .nav-rail-mid 在滚动之外再具备纵向堆叠 + 间距（多个 .nav-item
   按钮 + 分隔线 + 钉选区占位按声明顺序纵向排列）。 */
.nav-rail-mid[b-tvonp0jmfd] {
    display: flex;
    flex-direction: column;
    gap: var(--app-space-xs);
    padding-top: var(--app-space-xs);
}

/* 底部：设置项 + 账户区占位，纵向堆叠，贴着轨道底部留白。 */
.nav-rail-bottom[b-tvonp0jmfd] {
    display: flex;
    flex-direction: column;
    padding-bottom: var(--app-space-md-lg);
}

/* 账户区（T14 接线）：内容纵向堆叠，复用 .nav-item 的图标+微标签视觉语言
   （shell.css 里 .nav-item 已经是通用的"图标在上、微标签在下"竖排按钮，账户区的
   "官网首页"/"登出" 按钮直接套用即可，不需要另起一套样式）。
   ⚠ .nav-user/.nav-user-name 不放在本文件——那两个元素的标记写在 MainLayout.razor
   （作为 AccountSlot 这个 RenderFragment 传给本组件），Blazor CSS 隔离的 scope 属性按
   物理文件在编译期注入，MainLayout.razor 没有配套的 .razor.css，那两个元素根本拿不到
   任何 scope 属性；若规则写在这里（NavRail.razor.css），编译出来的选择器会被追加
   NavRail 自己的 scope（如 `.nav-user[b-xxxxx]`），永远匹配不到没有该属性的真实 DOM——
   T14 审查 Minor 2 整改时踩过这个坑（选择器编译通过、样式却全部不生效，截断三件套
   /字号/颜色悄悄失效），已改放 shell.css（全局、无 scope 问题），与 AccountSlot 里
   两个按钮复用全局 .nav-item 的处理方式保持一致。见 shell.css 该规则处的注释。 */
.nav-account-slot[b-tvonp0jmfd] {
    display: flex;
    flex-direction: column;
}
/* /Layout/SectionNav.razor.rz.scp.css */
/* 组件内部布局补丁。⚠ 本文件同样受 G2 约束（禁裸色值），一律 var(--app-*)。
   shell.css 已经定义了 .settings-nav / .settings-nav-item / .section-tabbar / .section-tab
   这批跨组件共享的视觉语言（宽度/圆角/悬停态/选中态，与桌面端 AppStyles.axaml 的对应
   Selector 逐条一致）；这里只补 shell.css 没有覆盖的、纯属本组件内部子容器排布细节的部分
   （标题头、分组标题的间距）——两者不重叠、不冲突，同 NavRail.razor.css 的既有分工。 */

/* 顶部标题头（"设置" + 一句提示），只在设置形态出现。 */
.settings-nav-header[b-za5qz4m9rc] {
    padding: var(--app-space-xl) var(--app-space-xl) var(--app-space-xs);
}
.settings-nav-header h2[b-za5qz4m9rc] {
    font-size: var(--app-font-size-title);
    font-weight: 700;
    color: var(--app-text-primary);
}
.settings-nav-hint[b-za5qz4m9rc] {
    font-size: var(--app-font-size-caption);
    color: var(--app-text-muted);
    margin-top: var(--app-space-xs);
}

/* 每个分组：标题 + 组内叶子按钮纵向堆叠，底部留白与下一组分开。 */
.settings-group[b-za5qz4m9rc] {
    padding: 0 0 var(--app-space-md);
}
.settings-group-title[b-za5qz4m9rc] {
    font-size: var(--app-font-size-caption);
    font-weight: 600;
    color: var(--app-text-muted);
    padding: var(--app-space-md) var(--app-space-xl) var(--app-space-xs);
}
/* /Pages/Chat.razor.rz.scp.css */
/* 3 栏布局：左会话列表 / 右(顶选择器 + 中渲染器 + 底输入)。
   寄宿于 .app-shell-body(shell.css，T14：flex:1; overflow:auto; padding:var(--app-space-xxl)
   即 24px)，靠父级 flex 撑满。⚠ 本行注释此前写的是重建前的旧类名 .main-content(padding:32px)
   ——T14 把 MainLayout 重建成 .app-shell 三区布局后，宿主类名与内边距数值都变了，这里改准。
   本页自身不滚动(overflow:hidden)，唯一滚动区是 .chat-render —— 避免外层
   .app-shell-body 与内部渲染器双滚动条。height:100% 占满父内容盒(替代旧 calc 魔法值)。 */
.chat-page[b-9i3hntanrl] {
    display: flex;
    height: 100%;
    overflow: hidden;
    gap: 16px;
}

/* 页面标题：Routes.razor 的 <FocusOnNavigate Selector="h1" /> 要求每个导航目的地有一个
   <h1>，否则导航后焦点无处可落。本页此前没有——3 栏工作区布局里没有天然的"标题位"，
   补一个小号、不打乱既有视觉密度的标题条，纯为满足这条不变量，不追求视觉存在感。 */
.chat-page-title[b-9i3hntanrl] {
    padding: 10px 16px 0;
    font-size: var(--app-font-size-subtitle);
    font-weight: 600;
    color: var(--app-text-primary);
}

/* 错误横幅(初始化失败 / 发送失败) */
.error-banner[b-9i3hntanrl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 16px;
    background: var(--app-danger-subtle);
    color: var(--app-danger-text);
    border-bottom: 1px solid var(--app-danger-border);
    font-size: 0.85rem;
}

.banner-close[b-9i3hntanrl] {
    border: none;
    background: transparent;
    color: inherit;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    opacity: 0.6;
    padding: 0 4px;
}

.banner-close:hover[b-9i3hntanrl] {
    opacity: 1;
}

/* ── 左：会话列表 ───────────────────────────── */
.session-list[b-9i3hntanrl] {
    width: 240px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--app-border-subtle);
    border-radius: var(--app-radius-lg);
    background: var(--app-surface-subtle);
    overflow: hidden;
}

.session-list-header[b-9i3hntanrl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px;
    font-weight: 600;
    border-bottom: 1px solid var(--app-border-subtle);
}

.btn-new[b-9i3hntanrl] {
    width: 28px;
    height: 28px;
    border: none;
    border-radius: var(--app-radius-lg);
    background: var(--app-accent);
    color: var(--app-text-on-accent);
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
}

.btn-new:hover[b-9i3hntanrl] {
    background: var(--app-accent-hover);
}

.session-items[b-9i3hntanrl] {
    list-style: none;
    flex: 1;
    overflow-y: auto;
    padding: 6px;
}

.session-item[b-9i3hntanrl] {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 9px 10px;
    border-radius: var(--app-radius-lg);
    cursor: pointer;
    color: var(--app-text-primary);
}

.session-item:hover[b-9i3hntanrl] {
    background: var(--app-surface-muted);
}

.session-item.active[b-9i3hntanrl] {
    background: var(--app-accent);
    color: var(--app-text-on-accent);
}

.session-title[b-9i3hntanrl] {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.btn-del[b-9i3hntanrl] {
    border: none;
    background: transparent;
    color: inherit;
    opacity: 0.5;
    font-size: 1.1rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
}

.btn-del:hover[b-9i3hntanrl] {
    opacity: 1;
}

.session-empty[b-9i3hntanrl] {
    padding: 12px;
    color: var(--app-text-muted);
    text-align: center;
    font-size: 0.85rem;
}

/* ── 回收站 ─────────────────────────────────── */

/* 会话列表底部的入口：贴底、与列表用细线分隔，不抢主区注意力。 */
.session-archive-entry[b-9i3hntanrl] {
    flex-shrink: 0;
    border: none;
    border-top: 1px solid var(--app-border-subtle);
    background: transparent;
    color: var(--app-text-secondary);
    font-size: 0.85rem;
    text-align: left;
    padding: 10px 14px;
    cursor: pointer;
}

.session-archive-entry:hover[b-9i3hntanrl] {
    background: var(--app-surface-muted);
    color: var(--app-text-primary);
}

.btn-back[b-9i3hntanrl],
.btn-clear[b-9i3hntanrl] {
    border: none;
    background: transparent;
    color: var(--app-text-secondary);
    cursor: pointer;
    padding: 0 4px;
    line-height: 1;
}

.btn-back[b-9i3hntanrl] {
    font-size: 1.3rem;
}

.btn-clear[b-9i3hntanrl] {
    font-size: 0.8rem;
}

.btn-back:hover[b-9i3hntanrl],
.btn-clear:hover:not(:disabled)[b-9i3hntanrl] {
    color: var(--app-text-primary);
}

.btn-clear:disabled[b-9i3hntanrl] {
    opacity: 0.4;
    cursor: not-allowed;
}

/* 归档条目不可点进（会话已不在活动列表里），去掉手型指针避免暗示可切换。 */
.session-item.archived[b-9i3hntanrl] {
    cursor: default;
    color: var(--app-text-secondary);
}

/* 修复轮 Minor 8：.session-item:hover 的整行高亮背景不该在归档态生效——那是"可点进"的暗示，
   而归档条目恰恰不可点进。选择器权重按 3 类叠加特意压过 .session-item:hover(2 类)。 */
.session-item.archived:hover[b-9i3hntanrl] {
    background: transparent;
}

.archived-actions[b-9i3hntanrl] {
    display: flex;
    flex-shrink: 0;
    gap: 2px;
}

.btn-restore[b-9i3hntanrl] {
    border: none;
    background: transparent;
    color: inherit;
    opacity: 0.6;
    font-size: 1rem;
    line-height: 1;
    cursor: pointer;
    padding: 0 4px;
}

.btn-restore:hover[b-9i3hntanrl] {
    opacity: 1;
    color: var(--app-accent);
}

/* ── 右：主区 ───────────────────────────────── */
.chat-main[b-9i3hntanrl] {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    border: 1px solid var(--app-border-subtle);
    border-radius: var(--app-radius-lg);
    overflow: hidden;
}

.chat-selectors[b-9i3hntanrl] {
    display: flex;
    gap: 20px;
    padding: 12px 16px;
    border-bottom: 1px solid var(--app-border-subtle);
    background: var(--app-surface-subtle);
}

.chat-selectors label[b-9i3hntanrl] {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 0.85rem;
    color: var(--app-text-secondary);
}

.chat-selectors select[b-9i3hntanrl] {
    padding: 6px 10px;
    border: 1px solid var(--app-border-subtle);
    border-radius: var(--app-radius-lg);
    background: var(--app-surface-base);
    color: var(--app-text-primary);
    font-size: 0.85rem;
}

/* 渲染器(iframe) 必须有确定高度，否则会塌陷 */
.chat-render[b-9i3hntanrl] {
    flex: 1;
    min-height: 0;
    position: relative;
}

.chat-render[b-9i3hntanrl]  iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}

.chat-input[b-9i3hntanrl] {
    display: flex;
    gap: 10px;
    padding: 12px 16px;
    border-top: 1px solid var(--app-border-subtle);
    background: var(--app-surface-subtle);
}

.chat-input textarea[b-9i3hntanrl] {
    flex: 1;
    padding: 10px 14px;
    border: 1px solid var(--app-border-subtle);
    border-radius: var(--app-radius-lg);
    font-size: 0.9rem;
    font-family: inherit;
    resize: none;
}

.chat-input textarea:focus[b-9i3hntanrl] {
    outline: none;
    border-color: var(--app-accent);
}

.btn-send[b-9i3hntanrl],
.btn-stop[b-9i3hntanrl] {
    padding: 10px 20px;
    border: none;
    border-radius: var(--app-radius-lg);
    color: var(--app-text-on-accent);
    font-size: 0.9rem;
    cursor: pointer;
}

.btn-send[b-9i3hntanrl] {
    background: var(--app-accent);
}

.btn-send:hover:not(:disabled)[b-9i3hntanrl] {
    background: var(--app-accent-hover);
}

.btn-send:disabled[b-9i3hntanrl] {
    opacity: 0.5;
    cursor: not-allowed;
}

.btn-stop[b-9i3hntanrl] {
    background: var(--app-danger-strong);
}

.btn-stop:hover[b-9i3hntanrl] {
    background: var(--app-danger-text);
}