/* ============================================================
   本地化样式文件：替代原 Tailwind CDN 与 Font Awesome CDN
   仅包含 index.html（含 JS 动态生成部分）实际用到的类
   ============================================================ */

/* ── 基础重置（对应 Tailwind Preflight 的最小子集） ── */
*, *::before, *::after {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: #e5e7eb;
}
body {
    margin: 0;
    font-family: ui-sans-serif, system-ui, "Segoe UI", "Microsoft YaHei", sans-serif;
    font-size: 16px;
    line-height: 1.5;
    color: #1f2937;
}
h2, p { margin: 0; }
button {
    font: inherit;
    color: inherit;
    background-color: transparent;
    background-image: none;
    cursor: pointer;
}
input, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: inherit; }

/* ── 布局与显示 ── */
.block { display: block; }
.flex { display: flex; }
.inline-flex { display: inline-flex; }
.flex-col { flex-direction: column; }
.items-center { align-items: center; }
.justify-center { justify-content: center; }
.justify-end { justify-content: flex-end; }
.justify-between { justify-content: space-between; }
.flex-1 { flex: 1 1 0%; }
.shrink-0 { flex-shrink: 0; }
.gap-1 { gap: 0.25rem; }
.gap-2 { gap: 0.5rem; }
.text-center { text-align: center; }
.text-right { text-align: right; }
.whitespace-nowrap { white-space: nowrap; }
.overflow-y-auto { overflow-y: auto; }
.overflow-hidden { overflow: hidden; }
.mx-auto { margin-left: auto; margin-right: auto; }
.max-w-4xl { max-width: 56rem; }
.min-h-0 { min-height: 0; }

/* ── 内边距 ── */
.p-4 { padding: 1rem; }
.p-6 { padding: 1.5rem; }
.px-3 { padding-left: 0.75rem; padding-right: 0.75rem; }
.px-4 { padding-left: 1rem; padding-right: 1rem; }
.px-1\.5 { padding-left: 0.375rem; padding-right: 0.375rem; }
.py-2 { padding-top: 0.5rem; padding-bottom: 0.5rem; }
.py-2\.5 { padding-top: 0.625rem; padding-bottom: 0.625rem; }
.py-3 { padding-top: 0.75rem; padding-bottom: 0.75rem; }
.py-6 { padding-top: 1.5rem; padding-bottom: 1.5rem; }
.py-10 { padding-top: 2.5rem; padding-bottom: 2.5rem; }
.py-0\.5 { padding-top: 0.125rem; padding-bottom: 0.125rem; }
.py-1\.5 { padding-top: 0.375rem; padding-bottom: 0.375rem; }

/* ── 外边距 ── */
.mt-1 { margin-top: 0.25rem; }
.mt-2 { margin-top: 0.5rem; }
.mt-6 { margin-top: 1.5rem; }
.mr-1 { margin-right: 0.25rem; }
.mb-2 { margin-bottom: 0.5rem; }
.mb-3 { margin-bottom: 0.75rem; }
.mb-4 { margin-bottom: 1rem; }
.mb-5 { margin-bottom: 1.25rem; }
.mb-6 { margin-bottom: 1.5rem; }

/* ── 尺寸 ── */
.w-full { width: 100%; }
.w-7 { width: 1.75rem; }
.h-7 { height: 1.75rem; }
.h-screen { height: 100vh; }
.w-40 { width: 10rem; }
.resize-none { resize: none; }

/* ── 字体 ── */
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }

