test

css/components.css

@@ -0,0 +1,437 @@
+/* 组件样式 */
+
+/* 消息提示样式 */
+#ant-message-container {
+    position: fixed;
+    top: 20px;
+    left: 50%;
+    transform: translateX(-50%);
+    z-index: 9999;
+    width: fit-content;
+    max-width: 80%;
+}
+
+.ant-message {
+    background: #fff2f0;
+    border: 1px solid #ffccc7;
+    border-radius: 4px;
+    padding: 10px 16px;
+    margin-bottom: 10px;
+    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
+    display: flex;
+    align-items: center;
+    animation: antMessageFadeIn 0.3s ease-in-out;
+    font-size: 14px;
+    line-height: 1.5;
+}
+
+.ant-message-success {
+    background: #f6ffed;
+    border-color: #b7eb8f;
+}
+
+.ant-message-warning {
+    background: #fffbe6;
+    border-color: #ffe58f;
+}
+
+.ant-message-info {
+    background: #e6f7ff;
+    border-color: #91d5ff;
+}
+
+.ant-message-error {
+    background: #fff2f0;
+    border-color: #ffccc7;
+}
+
+.ant-message-icon {
+    margin-right: 8px;
+    font-weight: bold;
+    font-size: 16px;
+}
+
+.ant-message-success .ant-message-icon {
+    color: #52c41a;
+}
+
+.ant-message-warning .ant-message-icon {
+    color: #faad14;
+}
+
+.ant-message-info .ant-message-icon {
+    color: #1890ff;
+}
+
+.ant-message-error .ant-message-icon {
+    color: #ff4d4f;
+}
+
+@keyframes antMessageFadeIn {
+    from { opacity: 0; transform: translateY(-100%); }
+    to { opacity: 1; transform: translateY(0); }
+}
+
+@keyframes antMessageFadeOut {
+    from { opacity: 1; transform: translateY(0); }
+    to { opacity: 0; transform: translateY(-100%); }
+}
+
+/* 按钮样式 */
+.btn-primary {
+    background-color: #2563eb;
+    color: white;
+    font-weight: 600;
+    padding: 0.5rem 1rem;
+    border-radius: 0.5rem;
+    border: none;
+    cursor: pointer;
+    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.btn-primary:hover {
+    background-color: #1d4ed8;
+}
+
+.btn-secondary {
+    background-color: #e5e7eb;
+    color: #374151;
+    font-weight: 500;
+    padding: 0.5rem 1rem;
+    border-radius: 0.5rem;
+    border: 1px solid #d1d5db;
+    cursor: pointer;
+    transition: background-color 150ms cubic-bezier(0.4, 0, 0.2, 1);
+}
+
+.btn-secondary:hover {
+    background-color: #f3f4f6;
+}
+
+/* 输入框样式 */
+.input-field {
+    flex: 1;
+    background-color: transparent;
+    padding: 0.5rem 0.5rem;
+    outline: none;
+}
+
+.input-container {
+    display: flex;
+    align-items: center;
+    border: 1px solid #d1d5db;
+    border-radius: 0.25rem;
+    /* padding: 0.25rem 0.5rem; */
+    background-color: #f3f4f6;
+    margin-top: 10px;
+}
+
+.input-container:focus-within {
+    border-color: #3b82f6;
+}
+
+.company-list-container {
+    padding: 0 !important;
+    margin: 0 !important;
+    border: 0 !important;
+    border-radius: unset !important;
+    border-color: unset !important;
+}
+
+.company-item {
+    padding: 8px 10px !important;
+    margin-top: 6px !important;
+    font-size: 16px !important;
+    background-color: unset !important;
+    cursor: pointer;
+}
+
+.company-item:hover {
+    background-color: #466bb5 !important;
+}
+
+/* .selected-company 样式已移至app.py中的custom_css */
+
+/* 卡片样式 */
+.card {
+    background-color: white;
+    border: 1px solid #d1d5db;
+    border-radius: 0.5rem;
+    /* padding: 1rem; */
+}
+
+.card-title {
+    font-weight: 500;
+    color: #111827;
+    /* margin: 0 0 0.75rem 0; */
+    padding: 5px 7px;
+}
+
+/* 表格样式 */
+.data-table {
+    width: 100%;
+    font-size: 0.875rem;
+}
+
+.data-table th {
+    text-align: left;
+    padding: 0.5rem 0;
+    color: #6b7280;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+.data-table td {
+    padding: 0.5rem 0;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+.data-table tr:last-child td {
+    border-bottom: none;
+}
+
+.text-right {
+    text-align: right;
+}
+
+.text-green {
+    color: #16a34a;
+}
+
+.text-red {
+    color: #dc2626;
+}
+
+/* 进度条样式 */
+.progress-container {
+    width: 100%;
+    background-color: #e5e7eb;
+    border-radius: 0.5rem;
+    height: 0.5rem;
+    margin-top: 0.25rem;
+}
+
+.progress-bar {
+    height: 100%;
+    border-radius: 0.5rem;
+}
+
+.progress-bar.blue {
+    background-color: #3b82f6;
+}
+
+.progress-bar.green {
+    background-color: #22c55e;
+}
+
+.progress-bar.purple {
+    background-color: #a855f7;
+}
+
+.progress-bar.red {
+    background-color: #ef4444;
+}
+
+/* PDF预览样式 */
+.pdf-preview {
+    border: 1px solid #d1d5db;
+    border-radius: 0.5rem;
+    overflow: hidden;
+}
+
+.pdf-header {
+    display: flex;
+    align-items: center;
+    gap: 0.25rem;
+    padding: 0.5rem;
+    border-bottom: 1px solid #d1d5db;
+    font-size: 0.875rem;
+}
+
+.pdf-pages {
+    display: flex;
+    padding: 0.5rem;
+}
+
+.pdf-page {
+    height: 6rem;
+    border: 1px solid #d1d5db;
+    border-radius: 0.25rem;
+    cursor: pointer;
+    margin-right: 0.5rem;
+}
+
+.pdf-page:hover {
+    border-color: #93c5fd;
+}
+
+.pdf-page.active {
+    border-color: #93c5fd;
+    border-width: 2px;
+}
+
+.pdf-viewer {
+    height: 100%;
+    border: 1px solid #e5e7eb;
+    background-color: #f3f4f6;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+}
+
+.pdf-footer {
+    padding: 0.5rem;
+    background-color: #f3f4f6;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    font-size: 0.875rem;
+    color: #6b7280;
+    margin-top: 0 !important;
+}
+
+/* 图标按钮 */
+.icon-button {
+    cursor: pointer;
+    padding: 0.25rem;
+    border-radius: 0.25rem;
+}
+
+.icon-button:hover {
+    background-color: #f3f4f6;
+    color: #2563eb;
+}
+
+.custom-add-input {
+    position: relative;
+    padding-left: 32px !important;
+}
+
+.custom-add-input textarea::before {
+    content: "+";
+    position: absolute;
+    left: 8px;
+    top: 50%;
+    transform: translateY(-50%);
+    color: #007bff;
+    font-weight: bold;
+    font-size: 16px;
+}
+
+.report-list-box {
+    height: 300px;
+    display: unset !important;
+    overflow-y: auto !important;
+}
+.report-item-content {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+.report-item {
+    height: fit-content;
+    padding: 4px 6px;
+}
+.report-item-content span:hover {
+    color: #e1853e !important;
+}
+
+.metric-card-item-current-ratio {
+    height: 109px !important;
+    padding-top: 15px !important;
+}
+.metric-card-item-current-ratio .slider_input_container {
+    padding-top: 15px !important;
+}
+.chat-content-box {
+    height: 500px !important;
+    overflow-y: auto !important;
+}
+/* .chat-content-box .message-wrap {
+    height: 400px !important;
+} */
+.company-input-box {
+    width: 100% !important;
+}
+.company-input-box label {
+    width: 100% !important;
+    min-width: 100% !important;
+}
+.company-input-box div {
+    width: 100% !important;
+}
+.company-input-box textarea {
+    width: 100% !important;
+}
+.left-card-title {
+    background: #fff !important;
+}
+
+.home-company-list {
+    width: 100%;
+    padding: 10px;
+    background: #f9fafb !important;
+}
+
+.home-company-item-box {
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    padding: 10px 0;
+    gap: 10px;
+}
+
+/* 单个元素时居中对齐 */
+.home-company-item-box.single-item {
+    justify-content: center;
+}
+
+.home-company-item {
+    border: 2px solid rgb(217 217 217);
+    padding: 8px 12px;
+    border-radius: 8px;
+    font-size: 16px;
+    flex: 1;
+    min-width: 0;
+    color: rgb(142 143 143);
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+    text-align: center;
+    cursor: pointer;
+    transition: all 0.2s ease;
+}
+
+.home-company-item:hover {
+    background-color: #e5e7eb;
+    border-color: rgb(156 163 175);
+    color: rgb(55 65 81);
+    transform: translateY(-1px);
+    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
+}
+
+.news-list-box .news-item {
+    padding: 5px;
+}
+.news-list-box .news-item-content span:hover {
+    color: rgb(225, 133, 62) !important
+}
+.invest-suggest-md-box, .analysis-report-md-box {
+    padding: 10px 20px !important;
+    /* border-left: 1px solid #d0d5dc !important; */
+}
+.metric-card-col-left {
+    max-width: 250px !important;
+    height: 300px !important;
+}
+.metric-card-col-middle {
+    max-width: 450px !important;
+    height: 300px !important;
+}
+.metric-card-col-right {
+    max-width: 600px !important;
+    height: 300px !important;
+}
+
+[class*="generating"] {
+    display: none !important;
+}

css/layout.css

@@ -0,0 +1,566 @@
+/* 布局样式 */
+
+/* 网格布局 */
+.grid-cols-2 {
+    display: grid;
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+    gap: 1.5rem;
+}
+
+.grid-cols-3 {
+    display: grid;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 1.5rem;
+}
+
+.grid-cols-4 {
+    display: grid;
+    grid-template-columns: repeat(4, minmax(0, 1fr));
+    gap: 1rem;
+}
+
+/* Flex布局 */
+.flex {
+    display: flex;
+}
+
+.flex-col {
+    flex-direction: column;
+}
+
+.flex-1 {
+    flex: 1 1 0%;
+}
+
+.flex-row {
+    flex-direction: row;
+}
+
+.items-start {
+    align-items: flex-start;
+}
+
+.items-center {
+    align-items: center;
+}
+
+.justify-center {
+    justify-content: center;
+}
+
+.justify-between {
+    justify-content: space-between;
+}
+
+.gap-1 {
+    gap: 0.25rem;
+}
+
+.gap-2 {
+    gap: 0.5rem;
+}
+
+.gap-4 {
+    gap: 1rem;
+}
+
+.gap-6 {
+    gap: 1.5rem;
+}
+
+/* 间距 */
+.mt-1 {
+    margin-top: 0.25rem;
+}
+
+.mt-2 {
+    margin-top: 0.5rem;
+}
+
+.mt-3 {
+    margin-top: 0.75rem;
+}
+
+.mt-4 {
+    margin-top: 1rem;
+}
+
+.mb-1 {
+    margin-bottom: 0.25rem;
+}
+
+.mb-3 {
+    margin-bottom: 0.75rem;
+}
+
+.mb-6 {
+    margin-bottom: 1.5rem;
+}
+
+.ml-auto {
+    margin-left: auto;
+}
+
+.p-2 {
+    padding: 0.5rem;
+}
+
+.p-3 {
+    padding: 0.75rem;
+}
+
+.p-4 {
+    padding: 1rem;
+}
+
+.p-5 {
+    padding: 1.25rem;
+}
+
+.p-6 {
+    padding: 1.5rem;
+}
+
+.px-2 {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
+}
+
+.px-3 {
+    padding-left: 0.75rem;
+    padding-right: 0.75rem;
+}
+
+.px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+}
+
+.px-5 {
+    padding-left: 1.25rem;
+    padding-right: 1.25rem;
+}
+
+.py-1 {
+    padding-top: 0.25rem;
+    padding-bottom: 0.25rem;
+}
+
+.py-2 {
+    padding-top: 0.5rem;
+    padding-bottom: 0.5rem;
+}
+
+.py-3 {
+    padding-top: 0.75rem;
+    padding-bottom: 0.75rem;
+}
+
+.py-4 {
+    padding-top: 1rem;
+    padding-bottom: 1rem;
+}
+
+.pt-2 {
+    padding-top: 0.5rem;
+}
+
+.pt-3 {
+    padding-top: 0.75rem;
+}
+
+.pb-2 {
+    padding-bottom: 0.5rem;
+}
+
+/* 尺寸 */
+.h-full {
+    height: 100%;
+}
+
+.h-24 {
+    height: 6rem;
+}
+
+.h-32 {
+    height: 8rem;
+}
+
+.h-56 {
+    height: 14rem;
+}
+
+.h-60 {
+    height: 15rem;
+}
+
+.h-72 {
+    height: 18rem;
+}
+
+.w-full {
+    width: 100%;
+}
+
+.w-1\/4 {
+    width: 25%;
+}
+
+.w-3\/4 {
+    width: 75%;
+}
+
+.w-2\/5 {
+    width: 40%;
+}
+
+.w-3\/5 {
+    width: 60%;
+}
+
+.min-h-screen {
+    min-height: 100vh;
+}
+
+.min-h-0 {
+    min-height: 0px;
+}
+
+.min-h-\[250px\] {
+    min-height: 250px;
+}
+
+.min-h-\[90vh\] {
+    min-height: 90vh;
+}
+
+/* 文本对齐 */
+.text-left {
+    text-align: left;
+}
+
+.text-right {
+    text-align: right;
+}
+
+/* 边框 */
+.border {
+    border-width: 1px;
+}
+
+.border-2 {
+    border-width: 2px;
+}
+
+.border-t {
+    border-top-width: 1px;
+}
+
+.border-b {
+    border-bottom-width: 1px;
+}
+
+.border-b-2 {
+    border-bottom-width: 2px;
+}
+
+.border-r {
+    border-right-width: 1px;
+}
+
+.border-l {
+    border-left-width: 1px;
+}
+
+.border-gray-200 {
+    border-color: #e5e7eb;
+}
+
+.border-gray-300 {
+    border-color: #d1d5db;
+}
+
+.border-blue-400 {
+    border-color: #60a5fa;
+}
+
+.border-blue-600 {
+    border-color: #2563eb;
+}
+
+/* 圆角 */
+.rounded {
+    border-radius: 0.25rem;
+}
+
+.rounded-lg {
+    border-radius: 0.5rem;
+}
+
+.rounded-xl {
+    border-radius: 0.75rem;
+}
+
+.rounded-2xl {
+    border-radius: 1rem;
+}
+
+.rounded-full {
+    border-radius: 9999px;
+}
+
+.rounded-tl-none {
+    border-top-left-radius: 0px;
+}
+
+.rounded-tr-none {
+    border-top-right-radius: 0px;
+}
+
+/* 阴影 */
+.shadow {
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+}
+
+.shadow-xl {
+    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+}
+
+.shadow-inner {
+    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);
+}
+
+/* 溢出 */
+.overflow-hidden {
+    overflow: hidden;
+}
+
+.overflow-x-auto {
+    overflow-x: auto;
+}
+
+.overflow-y-auto {
+    overflow-y: auto;
+}
+
+/* 光标 */
+.cursor-pointer {
+    cursor: pointer;
+}
+
+/* 文本大小 */
+.text-xs {
+    font-size: 0.75rem;
+    line-height: 1rem;
+}
+
+.text-sm {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+}
+.text-sm-top-time {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+    text-align: end;
+    
+}
+.text-sm-top-time p {
+color: #fff !important;
+}
+
+.text-base {
+    font-size: 1rem;
+    line-height: 1.5rem;
+}
+
+.text-xl {
+    font-size: 1.25rem;
+    line-height: 1.75rem;
+}
+
+.text-2xl {
+    font-size: 1.5rem;
+    line-height: 2rem;
+}
+
+/* 文本粗细 */
+.font-medium {
+    font-weight: 500;
+}
+
+.font-semibold {
+    font-weight: 600;
+}
+
+.font-bold {
+    font-weight: 700;
+}
+
+/* 文本颜色 */
+.text-white {
+    color: #ffffff;
+}
+
+.text-gray-500 {
+    color: #6b7280;
+}
+
+.text-gray-600 {
+    color: #4b5563;
+}
+
+.text-gray-700 {
+    color: #374151;
+}
+
+.text-gray-900 {
+    color: #111827;
+}
+
+.text-blue-500 {
+    color: #3b82f6;
+}
+
+.text-blue-600 {
+    color: #2563eb;
+}
+
+.text-blue-700 {
+    color: #1d4ed8;
+}
+
+.text-green-500 {
+    color: #22c55e;
+}
+
+.text-green-600 {
+    color: #16a34a;
+}
+
+.text-red-500 {
+    color: #ef4444;
+}
+
+.text-red-600 {
+    color: #dc2626;
+}
+
+.text-purple-500 {
+    color: #a855f7;
+}
+
+/* 背景颜色 */
+.bg-white {
+    background-color: #ffffff;
+}
+.bg-white .wrap label {
+    border: unset !important;
+    border-color: unset !important;
+}
+
+.bg-gray-50 {
+    background-color: #f9fafb;
+}
+
+.bg-gray-100 {
+    background-color: #f3f4f6;
+}
+
+.bg-gray-200 {
+    background-color: #e5e7eb;
+}
+
+.bg-blue-50 {
+    background-color: #eff6ff;
+}
+
+.bg-blue-500 {
+    background-color: #3b82f6;
+}
+
+.bg-blue-600 {
+    background-color: #2563eb;
+}
+
+.bg-green-500 {
+    background-color: #22c55e;
+}
+
+.bg-purple-500 {
+    background-color: #a855f7;
+}
+
+.bg-red-500 {
+    background-color: #ef4444;
+}
+
+.bg-gradient-to-r {
+    background-image: linear-gradient(to right, var(--tw-gradient-stops));
+}
+
+.from-blue-600 {
+    --tw-gradient-from: #2563eb;
+    --tw-gradient-to: rgba(37, 99, 235, 0);
+    --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);
+}
+
+.to-blue-800 {
+    --tw-gradient-to: #1e40af;
+}
+
+/* 对象适应 */
+.object-contain {
+    object-fit: contain;
+}
+
+/* 最小宽度 */
+.min-w-0 {
+    min-width: 0px;
+}
+
+/* 最大宽度 */
+.max-w-\[85\%\] {
+    max-width: 85%;
+}
+
+/* .gradio-container-5-49-1 {
+    -webkit-text-size-adjust: 100%;
+    line-height: 1.5;
+    font-family:unset !important;
+    -moz-tab-size: 4;
+    tab-size: 4
+} */
+
+/* [class^="gradio-container-"] {
+    -webkit-text-size-adjust: 100%;
+    line-height: 1.5;
+    font-family: unset !important;
+    -moz-tab-size: 4;
+    tab-size: 4;
+} */
+
+main {
+    /* min-width: 1440px !important; */
+    padding: 0 !important;
+    width: 100vw !important;
+    max-width: 100vw !important;
+    min-width: 1200px !important;
+}
+/* main .wrap {
+    height: 100vh !important;
+} */
+/* main .wrap .contain {
+    height: 100% !important;
+} */
+/* main .wrap .contain .column {
+    height: 100vh !important;
+} */
+
+.main-content-box {
+    gap: unset !important;
+    min-height: calc(100vh - 80px) !important;
+}
+
+.gradio-container {
+    overflow: auto !important;
+}

css/main.css

@@ -0,0 +1,249 @@
+/* 主体样式 */
+html {
+    display: unset !important;
+}
+body {
+    background-color: #f3f4f6;
+    /* font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; */
+    font-family: unset !important;
+    margin: 0;
+    padding: 0;
+    /* display: unset !important; */
+    min-height: 100vh !important;
+}
+
+/* 容器样式 */
+.container {
+    min-width: 1440px;
+    /* margin: 2rem auto; */
+    background-color: white;
+    box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1);
+    /* border-radius: 0.75rem; */
+    /* min-height: 90vh; */
+    overflow: hidden;
+    margin-top: 0 !important;
+    gap: unset !important;
+    margin: 0 auto !important;
+}
+.container-h {
+    /* height: 97vh !important; */
+    background-color: rgb(249 250 251) !important;
+}
+.html-container {
+    padding: 0 !important;
+}
+footer {
+    margin-top: 0 !important;
+}
+
+/* 头部样式 */
+.header {
+    background: linear-gradient(to right, #2563eb, #1e40af);
+    color: white;
+    padding: 1rem 2rem;
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+}
+
+.top-logo-box {
+    display: flex;
+}
+
+.logo-title {
+    color: #fff !important;
+    margin-left: 10px;
+}
+
+.header h1 {
+    font-size: 1.5rem;
+    font-weight: 600;
+    margin: 0;
+}
+
+/* 主要内容区域 */
+.main-content {
+    display: flex;
+    flex: 1;
+    overflow: hidden;
+}
+
+/* 左侧边栏 */
+.sidebar {
+    background-color: #f9fafb;
+    width: 350px;
+    padding: 1.5rem;
+    display: flex;
+    flex-direction: column;
+    gap: 1.5rem;
+    border-right: 1px solid #e5e7eb;
+}
+
+/* 主内容区域 */
+.content-area {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    background-color: #eff6ff;
+}
+
+/* 指标仪表板 */
+.metrics-dashboard {
+    background-color: #eff6ff;
+    border-bottom: 1px solid #e5e7eb;
+    padding: 1.5rem;
+    /* display: grid; */
+    /* grid-template-columns: repeat(4, 1fr); */
+    /* gap: 1rem; */
+    min-height: 300px;
+}
+
+.metric-card {
+    background-color: white;
+    border-radius: 0.5rem;
+    box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px -1px rgba(0, 0, 0, 0.1);
+    padding: 1.25rem;
+    min-height: 250px !important;
+}
+
+.metric-card h3 {
+    font-weight: 600;
+    color: #374151;
+    margin: 0 0 1rem 0;
+}
+
+.metric-value {
+    font-size: 1.5rem;
+    font-weight: 700;
+    color: #111827;
+    margin: 1rem 0 0.25rem 0;
+}
+
+.metric-change {
+    display: flex;
+    align-items: center;
+    margin-top: 0.25rem;
+}
+
+.metric-change.positive {
+    color: #16a34a;
+}
+
+.metric-change.negative {
+    color: #dc2626;
+}
+
+/* 分析区域 */
+.analysis-area {
+    flex: 1;
+    display: flex;
+    min-height: 0;
+    overflow: hidden;
+}
+
+/* Tab内容 */
+.tab-content {
+    flex: 1;
+    display: flex;
+    flex-direction: column;
+    min-width: 0;
+    padding: 0 16px !important;
+}
+
+/* Tab导航 */
+.tab-navigation {
+    display: flex;
+    border-bottom: 1px solid #e5e7eb;
+}
+
+.tab-button {
+    padding: 0.75rem 1.25rem;
+    font-weight: 500;
+    font-size: 1rem;
+    color: #6b7280;
+    border-bottom: 2px solid transparent;
+}
+
+.tab-button.active {
+    color: #111827;
+    border-bottom: 2px solid #2563eb;
+}
+
+/* 聊天面板 */
+.chat-panel {
+    /* width: 340px; */
+    display: flex;
+    flex-direction: column;
+    border-left: 1px solid #e5e7eb;
+    background-color: white;
+    box-shadow: inset 0 2px 4px 0 rgba(0, 0, 0, 0.05);
+    gap: unset !important;
+}
+
+.chat-header {
+    padding: 1rem;
+    border-bottom: 1px solid #e5e7eb;
+    display: flex;
+    align-items: center;
+    gap: 0.5rem;
+    font-weight: 500;
+}
+
+.chat-area {
+    flex: 1;
+    min-height: 0;
+    overflow-y: auto;
+    padding: 1rem;
+    display: flex;
+    flex-direction: column;
+    gap: 1rem;
+}
+
+.chat-message {
+    max-width: 85%;
+    padding: 0.75rem;
+    border-radius: 1rem;
+}
+
+.chat-message.bot {
+    background-color: #eff6ff;
+    border-bottom-left-radius: 0;
+}
+
+.chat-message.user {
+    background-color: #f3f4f6;
+    border-bottom-right-radius: 0;
+    margin-left: auto;
+}
+
+.chat-input-area {
+    padding: 1rem;
+    border-top: 1px solid #e5e7eb;
+    display: flex;
+    gap: 0.5rem;
+}
+
+/* 隐藏滚动条 */
+.hide-scrollbar::-webkit-scrollbar {
+    display: none;
+}
+
+.hide-scrollbar {
+    -ms-overflow-style: none;
+    scrollbar-width: none;
+}
+
+/* 渐变动画 */
+.fade-in {
+    animation: fadeIn 0.3s ease-in-out;
+}
+
+@keyframes fadeIn {
+    from {
+        opacity: 0;
+    }
+
+    to {
+        opacity: 1;
+    }
+}

globals.py

@@ -0,0 +1 @@
+SELECT_COMPANY = ""