扩展知识库索引任务和 RAG 检索支持增量入库和文档去重,优 化本体检测和规则匹配精度,前端设置页面拆分为 LLM、邮件 和 Hermes 员工同步子面板并重构样式,新增日志详情组件和 知识入库日志模型,补充单元测试覆盖。
1507 lines
28 KiB
CSS
1507 lines
28 KiB
CSS
.travel-calculator-mini-head span {
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
font-weight: 750;
|
|
}
|
|
|
|
.travel-calculator-form {
|
|
display: grid;
|
|
grid-template-columns: 92px minmax(0, 1fr);
|
|
gap: 8px;
|
|
}
|
|
|
|
.travel-calculator-field {
|
|
display: grid;
|
|
gap: 6px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.travel-calculator-field span {
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.travel-calculator-field input {
|
|
width: 100%;
|
|
min-height: 36px;
|
|
padding: 0 10px;
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
border-radius: 10px;
|
|
background: #fff;
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.travel-calculator-field input:focus {
|
|
border-color: rgba(59, 130, 246, 0.46);
|
|
box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.1);
|
|
outline: none;
|
|
}
|
|
|
|
.travel-calculator-error {
|
|
margin: 0;
|
|
color: #dc2626;
|
|
font-size: 11px;
|
|
font-weight: 750;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.composer-date-mode-tabs {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 8px;
|
|
padding: 4px;
|
|
border-radius: 12px;
|
|
background: rgba(241, 245, 249, 0.92);
|
|
}
|
|
|
|
.composer-date-mode-btn {
|
|
min-height: 34px;
|
|
border: 0;
|
|
border-radius: 10px;
|
|
background: transparent;
|
|
color: #64748b;
|
|
font-size: 12px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.composer-date-mode-btn.active {
|
|
background: #fff;
|
|
color: #0f172a;
|
|
box-shadow: 0 4px 10px rgba(148, 163, 184, 0.18);
|
|
}
|
|
|
|
.composer-date-fields {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
|
|
.composer-date-fields-range {
|
|
grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
|
|
align-items: end;
|
|
gap: 8px;
|
|
}
|
|
|
|
.composer-date-field {
|
|
display: grid;
|
|
gap: 6px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.composer-date-field span {
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.composer-date-field input {
|
|
width: 100%;
|
|
min-height: 36px;
|
|
padding: 0 10px;
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
border-radius: 10px;
|
|
background: #fff;
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.composer-date-range-sep {
|
|
align-self: center;
|
|
color: #94a3b8;
|
|
font-size: 12px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.composer-date-hint {
|
|
margin: 0;
|
|
color: #dc2626;
|
|
font-size: 11px;
|
|
line-height: 1.5;
|
|
}
|
|
|
|
.composer-date-popover-actions {
|
|
display: flex;
|
|
justify-content: flex-end;
|
|
gap: 8px;
|
|
}
|
|
|
|
.composer-date-cancel-btn,
|
|
.composer-date-apply-btn {
|
|
min-height: 34px;
|
|
padding: 0 14px;
|
|
border-radius: 10px;
|
|
font-size: 12px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.composer-date-cancel-btn {
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
background: #fff;
|
|
color: #64748b;
|
|
}
|
|
|
|
.composer-date-apply-btn {
|
|
border: 0;
|
|
background: linear-gradient(135deg, #22c55e, #10b981);
|
|
color: #fff;
|
|
}
|
|
|
|
.composer-date-apply-btn:disabled {
|
|
opacity: 0.48;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.composer-shell {
|
|
min-width: 0;
|
|
min-height: var(--composer-control-size, 44px);
|
|
border: 1px solid rgba(214, 225, 234, 0.95);
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.98);
|
|
box-shadow:
|
|
0 10px 22px rgba(226, 232, 240, 0.24),
|
|
0 1px 4px rgba(15, 23, 42, 0.03);
|
|
}
|
|
|
|
.composer-shell-body {
|
|
min-height: var(--composer-control-size, 44px);
|
|
display: flex;
|
|
align-items: center;
|
|
flex-wrap: wrap;
|
|
gap: 6px;
|
|
padding: 4px 12px;
|
|
}
|
|
|
|
.composer-biz-time-tag {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
max-width: min(100%, 320px);
|
|
min-height: 28px;
|
|
padding: 0 8px 0 10px;
|
|
border-radius: 999px;
|
|
border: 1px solid rgba(59, 130, 246, 0.28);
|
|
background: linear-gradient(135deg, rgba(59, 130, 246, 0.14), rgba(16, 185, 129, 0.12));
|
|
color: #1d4ed8;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
flex: none;
|
|
}
|
|
|
|
.composer-biz-time-tag i {
|
|
font-size: 14px;
|
|
color: #2563eb;
|
|
}
|
|
|
|
.composer-biz-time-tag-label {
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.composer-biz-time-tag-remove {
|
|
width: 18px;
|
|
height: 18px;
|
|
display: grid;
|
|
place-items: center;
|
|
padding: 0;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.72);
|
|
color: #3b82f6;
|
|
flex: none;
|
|
}
|
|
|
|
.composer-biz-time-tag-remove:disabled {
|
|
opacity: 0.48;
|
|
}
|
|
|
|
.composer-files-panel {
|
|
display: grid;
|
|
gap: 10px;
|
|
padding: 14px;
|
|
border: 1px solid rgba(226, 232, 240, 0.9);
|
|
border-radius: 18px;
|
|
background: linear-gradient(180deg, rgba(248, 251, 255, 0.92) 0%, rgba(242, 247, 251, 0.78) 100%);
|
|
}
|
|
|
|
.composer-files-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 10px;
|
|
}
|
|
|
|
.composer-files-head strong {
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.composer-files-actions {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
justify-content: flex-end;
|
|
}
|
|
|
|
.composer-file-link {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 0;
|
|
border: 0;
|
|
background: transparent;
|
|
color: #2563eb;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.composer-file-link.danger {
|
|
color: #dc2626;
|
|
}
|
|
|
|
.composer-file-link:disabled {
|
|
opacity: 0.48;
|
|
}
|
|
|
|
.composer-file-chip-row {
|
|
display: flex;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.composer-file-chip {
|
|
max-width: min(100%, 280px);
|
|
}
|
|
|
|
.file-chip.summary {
|
|
border: 1px dashed rgba(96, 165, 250, 0.34);
|
|
background: rgba(239, 246, 255, 0.92);
|
|
cursor: pointer;
|
|
}
|
|
|
|
.file-chip-label {
|
|
min-width: 0;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.file-chip-remove {
|
|
width: 18px;
|
|
height: 18px;
|
|
display: grid;
|
|
place-items: center;
|
|
padding: 0;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.82);
|
|
color: inherit;
|
|
flex: none;
|
|
}
|
|
|
|
.file-chip-remove:disabled {
|
|
opacity: 0.48;
|
|
}
|
|
|
|
.composer-files-expanded {
|
|
display: grid;
|
|
gap: 8px;
|
|
max-height: 176px;
|
|
overflow-y: auto;
|
|
padding-right: 2px;
|
|
}
|
|
|
|
.composer-expanded-file {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 10px;
|
|
padding: 10px 12px;
|
|
border-radius: 14px;
|
|
border: 1px solid rgba(219, 230, 240, 0.92);
|
|
background: rgba(255, 255, 255, 0.88);
|
|
}
|
|
|
|
.composer-expanded-file-copy {
|
|
min-width: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
color: #334155;
|
|
}
|
|
|
|
.composer-expanded-file-copy span {
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.composer-expanded-file-remove {
|
|
width: 28px;
|
|
height: 28px;
|
|
display: grid;
|
|
place-items: center;
|
|
border: 0;
|
|
border-radius: 10px;
|
|
background: rgba(248, 250, 252, 0.92);
|
|
color: #64748b;
|
|
}
|
|
|
|
.composer-expanded-file-remove:disabled {
|
|
opacity: 0.48;
|
|
}
|
|
|
|
.composer-shell textarea {
|
|
flex: 1 1 120px;
|
|
width: auto;
|
|
min-width: 0;
|
|
min-height: 36px;
|
|
max-height: 120px;
|
|
resize: none;
|
|
border: 0;
|
|
padding: 8px 4px;
|
|
background: transparent;
|
|
color: #0f172a;
|
|
font-size: var(--wb-fs-composer);
|
|
line-height: 20px;
|
|
}
|
|
|
|
.composer-shell textarea::placeholder {
|
|
color: #94a3b8;
|
|
}
|
|
|
|
.composer-shell textarea:focus {
|
|
outline: none;
|
|
}
|
|
|
|
.composer-shell textarea:disabled {
|
|
color: #94a3b8;
|
|
}
|
|
|
|
.composer-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
}
|
|
|
|
.composer-row .composer-shell {
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.composer-side-btn,
|
|
.composer-row .tool-btn,
|
|
.composer-row .send-btn {
|
|
width: var(--composer-control-size, 44px);
|
|
height: var(--composer-control-size, 44px);
|
|
display: grid;
|
|
place-items: center;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
flex: none;
|
|
}
|
|
|
|
.tool-btn {
|
|
background: #ffffff;
|
|
color: #475569;
|
|
font-size: var(--wb-fs-tool-icon);
|
|
border: 1px solid #dbe6f0;
|
|
box-shadow: 0 4px 12px rgba(241, 245, 249, 0.76);
|
|
}
|
|
|
|
.tool-btn:disabled {
|
|
opacity: 0.48;
|
|
cursor: not-allowed;
|
|
}
|
|
|
|
.send-btn {
|
|
background: linear-gradient(135deg, #22c55e, #10b981);
|
|
color: #fff;
|
|
font-size: var(--wb-fs-tool-icon);
|
|
box-shadow: 0 8px 18px rgba(16, 185, 129, 0.18);
|
|
}
|
|
|
|
.send-btn:disabled {
|
|
opacity: 0.48;
|
|
cursor: not-allowed;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.insight-panel {
|
|
position: relative;
|
|
display: grid;
|
|
grid-template-rows: auto minmax(0, 1fr);
|
|
width: 100%;
|
|
height: 100%;
|
|
overflow: hidden;
|
|
background:
|
|
linear-gradient(180deg, rgba(239, 245, 243, 0.9) 0%, rgba(231, 238, 236, 0.84) 100%);
|
|
opacity: 1;
|
|
transform: translateX(0) scale(1);
|
|
transform-origin: right center;
|
|
transition:
|
|
opacity 260ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
transform 320ms cubic-bezier(0.22, 1, 0.36, 1),
|
|
box-shadow 320ms cubic-bezier(0.22, 1, 0.36, 1);
|
|
will-change: transform, opacity;
|
|
}
|
|
|
|
.insight-panel-shell.collapsed .insight-panel {
|
|
opacity: 0;
|
|
transform: translateX(44px) scale(0.985);
|
|
pointer-events: none;
|
|
}
|
|
|
|
.insight-panel::before {
|
|
content: "";
|
|
position: absolute;
|
|
top: -18px;
|
|
right: -34px;
|
|
width: 240px;
|
|
height: 150px;
|
|
border-radius: 0 0 0 140px;
|
|
background:
|
|
radial-gradient(circle at 0 100%, rgba(16, 185, 129, 0.14), transparent 54%),
|
|
linear-gradient(135deg, rgba(16, 185, 129, 0.14), rgba(96, 165, 250, 0.06));
|
|
opacity: 0.9;
|
|
pointer-events: none;
|
|
}
|
|
|
|
.insight-head {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 14px;
|
|
padding: 18px 18px 14px;
|
|
border-bottom: 1px solid rgba(205, 215, 224, 0.82);
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.insight-head.review-mode {
|
|
justify-content: space-between;
|
|
}
|
|
|
|
.insight-head-eyebrow {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 10px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.insight-head-badge {
|
|
min-height: 24px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0 10px;
|
|
border-radius: 999px;
|
|
background: rgba(240, 253, 244, 0.95);
|
|
color: #059669;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
border: 1px solid rgba(16, 185, 129, 0.12);
|
|
}
|
|
|
|
.review-insight-title-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.review-insight-title-copy {
|
|
min-width: 0;
|
|
}
|
|
|
|
.review-insight-title-copy h3 {
|
|
margin: 0;
|
|
}
|
|
|
|
.review-insight-tools {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
flex: 0 0 auto;
|
|
align-self: center;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn {
|
|
width: 28px;
|
|
height: 28px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 999px;
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
background: rgba(248, 250, 252, 0.96);
|
|
color: #94a3b8;
|
|
font-size: 14px;
|
|
flex: 0 0 auto;
|
|
transition: border-color 0.18s ease, background 0.18s ease, color 0.18s ease, transform 0.18s ease;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.available {
|
|
border-color: rgba(245, 158, 11, 0.28);
|
|
background: rgba(255, 247, 237, 0.94);
|
|
color: #d97706;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.active {
|
|
border-color: rgba(217, 119, 6, 0.42);
|
|
background: rgba(254, 243, 199, 0.98);
|
|
color: #b45309;
|
|
box-shadow: 0 6px 14px rgba(245, 158, 11, 0.16);
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.risk.available {
|
|
border-color: rgba(239, 68, 68, 0.28);
|
|
background: rgba(254, 242, 242, 0.96);
|
|
color: #dc2626;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.risk.active {
|
|
border-color: rgba(220, 38, 38, 0.42);
|
|
background: rgba(254, 226, 226, 0.98);
|
|
color: #b91c1c;
|
|
box-shadow: 0 6px 14px rgba(239, 68, 68, 0.16);
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.flow.available {
|
|
border-color: rgba(37, 99, 235, 0.28);
|
|
background: rgba(239, 246, 255, 0.96);
|
|
color: #2563eb;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.flow.active {
|
|
border-color: rgba(37, 99, 235, 0.42);
|
|
background: rgba(219, 234, 254, 0.98);
|
|
color: #1d4ed8;
|
|
box-shadow: 0 6px 14px rgba(37, 99, 235, 0.16);
|
|
}
|
|
|
|
.review-insight-switch-icon-btn.flow.running i {
|
|
animation: flowPulse 1.2s ease-in-out infinite;
|
|
}
|
|
|
|
.review-insight-switch-icon-btn:hover:not(:disabled) {
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.review-insight-switch-icon-btn:disabled {
|
|
cursor: not-allowed;
|
|
opacity: 1;
|
|
color: #cbd5e1;
|
|
background: rgba(248, 250, 252, 0.9);
|
|
}
|
|
|
|
.intent-pill {
|
|
min-height: 30px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0 13px;
|
|
border-radius: 999px;
|
|
font-size: var(--wb-fs-chip);
|
|
font-weight: 800;
|
|
}
|
|
|
|
.intent-pill.welcome {
|
|
background: #eef2ff;
|
|
color: #4f46e5;
|
|
}
|
|
|
|
.intent-pill.draft {
|
|
background: #ecfdf5;
|
|
color: #059669;
|
|
}
|
|
|
|
.intent-pill.approval {
|
|
background: #fff7ed;
|
|
color: #ea580c;
|
|
}
|
|
|
|
.intent-pill.recognition {
|
|
background: #eff6ff;
|
|
color: #2563eb;
|
|
}
|
|
|
|
.intent-pill.note {
|
|
background: #fdf2f8;
|
|
color: #db2777;
|
|
}
|
|
|
|
.insight-head h3 {
|
|
margin-top: 10px;
|
|
color: #0f172a;
|
|
font-size: var(--wb-fs-insight-title);
|
|
font-weight: 900;
|
|
line-height: 1.25;
|
|
}
|
|
|
|
.insight-head p {
|
|
margin-top: 6px;
|
|
color: #64748b;
|
|
font-size: var(--wb-fs-insight-body);
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.confidence-card {
|
|
min-width: 92px;
|
|
padding: 10px 12px;
|
|
border-radius: 14px;
|
|
background: rgba(250, 252, 252, 0.9);
|
|
border: 1px solid rgba(202, 213, 223, 0.9);
|
|
box-shadow: 0 8px 18px rgba(203, 213, 225, 0.3);
|
|
text-align: right;
|
|
}
|
|
|
|
.confidence-card span {
|
|
display: block;
|
|
color: #94a3b8;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.confidence-card strong {
|
|
display: block;
|
|
margin-top: 4px;
|
|
color: #0f172a;
|
|
font-size: var(--wb-fs-insight-num);
|
|
font-weight: 900;
|
|
}
|
|
|
|
.insight-body {
|
|
min-height: 0;
|
|
display: grid;
|
|
align-content: start;
|
|
gap: 12px;
|
|
padding: 14px 18px 18px;
|
|
overflow-y: auto;
|
|
position: relative;
|
|
z-index: 1;
|
|
}
|
|
|
|
.review-side-card {
|
|
display: grid;
|
|
gap: 10px;
|
|
padding: 14px;
|
|
border-radius: 18px;
|
|
border: 1px solid rgba(197, 209, 221, 0.88);
|
|
background: rgba(249, 251, 251, 0.88);
|
|
box-shadow: 0 10px 20px rgba(226, 232, 240, 0.3);
|
|
}
|
|
|
|
.review-side-overview-card {
|
|
gap: 12px;
|
|
background: linear-gradient(180deg, rgba(251, 252, 252, 0.92) 0%, rgba(240, 246, 244, 0.86) 100%);
|
|
}
|
|
|
|
.review-side-intent-row {
|
|
display: flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
color: #475569;
|
|
font-size: var(--wb-fs-metric);
|
|
}
|
|
|
|
.review-side-intent-row i {
|
|
color: #059669;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.review-side-intent-row strong {
|
|
color: #0f172a;
|
|
font-size: var(--wb-fs-bubble);
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-side-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 10px;
|
|
}
|
|
|
|
.review-side-grid.compact {
|
|
gap: 8px;
|
|
}
|
|
|
|
.review-side-metric-card {
|
|
display: grid;
|
|
grid-template-columns: 32px minmax(0, 1fr);
|
|
gap: 8px;
|
|
align-items: start;
|
|
padding: 12px;
|
|
border-radius: 14px;
|
|
border: 1px solid rgba(206, 216, 226, 0.88);
|
|
background: rgba(251, 252, 252, 0.82);
|
|
position: relative;
|
|
cursor: pointer;
|
|
transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
|
|
}
|
|
|
|
.review-side-metric-card.wide {
|
|
grid-column: 1 / -1;
|
|
min-height: 104px;
|
|
}
|
|
|
|
.review-side-metric-card.invalid {
|
|
border-color: rgba(239, 68, 68, 0.34);
|
|
background: rgba(254, 242, 242, 0.72);
|
|
}
|
|
|
|
.review-side-metric-card.editable:hover,
|
|
.review-side-metric-card.editing {
|
|
border-color: rgba(16, 185, 129, 0.34);
|
|
background: #ffffff;
|
|
box-shadow: 0 4px 12px rgba(16, 185, 129, 0.08);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.review-side-metric-icon {
|
|
width: 32px;
|
|
height: 32px;
|
|
display: grid;
|
|
place-items: center;
|
|
border-radius: 8px;
|
|
background: #f1f5f9;
|
|
border: 1px solid transparent;
|
|
color: #64748b;
|
|
font-size: 15px;
|
|
transition: all 0.2s ease;
|
|
}
|
|
|
|
.review-side-metric-card.editable:hover .review-side-metric-icon,
|
|
.review-side-metric-card.editing .review-side-metric-icon {
|
|
color: #059669;
|
|
border-color: rgba(16, 185, 129, 0.22);
|
|
background: #ecfdf5;
|
|
}
|
|
|
|
.review-side-metric-card.invalid .review-side-metric-icon {
|
|
color: #ef4444;
|
|
border-color: rgba(239, 68, 68, 0.22);
|
|
background: #fef2f2;
|
|
}
|
|
|
|
.review-side-metric-copy {
|
|
display: grid;
|
|
gap: 4px;
|
|
}
|
|
|
|
.review-side-metric-copy small {
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.review-side-metric-copy strong {
|
|
color: #0f172a;
|
|
font-size: var(--wb-fs-metric-strong);
|
|
font-weight: 850;
|
|
line-height: 1.35;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.review-inline-input {
|
|
width: 100%;
|
|
min-height: 34px;
|
|
padding: 0 10px;
|
|
border: 1px solid rgba(16, 185, 129, 0.2);
|
|
border-radius: 10px;
|
|
background: rgba(255, 255, 255, 0.96);
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.review-inline-textarea {
|
|
min-height: 82px;
|
|
padding: 9px 10px;
|
|
resize: vertical;
|
|
line-height: 1.55;
|
|
font-family: inherit;
|
|
}
|
|
|
|
.review-inline-input.invalid {
|
|
border-color: rgba(239, 68, 68, 0.4);
|
|
color: #b91c1c;
|
|
box-shadow: 0 0 0 3px rgba(239, 68, 68, 0.08);
|
|
}
|
|
|
|
.review-inline-input:focus {
|
|
outline: none;
|
|
border-color: rgba(16, 185, 129, 0.42);
|
|
box-shadow: 0 0 0 3px rgba(16, 185, 129, 0.08);
|
|
}
|
|
|
|
.review-inline-select-list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 6px;
|
|
}
|
|
|
|
.review-inline-select-option {
|
|
min-height: 28px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0 10px;
|
|
border-radius: 999px;
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
background: rgba(255, 255, 255, 0.96);
|
|
color: #475569;
|
|
font-size: 11px;
|
|
font-weight: 700;
|
|
}
|
|
|
|
.review-inline-select-option.active {
|
|
border-color: rgba(16, 185, 129, 0.36);
|
|
background: rgba(240, 253, 244, 0.94);
|
|
color: #047857;
|
|
}
|
|
|
|
.review-inline-error {
|
|
color: #dc2626;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
line-height: 1.45;
|
|
}
|
|
|
|
.review-side-edit-hint {
|
|
position: absolute;
|
|
top: 8px;
|
|
right: 8px;
|
|
min-height: 20px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0 6px;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.92);
|
|
border: 1px solid rgba(226, 232, 240, 0.92);
|
|
color: #94a3b8;
|
|
font-size: 10px;
|
|
font-weight: 800;
|
|
opacity: 0;
|
|
transition: opacity 0.18s ease;
|
|
}
|
|
|
|
.review-side-edit-hint.upload {
|
|
color: #059669;
|
|
}
|
|
|
|
.review-side-metric-card:hover .review-side-edit-hint,
|
|
.review-side-metric-card.editing .review-side-edit-hint {
|
|
opacity: 1;
|
|
}
|
|
|
|
.review-side-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
}
|
|
|
|
.review-side-head strong {
|
|
color: #0f172a;
|
|
font-size: 14px;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.review-side-head-copy {
|
|
display: grid;
|
|
gap: 4px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.review-side-head-copy p {
|
|
margin: 0;
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
line-height: 1.55;
|
|
}
|
|
|
|
.review-side-confidence {
|
|
color: #10b981;
|
|
font-size: 12px;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.review-side-category-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 10px;
|
|
}
|
|
|
|
.review-side-category-card {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 8px;
|
|
padding: 12px;
|
|
min-height: 66px;
|
|
border-radius: 14px;
|
|
border: 1px solid rgba(226, 232, 240, 0.94);
|
|
background: rgba(255, 255, 255, 0.68);
|
|
cursor: pointer;
|
|
transition: border-color 0.18s ease, background 0.18s ease;
|
|
}
|
|
|
|
.review-side-category-card.active {
|
|
border-color: rgba(52, 211, 153, 0.62);
|
|
background: rgba(240, 253, 244, 0.9);
|
|
box-shadow: inset 0 0 0 1px rgba(16, 185, 129, 0.08);
|
|
}
|
|
|
|
.review-side-category-copy {
|
|
display: grid;
|
|
gap: 4px;
|
|
min-width: 0;
|
|
}
|
|
|
|
.review-side-category-copy strong {
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 850;
|
|
line-height: 1.35;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.review-side-category-copy p {
|
|
margin: 0;
|
|
color: #64748b;
|
|
font-size: 10px;
|
|
line-height: 1.4;
|
|
}
|
|
|
|
.review-side-group-check {
|
|
color: #10b981;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.review-other-category-popover {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
gap: 8px;
|
|
padding-top: 2px;
|
|
}
|
|
|
|
.review-other-category-option {
|
|
min-height: 30px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
padding: 0 12px;
|
|
border-radius: 999px;
|
|
border: 1px solid rgba(203, 213, 225, 0.92);
|
|
background: rgba(255, 255, 255, 0.94);
|
|
color: #475569;
|
|
font-size: 11px;
|
|
font-weight: 750;
|
|
}
|
|
|
|
.review-other-category-option.active {
|
|
border-color: rgba(16, 185, 129, 0.36);
|
|
background: rgba(240, 253, 244, 0.94);
|
|
color: #047857;
|
|
}
|
|
|
|
.review-side-risk-card {
|
|
background: linear-gradient(180deg, rgba(255, 255, 255, 0.84) 0%, rgba(255, 249, 238, 0.8) 100%);
|
|
}
|
|
|
|
.review-side-risk-summary {
|
|
margin: 0;
|
|
color: #334155;
|
|
font-size: 12px;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.review-side-risk-list {
|
|
display: grid;
|
|
gap: 8px;
|
|
margin: 0;
|
|
}
|
|
|
|
.review-side-risk-item {
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: 30px minmax(0, 1fr) auto;
|
|
align-items: center;
|
|
gap: 10px;
|
|
min-height: 66px;
|
|
padding: 10px;
|
|
border: 1px solid rgba(226, 232, 240, 0.95);
|
|
border-radius: 14px;
|
|
background: rgba(255, 255, 255, 0.76);
|
|
color: #334155;
|
|
text-align: left;
|
|
transition: border-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
|
|
}
|
|
|
|
.review-side-risk-item:hover {
|
|
border-color: rgba(249, 115, 22, 0.38);
|
|
box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.review-side-risk-icon {
|
|
width: 30px;
|
|
height: 30px;
|
|
display: grid;
|
|
place-items: center;
|
|
border-radius: 10px;
|
|
background: rgba(14, 165, 233, 0.12);
|
|
color: #0284c7;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.review-side-risk-item.medium .review-side-risk-icon {
|
|
background: rgba(245, 158, 11, 0.14);
|
|
color: #b45309;
|
|
}
|
|
|
|
.review-side-risk-item.high .review-side-risk-icon {
|
|
background: rgba(239, 68, 68, 0.12);
|
|
color: #dc2626;
|
|
}
|
|
|
|
.review-side-risk-item.low .review-side-risk-icon {
|
|
background: rgba(14, 165, 233, 0.12);
|
|
color: #0284c7;
|
|
}
|
|
|
|
.review-side-risk-copy {
|
|
min-width: 0;
|
|
display: grid;
|
|
gap: 3px;
|
|
}
|
|
|
|
.review-side-risk-copy strong {
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 900;
|
|
}
|
|
|
|
.review-side-risk-copy p {
|
|
margin: 0;
|
|
color: #64748b;
|
|
font-size: 12px;
|
|
line-height: 1.55;
|
|
}
|
|
|
|
.review-side-risk-meta {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 2px;
|
|
color: #64748b;
|
|
font-size: 11px;
|
|
font-weight: 850;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.review-side-link {
|
|
width: fit-content;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 4px;
|
|
padding: 0;
|
|
border: 0;
|
|
background: transparent;
|
|
color: #059669;
|
|
font-size: 12px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-side-link:disabled {
|
|
opacity: 0.5;
|
|
}
|
|
|
|
.review-side-empty {
|
|
display: grid;
|
|
justify-items: start;
|
|
gap: 8px;
|
|
padding: 14px;
|
|
border: 1px dashed rgba(203, 213, 225, 0.92);
|
|
border-radius: 16px;
|
|
background: rgba(255, 255, 255, 0.52);
|
|
}
|
|
|
|
.review-side-empty-icon {
|
|
width: 36px;
|
|
height: 36px;
|
|
display: grid;
|
|
place-items: center;
|
|
border-radius: 12px;
|
|
background: rgba(240, 244, 248, 0.96);
|
|
color: #94a3b8;
|
|
font-size: 18px;
|
|
}
|
|
|
|
.review-side-empty strong {
|
|
color: #475569;
|
|
font-size: 13px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-side-empty p {
|
|
margin: 0;
|
|
color: #94a3b8;
|
|
font-size: 12px;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.review-side-save-pill {
|
|
position: sticky;
|
|
bottom: 0;
|
|
justify-self: end;
|
|
min-height: 36px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 6px;
|
|
padding: 0 14px;
|
|
border: 1px solid rgba(16, 185, 129, 0.22);
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.94);
|
|
color: #059669;
|
|
font-size: 12px;
|
|
font-weight: 850;
|
|
box-shadow: 0 8px 18px rgba(15, 23, 42, 0.08);
|
|
}
|
|
|
|
.review-side-save-pill:disabled {
|
|
opacity: 0.5;
|
|
box-shadow: none;
|
|
}
|
|
|
|
.review-document-switch-card {
|
|
gap: 14px;
|
|
}
|
|
|
|
.review-ticket-drawer {
|
|
min-height: 0;
|
|
}
|
|
|
|
.review-document-switch-head {
|
|
align-items: flex-start;
|
|
}
|
|
|
|
.review-document-nav {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
padding: 4px;
|
|
border-radius: 999px;
|
|
background: rgba(255, 255, 255, 0.92);
|
|
border: 1px solid rgba(226, 232, 240, 0.92);
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.review-document-nav span {
|
|
color: #334155;
|
|
font-size: 11px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-document-nav-btn {
|
|
width: 28px;
|
|
height: 28px;
|
|
display: grid;
|
|
place-items: center;
|
|
border: 0;
|
|
border-radius: 999px;
|
|
background: rgba(241, 245, 249, 0.96);
|
|
color: #334155;
|
|
}
|
|
|
|
.review-document-nav-btn:disabled {
|
|
opacity: 0.4;
|
|
}
|
|
|
|
.review-document-stage {
|
|
display: grid;
|
|
gap: 12px;
|
|
min-height: 0;
|
|
}
|
|
|
|
.review-document-stage-head {
|
|
display: flex;
|
|
align-items: flex-start;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
}
|
|
|
|
.review-document-stage-copy {
|
|
min-width: 0;
|
|
display: grid;
|
|
gap: 6px;
|
|
}
|
|
|
|
.review-document-stage-copy strong {
|
|
color: #0f172a;
|
|
font-size: 13px;
|
|
font-weight: 850;
|
|
line-height: 1.5;
|
|
word-break: break-word;
|
|
}
|
|
|
|
.review-document-index-chip {
|
|
width: fit-content;
|
|
min-height: 24px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0 10px;
|
|
border-radius: 999px;
|
|
background: rgba(236, 253, 245, 0.92);
|
|
color: #059669;
|
|
font-size: 11px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-document-meta-chip-row {
|
|
display: flex;
|
|
gap: 8px;
|
|
flex-wrap: wrap;
|
|
}
|
|
|
|
.review-document-meta-chip {
|
|
min-height: 26px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
padding: 0 10px;
|
|
border-radius: 999px;
|
|
background: rgba(248, 250, 252, 0.94);
|
|
border: 1px solid rgba(226, 232, 240, 0.92);
|
|
color: #475569;
|
|
font-size: 11px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.review-document-meta-chip.confidence {
|
|
background: rgba(236, 253, 245, 0.92);
|
|
color: #047857;
|
|
border-color: rgba(167, 243, 208, 0.92);
|
|
}
|
|
|
|
.review-document-scroll {
|
|
display: grid;
|
|
gap: 12px;
|
|
max-height: 430px;
|
|
overflow-y: auto;
|
|
padding-right: 4px;
|
|
}
|
|
|
|
.review-document-preview-card {
|
|
min-height: 168px;
|
|
overflow: hidden;
|
|
border-radius: 16px;
|
|
border: 1px solid rgba(226, 232, 240, 0.94);
|
|
background: linear-gradient(180deg, #f8fafc 0%, #eef2f7 100%);
|
|
}
|
|
|
|
.review-document-preview-card.clickable {
|
|
cursor: zoom-in;
|
|
}
|
|
|
|
.review-document-preview-card.clickable img {
|
|
transition: transform 0.18s ease;
|
|
}
|
|
|
|
.review-document-preview-card.clickable:hover img {
|
|
transform: scale(1.02);
|
|
}
|
|
|
|
.review-document-preview-card.image img {
|
|
display: block;
|
|
width: 100%;
|
|
height: 188px;
|
|
object-fit: cover;
|
|
}
|
|
|
|
.review-document-preview-placeholder {
|
|
min-height: 168px;
|
|
display: grid;
|
|
place-items: center;
|
|
gap: 6px;
|
|
padding: 18px;
|
|
text-align: center;
|
|
}
|
|
|
|
.review-document-preview-placeholder i {
|
|
color: #64748b;
|
|
font-size: 34px;
|
|
}
|
|
|
|
.review-document-preview-placeholder strong {
|
|
color: #0f172a;
|
|
font-size: 13px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.review-document-preview-placeholder p {
|
|
margin: 0;
|
|
color: #64748b;
|
|
font-size: 12px;
|
|
line-height: 1.65;
|
|
}
|
|
|
|
.review-document-edit-grid {
|
|
display: grid;
|
|
grid-template-columns: repeat(2, minmax(0, 1fr));
|
|
gap: 10px;
|
|
}
|
|
|
|
.review-document-edit-field {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
|
|
.review-document-edit-field span {
|
|
color: #334155;
|
|
font-size: 12px;
|
|
font-weight: 800;
|
|
}
|
|
|
|
.review-document-edit-field input,
|
|
.review-document-edit-field textarea {
|
|
width: 100%;
|
|
border: 1px solid rgba(219, 230, 240, 0.96);
|
|
border-radius: 14px;
|
|
background: rgba(255, 255, 255, 0.96);
|
|
color: #0f172a;
|
|
font-size: 13px;
|
|
line-height: 1.6;
|
|
padding: 10px 12px;
|
|
resize: vertical;
|
|
}
|
|
|
|
.review-document-edit-field input:focus,
|
|
.review-document-edit-field textarea:focus {
|
|
outline: none;
|
|
border-color: rgba(16, 185, 129, 0.36);
|
|
box-shadow: 0 0 0 4px rgba(16, 185, 129, 0.08);
|
|
}
|
|
|
|
.review-document-edit-field textarea {
|
|
min-height: 88px;
|
|
}
|
|
|
|
.review-document-warning-list {
|
|
display: grid;
|
|
gap: 8px;
|
|
}
|
|
|
|
.review-document-warning-item {
|
|
display: grid;
|
|
grid-template-columns: 18px minmax(0, 1fr);
|
|
gap: 8px;
|
|
align-items: start;
|
|
padding: 10px 12px;
|
|
border-radius: 14px;
|
|
background: rgba(255, 247, 237, 0.92);
|
|
border: 1px solid rgba(253, 186, 116, 0.6);
|
|
color: #c2410c;
|
|
font-size: 12px;
|
|
line-height: 1.6;
|
|
}
|
|
|
|
.review-side-empty.compact {
|
|
padding: 12px;
|
|
}
|
|
|
|
.insight-card {
|
|
padding: 16px;
|
|
border: 1px solid #e7eef6;
|
|
border-radius: 20px;
|
|
background: rgba(255, 255, 255, 0.95);
|
|
box-shadow: 0 14px 24px rgba(241, 245, 249, 0.86);
|
|
}
|
|
|
|
.insight-card.primary {
|
|
background: linear-gradient(180deg, #ffffff 0%, #f9fbff 100%);
|
|
}
|
|
|
|
.card-head {
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
gap: 12px;
|
|
margin-bottom: 14px;
|
|
}
|
|
|
|
.card-head h4 {
|
|
color: #0f172a;
|
|
font-size: 15px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.knowledge-question-list {
|
|
display: grid;
|
|
gap: 10px;
|
|
}
|
|
|
|
.knowledge-question-btn {
|
|
width: 100%;
|
|
display: grid;
|
|
grid-template-columns: 28px minmax(0, 1fr) 18px;
|
|
align-items: center;
|
|
gap: 10px;
|
|
padding: 12px 14px;
|
|
border: 1px solid rgba(226, 232, 240, 0.92);
|
|
border-radius: 16px;
|
|
background: rgba(248, 250, 252, 0.86);
|
|
color: #1e293b;
|
|
text-align: left;
|
|
transition: border-color 0.18s ease, background 0.18s ease, transform 0.18s ease;
|
|
}
|
|
|
|
.knowledge-question-btn:hover:not(:disabled) {
|
|
border-color: rgba(16, 185, 129, 0.3);
|
|
background: rgba(240, 253, 244, 0.9);
|
|
transform: translateY(-1px);
|
|
}
|
|
|
|
.knowledge-question-btn:disabled {
|
|
opacity: 0.48;
|
|
cursor: not-allowed;
|
|
transform: none;
|
|
}
|
|
|
|
.knowledge-question-btn i {
|
|
justify-self: end;
|
|
color: #059669;
|
|
font-size: 16px;
|
|
}
|
|
|
|
.knowledge-question-index {
|
|
width: 28px;
|
|
height: 28px;
|
|
display: inline-flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
border-radius: 999px;
|
|
background: rgba(226, 232, 240, 0.9);
|
|
color: #0f172a;
|
|
font-size: 12px;
|
|
font-weight: 850;
|
|
}
|
|
|
|
.knowledge-question-index.gold {
|
|
background: linear-gradient(135deg, #fbbf24, #f59e0b);
|
|
color: #7c2d12;
|
|
box-shadow: 0 6px 14px rgba(245, 158, 11, 0.22);
|
|
}
|
|
|
|
.knowledge-question-index.silver {
|
|
background: linear-gradient(135deg, #e2e8f0, #cbd5e1);
|
|
color: #334155;
|
|
box-shadow: 0 6px 14px rgba(148, 163, 184, 0.18);
|
|
}
|
|
|