/* ── 文字颜色 ── */
.text-white { color: #ffffff; }
.text-gray-400 { color: #9ca3af; }
.text-gray-500 { color: #6b7280; }
.text-gray-600 { color: #4b5563; }
.text-gray-700 { color: #374151; }
.text-gray-800 { color: #1f2937; }
.text-blue-600 { color: #2563eb; }
.text-blue-700 { color: #1d4ed8; }
.text-green-700 { color: #15803d; }
.text-amber-700 { color: #b45309; }

/* ── 背景颜色 ── */
.bg-white { background-color: #ffffff; }
.bg-gray-50 { background-color: #f9fafb; }
.bg-gray-100 { background-color: #f3f4f6; }
.bg-blue-100 { background-color: #dbeafe; }
.bg-blue-200 { background-color: #bfdbfe; }
.bg-blue-400 { background-color: #60a5fa; }
.bg-blue-600 { background-color: #2563eb; }
.bg-green-50 { background-color: #f0fdf4; }
.bg-green-600 { background-color: #16a34a; }
.bg-purple-600 { background-color: #9333ea; }
.bg-amber-50 { background-color: #fffbeb; }
.bg-amber-100 { background-color: #fef3c7; }

/* ── 边框 ── */
.border { border-width: 1px; }
.border-2 { border-width: 2px; }
.border-dashed { border-style: dashed; }
.border-gray-200 { border-color: #e5e7eb; }
.border-gray-300 { border-color: #d1d5db; }
.border-blue-200 { border-color: #bfdbfe; }
.border-blue-600 { border-color: #2563eb; }
.border-blue-400 { border-color: #60a5fa; }
.border-green-200 { border-color: #bbf7d0; }
.border-amber-200 { border-color: #fde68a; }

/* ── 圆角与阴影 ── */
.rounded { border-radius: 0.25rem; }
.rounded-lg { border-radius: 0.5rem; }
.rounded-xl { border-radius: 0.75rem; }
.rounded-t-xl { border-radius: 0.75rem 0.75rem 0 0; }
.rounded-b-xl { border-radius: 0 0 0.75rem 0.75rem; }
.shadow-md {
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
}

/* ── 透明度与过渡 ── */
.opacity-30 { opacity: 0.3; }
.opacity-50 { opacity: 0.5; }
.opacity-60 { opacity: 0.6; }
.opacity-70 { opacity: 0.7; }
.cursor-not-allowed { cursor: not-allowed; }
.cursor-grab { cursor: grab; }
.transition-colors {
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.transition-opacity { transition: opacity 0.15s ease-in-out; }
.transition-all {
    transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out,
        box-shadow 0.15s ease-in-out, transform 0.15s ease-in-out;
}

/* ── hover 变体 ── */
.hover\:border-blue-400:hover { border-color: #60a5fa; }
.hover\:bg-blue-50:hover { background-color: #eff6ff; }
.hover\:bg-blue-700:hover { background-color: #1d4ed8; }
.hover\:bg-green-50:hover { background-color: #f0fdf4; }
.hover\:bg-green-700:hover { background-color: #15803d; }
.hover\:bg-purple-700:hover { background-color: #7e22ce; }
.hover\:bg-red-50:hover { background-color: #fef2f2; }
.hover\:bg-orange-50:hover { background-color: #fff7ed; }
.hover\:text-blue-600:hover { color: #2563eb; }
.hover\:text-green-600:hover { color: #16a34a; }
.hover\:text-orange-600:hover { color: #ea580c; }
.hover\:text-red-500:hover { color: #ef4444; }

/* ── disabled 变体（置于 hover 之后以保证同权重时优先生效） ── */
.disabled\:bg-gray-400:disabled { background-color: #9ca3af; }
.disabled\:opacity-30:disabled { opacity: 0.3; }
.disabled\:cursor-not-allowed:disabled { cursor: not-allowed; }

/* ── focus 变体（ring 通过 box-shadow 实现） ── */
.focus\:outline-none:focus { outline: none; }
.focus\:ring-1:focus { box-shadow: 0 0 0 1px var(--ring-color, #3b82f6); }
.focus\:ring-2:focus { box-shadow: 0 0 0 2px var(--ring-color, #3b82f6); }
.focus\:ring-blue-400:focus { --ring-color: #60a5fa; }
.focus\:ring-blue-500:focus { --ring-color: #3b82f6; }
.focus\:ring-amber-400:focus { --ring-color: #fbbf24; }

/* ── group-hover 变体 ── */
.group:hover .group-hover\:opacity-100 { opacity: 1; }

/* ── 拖拽排序插入指示线（box-shadow 不影响布局） ── */
.drop-before { box-shadow: 0 -2px 0 0 #3b82f6; }
.drop-after { box-shadow: 0 2px 0 0 #3b82f6; }

/* ── Toast 小弹窗：替代 alert，顶部居中浮现、自动淡出 ── */
.toast {
    position: fixed;
    top: 24px;
    left: 50%;
    z-index: 1000;
    max-width: 80vw;
    padding: 0.625rem 1.25rem;
    background-color: rgba(31, 41, 55, 0.92);
    color: #ffffff;
    font-size: 0.875rem;
    line-height: 1.25rem;
    border-radius: 0.5rem;
    box-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    opacity: 0;
    transform: translateX(-50%) translateY(-8px);
    pointer-events: none;
    transition: opacity 0.25s ease-in-out, transform 0.25s ease-in-out;
}
.toast-show {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* ── 确认对话框：替代 confirm，居中浮现 + 遮罩 ── */
.confirm-mask {
    position: fixed;
    inset: 0;
    z-index: 1001;
    background-color: rgba(0, 0, 0, 0.35);
    opacity: 0;
    transition: opacity 0.2s ease-in-out;
}
.confirm-mask-show { opacity: 1; }

.confirm-dialog {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1002;
    min-width: 320px;
    max-width: 80vw;
    padding: 1.5rem;
    background-color: #ffffff;
    border-radius: 0.75rem;
    box-shadow: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.95);
    transition: opacity 0.2s ease-in-out, transform 0.2s ease-in-out;
}
.confirm-dialog-show {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
}

.confirm-msg {
    font-size: 0.9375rem;
    line-height: 1.5;
    color: #374151;
    margin-bottom: 1.25rem;
}

.confirm-btn-row {
    display: flex;
    justify-content: flex-end;
    gap: 0.5rem;
}

.confirm-btn {
    padding: 0.375rem 1rem;
    border-radius: 0.375rem;
    font-size: 0.875rem;
    font-weight: 500;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out;
}

.confirm-btn-cancel {
    background-color: #f3f4f6;
    color: #4b5563;
}
.confirm-btn-cancel:hover {
    background-color: #e5e7eb;
}

.confirm-btn-ok {
    background-color: #2563eb;
    color: #ffffff;
}
.confirm-btn-ok:hover {
    background-color: #1d4ed8;
}

/* ── 模式切换（AI智能生成 / 文档生成，分段式按钮） ── */
.mode-tab {
    padding: 0.5rem 1.25rem;
    font-size: 0.875rem;
    border-width: 1px;
    border-color: #e5e7eb;
    background-color: #ffffff;
    color: #4b5563;
    font-weight: 500;
    transition: background-color 0.15s ease-in-out, color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.mode-tab:hover {
    background-color: #f3f4f6;
}
.mode-tab-left {
    margin-right: -1px;
    border-radius: 0.5rem 0 0 0.5rem;
}
.mode-tab-right {
    border-radius: 0 0.5rem 0.5rem 0;
}
.mode-tab-active {
    background-color: #2563eb;
    color: #ffffff;
    border-color: #2563eb;
}
.mode-tab-active:hover {
    background-color: #2563eb;
    color: #ffffff;
}

/* 模式面板：蓝色底 + 内嵌白卡（对应 sample 的 bg-blue-400 p-6 rounded-xl） */
.mode-panel {
    padding: 1rem;
    background-color: #60a5fa;
    border-radius: 0.75rem;
}

/* AI智能生成模式的主题输入框：覆盖原“上传参考文件 + 输入主题”合并区域，高度适度压缩；
   display: block 消除行内块基线带来的底部空隙，保证与下方白底行无缝拼接 */
.mode-textarea { min-height: 130px; display: block; }
/* 与下方白底行无缝拼接时去掉底边框，避免整张白卡中间出现断开线 */
.mode-textarea-joint { border-bottom: none; }

/* AI智能生成模式的小巧上传按钮：仅含上传图标，蓝底白图 */
.mode-upload-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0.5rem;
    background-color: #2563eb;
    color: #ffffff;
    border-radius: 0.5rem;
    transition: background-color 0.15s ease-in-out;
}
.mode-upload-btn:hover { background-color: #1d4ed8; }
/* 禁用态（生成中）：灰底且禁止光标，置于 hover 之后以同权重覆盖 */
.mode-upload-btn:disabled {
    background-color: #9ca3af;
    cursor: not-allowed;
}

/* AI模式白底行上传按钮旁的已选参考文件名：过长省略号截断，悬停 title 见全名 */
.ref-file-name {
    max-width: 12rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 0.75rem;
    color: #2563eb;
}

/* 文档生成模式的文件上传框：白底白描边虚线框，覆盖合并区域，高度适度压缩 */
.mode-upload-area {
    min-height: 130px;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 0.9);
    border: 2px dashed #ffffff;
    border-radius: 0.75rem;
    cursor: pointer;
    transition: background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}
.mode-upload-area:hover {
    background-color: #eff6ff;
    border-color: #93c5fd;
}
.mode-upload-area.border-blue-400 {
    border-color: #60a5fa;
    background-color: #eff6ff;
}
/* 与下方大模型切换白底行无缝拼接时：去掉底部虚线边框、仅保留上圆角（思路同 mode-textarea-joint） */
.mode-upload-area-joint {
    border-bottom: none;
    border-radius: 0.75rem 0.75rem 0 0;
}
/* 文档生成模式的大模型切换行：白卡底部，边框与上方选择行/内容区闭合为整体，避免灰边在接缝处中断 */
.mode-model-row {
    background-color: rgba(255, 255, 255, 0.9);
    border: 1px solid #e5e7eb;
    border-top: none;
}

/* 文档生成模式的优化方式单选框组：横排置于底部行左侧，深色文字适配白底，选中态跟随主题蓝 */
.mode-optimize-group {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.mode-optimize-group label {
    display: inline-flex;
    align-items: center;
    gap: 0.25rem;
    font-size: 0.875rem;
    color: #374151;
    cursor: pointer;
}
.mode-optimize-group input[type="radio"] {
    margin: 0;
    accent-color: #2563eb;
    cursor: pointer;
}

/* 文档生成模式的输入方式选择行：作为白卡顶部与下方上传框/输入框无缝拼接（同半透明白底，仅上圆角）；
   内部按钮复用 mode-tab 分段式样式，缩小内边距并三均分宽度，相邻按钮 -1px 重叠避免双线边框；
   左右侧边框与文本直输框一致，接缝处不留底边框 */
.mode-src-row {
    padding: 0.5rem;
    background-color: rgba(255, 255, 255, 0.9);
    border: 1px solid #e5e7eb;
    border-bottom: none;
    border-radius: 0.75rem 0.75rem 0 0;
}
.mode-src-row .mode-tab {
    flex: 1 1 0;
    margin: 0;
    padding: 0.375rem 0.25rem;
    font-size: 0.75rem;
    text-align: center;
}
.mode-src-row .mode-tab + .mode-tab {
    margin-left: -1px;
}
/* 选择行下方的上传框/文本直输框：统一为灰色细边框并去掉接缝处圆角与重复边框，保持拼接无缝；
   注意：上传框与输入框在 DOM 中同时存在（互斥隐藏），输入框须用通用兄弟选择器 ~ 才能命中 */
.mode-src-row + .mode-upload-area {
    border: 1px solid #e5e7eb;
    border-top: none;
    border-radius: 0;
}
.mode-src-row ~ .mode-doc-textarea {
    border-top: none;
    border-radius: 0;
}

/* 文档生成模式的文本直输框：与上传框同底色的白卡，与下方大模型切换行无缝拼接（思路同 mode-upload-area-joint） */
.mode-doc-textarea {
    min-height: 130px;
    display: block;
    width: 100%;
    padding: 1rem;
    background-color: rgba(255, 255, 255, 0.9);
    color: #374151;
    font-size: 0.875rem;
    border: 1px solid #e5e7eb;
    border-bottom: none;
    border-radius: 0.75rem 0.75rem 0 0;
    resize: none;
}
/* 聚焦时不加光晕：卡片自身描边已足够定位输入区域，点击出现边框会显得突兀 */
.mode-doc-textarea:focus {
    outline: none;
}

/* AI智能生成模式的个性化参数布局：4 列网格，第一排 4 项 / 第二排 2 项按列上下对齐 */
.mode-param-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    column-gap: 1rem;
    row-gap: 1rem;
}
/* 参数下拉框文字与前导说明标签统一为 text-xs（0.75rem），仅作用于参数网格，不影响白底行内的大模型下拉框 */
.mode-param-grid .mode-param-select { font-size: 0.75rem; }

/* AI智能生成模式的个性化参数下拉框：紧凑小号，透明底 + 白字融入蓝底面板 */
.mode-param-select {
    padding: 0.25rem 0.5rem;
    font-size: 0.875rem;
    background-color: transparent;
    color: #ffffff;
    border: 1px solid #e5e7eb;
    border-radius: 0.375rem;
    cursor: pointer;
}
/* 展开的选项列表回退为深色文字，避免部分浏览器下白字不可见 */
.mode-param-select option {
    background-color: #ffffff;
    color: #374151;
}
.mode-param-select:focus {
    outline: none;
    box-shadow: 0 0 0 2px #3b82f6;
}
/* 白底行内的大模型下拉框变体：深色文字保证可读（置于基类之后以同权重覆盖） */
.mode-param-select-dark { color: #374151; }

/* 大模型下拉框内嵌官方 logo（本地 frontend/images/logo 下的 svg）：
   logo 靠左内嵌展示，文字左移避让，品牌类随选中值切换 */
.mode-select-logo {
    padding-left: 1.9rem;
    background-repeat: no-repeat;
    background-position: 0.5rem center;
    background-size: auto 0.875rem;
}
.model-select-deepseek { background-image: url('/static/images/logo/deepseek-logo.svg'); }
.model-select-qwen { background-image: url('/static/images/logo/qwen-logo.svg'); }

/* ── 响应式（md ≥ 768px） ── */
@media (min-width: 768px) {
    .md\:p-8 { padding: 2rem; }
}

/* ============================================================
   图标（mask 方案：颜色跟随 currentColor，可随 hover:text-* 变色）
   替代原 Font Awesome，图标形状来自 Font Awesome Free Solid 路径
   ============================================================ */
.icon {
    display: inline-block;
    width: 1em;
    height: 1em;
    background-color: currentColor;
    vertical-align: -0.125em;
    -webkit-mask-image: var(--icon-img);
    mask-image: var(--icon-img);
    -webkit-mask-size: contain;
    mask-size: contain;
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
}
.icon-plus {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M256 80c0-17.7-14.3-32-32-32s-32 14.3-32 32V224H48c-17.7 0-32 14.3-32 32s14.3 32 32 32H192V432c0 17.7 14.3 32 32 32s32-14.3 32-32V288H400c17.7 0 32-14.3 32-32s-14.3-32-32-32H256V80z'/%3E%3C/svg%3E");
}
.icon-trash {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 448 512'%3E%3Cpath d='M135.2 17.7L128 32H32C14.3 32 0 46.3 0 64S14.3 96 32 96H416c17.7 0 32-14.3 32-32s-14.3-32-32-32H320l-7.2-14.3C307.4 6.8 296.3 0 284.2 0H163.8c-12.1 0-23.2 6.8-28.6 17.7zM416 128H32L53.2 467c1.6 25.3 22.6 45 47.9 45H346.9c25.3 0 46.3-19.7 47.9-45L416 128z'/%3E%3C/svg%3E");
}
.icon-arrow-up {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M214.6 41.4c-12.5-12.5-32.8-12.5-45.3 0l-160 160c-12.5 12.5-12.5 32.8 0 45.3s32.8 12.5 45.3 0L160 141.2V448c0 17.7 14.3 32 32 32s32-14.3 32-32V141.2L329.4 246.6c12.5 12.5 32.8 12.5 45.3 0s12.5-32.8 0-45.3l-160-160z'/%3E%3C/svg%3E");
}
.icon-arrow-down {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M169.4 470.6c12.5 12.5 32.8 12.5 45.3 0l160-160c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L224 350.8V64c0-17.7-14.3-32-32-32s-32 14.3-32 32V350.8L54.6 246.6c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l160 160z'/%3E%3C/svg%3E");
}
.icon-download {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M288 32c0-17.7-14.3-32-32-32s-32 14.3-32 32V274.7l-73.4-73.4c-12.5-12.5-32.8-12.5-45.3 0s-12.5 32.8 0 45.3l128 128c12.5 12.5 32.8 12.5 45.3 0l128-128c12.5-12.5 12.5-32.8 0-45.3s-32.8-12.5-45.3 0L288 274.7V32zM64 352c-35.3 0-64 28.7-64 64v32c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V416c0-35.3-28.7-64-64-64H346.5l-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352H64zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z'/%3E%3C/svg%3E");
}
.icon-check {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M256 512A256 256 0 1 0 256 0a256 256 0 1 0 0 512zM369 209L241 337c-9.4 9.4-24.6 9.4-33.9 0l-64-64c-9.4-9.4-9.4-24.6 0-33.9s24.6-9.4 33.9 0l47 47L335 175c9.4-9.4 24.6-9.4 33.9 0s9.4 24.6 0 33.9z'/%3E%3C/svg%3E");
}
.icon-mouse {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M160 0c-14.2 0-28.1 5.7-38.4 15.9L66.2 71.4c-12.5 12.3-12.6 32.6-.2 45.1s32.6 12.6 45.1 .2l28.9-28.6V256c0 17.7 14.3 32 32 32s32-14.3 32-32V88.1l28.9 28.6c12.5 12.4 32.7 12.3 45.1-.2s12.3-32.7-.2-45.1L198.4 15.9C188.1 5.7 174.2 0 160 0zM32 256c-17.7 0-32 14.3-32 32c0 123.7 100.3 224 224 224c17.7 0 32-14.3 32-32s-14.3-32-32-32c-88.4 0-160-71.6-160-160c0-17.7-14.3-32-32-32z'/%3E%3C/svg%3E");
}
.icon-file {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 384 512'%3E%3Cpath d='M0 64C0 28.7 28.7 0 64 0H224V128c0 17.7 14.3 32 32 32H384V448c0 35.3-28.7 64-64 64H64c-35.3 0-64-28.7-64-64V64zm384 64H256V0L384 128z'/%3E%3C/svg%3E");
}
.icon-upload {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 512 512'%3E%3Cpath d='M288 109.3V352c0 17.7-14.3 32-32 32s-32-14.3-32-32V109.3l-73.4 73.4c-12.5 12.5-32.8 12.5-45.3 0s-12.5-32.8 0-45.3l128-128c12.5-12.5 32.8-12.5 45.3 0l128 128c12.5 12.5 12.5 32.8 0 45.3s-32.8 12.5-45.3 0L288 109.3zM64 352c-35.3 0-64 28.7-64 64v32c0 35.3 28.7 64 64 64H448c35.3 0 64-28.7 64-64V416c0-35.3-28.7-64-64-64H346.5l-45.3 45.3c-25 25-65.5 25-90.5 0L165.5 352H64zm368 56a24 24 0 1 1 0 48 24 24 0 1 1 0-48z'/%3E%3C/svg%3E");
}
.icon-grip {
    --icon-img: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 320 512'%3E%3Cpath d='M40 352l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0c-22.1 0-40-17.9-40-40l0-48c0-22.1 17.9-40 40-40zm192 0l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0c-22.1 0-40-17.9-40-40l0-48c0-22.1 17.9-40 40-40zM40 320c-22.1 0-40-17.9-40-40l0-48c0-22.1 17.9-40 40-40l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0zM232 192l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0c-22.1 0-40-17.9-40-40l0-48c0-22.1 17.9-40 40-40zM40 160c-22.1 0-40-17.9-40-40L0 72C0 49.9 17.9 32 40 32l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0zM232 32l48 0c22.1 0 40 17.9 40 40l0 48c0 22.1-17.9 40-40 40l-48 0c-22.1 0-40-17.9-40-40l0-48c0-22.1 17.9-40 40-40z'/%3E%3C/svg%3E");
}

/* ============================================================
   联网搜索开关（Toggle Switch）
   置于 modelActions 内、模型下拉框左侧；白底行内深色文字
   ============================================================ */
.web-search-toggle {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    cursor: pointer;
    user-select: none;
}
/* 隐藏原生 checkbox，用 slider 伪元素实现开关视觉 */
.web-search-toggle input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.web-search-slider {
    position: relative;
    display: inline-block;
    width: 2rem;
    height: 1.125rem;
    background-color: #d1d5db;
    border-radius: 9999px;
    transition: background-color 0.2s ease-in-out;
    flex-shrink: 0;
}
.web-search-slider::before {
    content: "";
    position: absolute;
    top: 0.125rem;
    left: 0.125rem;
    width: 0.875rem;
    height: 0.875rem;
    background-color: #ffffff;
    border-radius: 50%;
    transition: transform 0.2s ease-in-out;
}
.web-search-toggle input[type="checkbox"]:checked + .web-search-slider {
    background-color: #2563eb;
}
.web-search-toggle input[type="checkbox"]:checked + .web-search-slider::before {
    transform: translateX(0.875rem);
}
.web-search-text {
    font-size: 0.75rem;
    color: #374151;
    white-space: nowrap;
}

/* ============================================================
   联网搜索参考结果折叠面板
   置于大纲区上方，默认收起；有结果时显示，无结果时隐藏
   ============================================================ */
.web-search-panel-header {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    width: 100%;
    padding: 0.5rem 0.75rem;
    background-color: #f9fafb;
    border: 1px solid #e5e7eb;
    border-radius: 0.5rem;
    cursor: pointer;
    font-size: 0.875rem;
    color: #374151;
    transition: background-color 0.15s ease-in-out;
}
.web-search-panel-header:hover {
    background-color: #f3f4f6;
}
/* 箭头图标：收起时旋转 -90°（朝右），展开时归位（朝下） */
.web-search-panel-arrow {
    font-size: 0.75rem;
    transition: transform 0.2s ease-in-out;
    transform: rotate(-90deg);
}
.web-search-panel-header[aria-expanded="true"] .web-search-panel-arrow {
    transform: rotate(0deg);
}
.web-search-panel-body {
    max-height: 15rem;
    overflow-y: auto;
    border: 1px solid #e5e7eb;
    border-top: none;
    border-radius: 0 0 0.5rem 0.5rem;
    background-color: #ffffff;
}
.web-search-result-card {
    padding: 0.625rem 0.75rem;
    border-bottom: 1px solid #f3f4f6;
}
.web-search-result-card:last-child {
    border-bottom: none;
}
.web-search-result-title {
    font-size: 0.8125rem;
    font-weight: 600;
    color: #1f2937;
    margin-bottom: 0.25rem;
}
.web-search-result-summary {
    font-size: 0.75rem;
    color: #6b7280;
    line-height: 1.5;
    margin-bottom: 0.25rem;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.web-search-result-meta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.6875rem;
    color: #9ca3af;
}
.web-search-result-meta a {
    color: #2563eb;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 20rem;
}
.web-search-result-meta a:hover {
    text-decoration: underline;
}

/* ── 显示控制兜底：置于文件末尾，保证同权重下后定义覆盖任何 display 工具类/组件类（如 .flex、.mode-doc-textarea 的 display: block） */
.hidden { display: none; }
