/* =================================================================== */
/* 5. 交互组件架构 (浅灰边框修复区)                                       */
/* =================================================================== */
[data-theme] .form-control,
[data-theme] .form-select,
[data-theme] .input-group-checklist-container,
[data-theme] .form-control-slider-container {
  background-color: var(--global-panel-bg) !important;
  color: var(--global-text-color) !important;
  border: 1px solid var(--input-border-color) !important; 
  transition: border 0.2s ease, background-color 0.2s ease;
}

[data-theme] .input-group-text {
  /* 这里的透明是罪魁祸首，将其改为 var(--global-panel-bg) */
  background-color: var(--global-panel-bg) !important; 
  color: var(--global-text-color) !important;
  border: 1px solid var(--input-border-color) !important; 
  transition: border 0.2s ease, background-color 0.2s ease;
}

/* 顺手把手风琴面板和卡片内部可能漏底的白色给填上深色，消灭那条白色缝隙 */
[data-theme] .accordion-body,
[data-theme] .accordion-item,
[data-theme] .main-card .card-body {
  background-color: var(--global-bg-color) !important;
}

.upload-area {
  border-width: 2px;
  border-style: dashed;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s ease;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 10px;
  text-shadow: none !important; 
  -webkit-font-smoothing: antialiased;
  font-weight: 600 !important;
  border-color: color-mix(in srgb, var(--menu-bg), black 20%) !important; 
  color: color-mix(in srgb, var(--menu-bg), black 40%) !important; 
  background-color: var(--global-panel-bg, #f3f4f6); 
}

.upload-area:hover {
  background-color: rgba(0, 0, 0, 0.05);
  border-color: color-mix(in srgb, var(--menu-bg), black 40%) !important;
  color: color-mix(in srgb, var(--menu-bg), black 60%) !important;
}

.icon-button-toolbar {
  width: 29px !important;
  height: 29px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  background-color: var(--global-panel-bg, #f3f4f6) !important; 
  border: 1px solid var(--input-border-color) !important; 
  color: var(--global-text-color) !important;
  box-shadow: none !important;
}

.icon-button-toolbar:hover {
  background-color: rgba(0,0,0,0.05) !important;
}

.icon-button-toolbar-borderless {
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
  transition: background-color 0.2s ease-in-out;
  color: var(--global-text-color) !important;
}

.icon-button:hover,
.icon-button-toolbar-borderless:hover {
  background-color: rgba(0, 0, 0, 0.1) !important;
}

.icon-button-toolbar-borderless:disabled {
  opacity: 0.35;
}

.icon-button {
  width: 29px !important;
  height: 29px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}

/* =================================================================== */
/* 7. 终端控制台 (Console)                                              */
/* =================================================================== */
.console-header {
  color: var(--menu-text-color);
  background-color: var(--menu-bg) !important;
  padding: 0.4rem 1rem;
  font-size: 0.9rem;
  font-weight: 500;
  border-top: 1px solid var(--menu-border-color);
}

.terminal-console {
    background-color: var(--global-bg-color) !important;
    color: var(--global-text-color) !important;
    border: 1px solid var(--global-border-color) !important;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace !important;
    font-size: 13px;
    line-height: 1.45;
    padding: 15px;
    margin: 0;
    height: 250px; 
    white-space: pre !important; 
    overflow-x: auto; 
    overflow-y: auto;
    scroll-behavior: smooth; 
    transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

/* =================================================================== */
/* 11. 滑块组件加强体系 (RC Slider Enhancement)                          */
/* =================================================================== */
.form-control-slider-container {
  height: 31px !important;
  padding: 0 !important;
  margin-bottom: 0 !important;
  position: relative;
  overflow: visible !important;
}

.form-control-slider-container .rc-slider {
  padding-top: 13px !important;
  padding-bottom: 0 !important;
  margin-left: 0px !important;
  margin-right: 0px !important;
  height: 100% !important;
}

/* 核心修复 1：全面覆盖单滑块与范围滑块 (RangeSlider) 的轨道，并加入默认回退色 */
.rc-slider-track,
.rc-slider-track-1,
.rc-slider-track-2 {
  background-color: var(--theme-accent-color, #3b5a9d) !important;
  transition: background-color 0.3s ease;
}

/* 核心修复 2：全面覆盖所有手柄 */
.rc-slider-handle,
.rc-slider-handle-1,
.rc-slider-handle-2 {
  border-radius: 3px !important;
  width: 14px !important;
  height: 14px !important;
  margin-top: -6px !important;
  background: linear-gradient(180deg, #ffffff 0%, #e8e8e9 20%, #d1d3d6 80%, #babbc0 100%) !important;
  border: 1px solid var(--input-border-color) !important; 
  border-bottom-color: var(--input-border-color) !important;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.9),
              inset 0 -1px 1px rgba(0, 0, 0, 0.05),
              0 2px 4px rgba(0, 0, 0, 0.15) !important;
  transition: transform 0.15s cubic-bezier(0.2, 0, 0.2, 1),
              box-shadow 0.15s ease,
              border-color 0.15s ease,
              background 0.15s ease !important;
  cursor: grab !important;
}

/* 悬停状态同步强调色 */
.rc-slider-handle:hover,
.rc-slider-handle-1:hover,
.rc-slider-handle-2:hover {
  background: linear-gradient(180deg, #ffffff 0%, #f2f2f3 20%, #dedfe2 80%, #cacbcc 100%) !important;
  border-color: var(--theme-accent-color, #3b5a9d) !important;
  box-shadow: 0 0 5px var(--theme-accent-color, #3b5a9d) !important;
  transform: scale(1.05);
}

/* 拖拽状态同步强调色 */
.rc-slider-handle:active,
.rc-slider-handle-1:active,
.rc-slider-handle-2:active,
.rc-slider-handle-dragging {
  background: linear-gradient(180deg, #c4c5c9 0%, #d1d3d6 20%, #e8e8e9 100%) !important;
  border-color: var(--theme-accent-color, #3b5a9d) !important;
  box-shadow: 0 0 8px var(--theme-accent-color, #3b5a9d) !important;
  transform: scale(0.95);
  cursor: grabbing !important;
}


/* ================== Geek Dark 专属覆盖 ================== */
[data-theme='geek-dark'] .rc-slider-handle,
[data-theme='geek-dark'] .rc-slider-handle-1,
[data-theme='geek-dark'] .rc-slider-handle-2 {
  background: #e3e3e3 !important;
  border: 1px solid #ffffff !important;
  box-shadow: 0 0 6px rgba(138, 180, 248, 0.5) !important;
  opacity: 1 !important;
}

[data-theme='geek-dark'] .rc-slider-handle:hover,
[data-theme='geek-dark'] .rc-slider-handle-1:hover,
[data-theme='geek-dark'] .rc-slider-handle-2:hover,
[data-theme='geek-dark'] .rc-slider-handle:active,
[data-theme='geek-dark'] .rc-slider-handle-1:active,
[data-theme='geek-dark'] .rc-slider-handle-2:active,
[data-theme='geek-dark'] .rc-slider-handle-dragging {
  background: #ffffff !important;
  transform: scale(1.15);
  box-shadow: 0 0 10px var(--theme-accent-color, #8ab4f8) !important;
}

[data-theme='geek-dark'] .rc-slider-track,
[data-theme='geek-dark'] .rc-slider-track-1,
[data-theme='geek-dark'] .rc-slider-track-2 {
  background-color: var(--theme-accent-color, #8ab4f8) !important;
}

[data-theme='geek-dark'] .rc-slider-rail {
  background-color: #3c4043 !important;
}

[data-theme='geek-dark'] .rc-slider-step {
  background: transparent;
}

/* =================================================================== */
/* 补充：滑块数值提示框 (Tooltip) 动态主题适配                         */
/* =================================================================== */

.rc-slider-tooltip {
  z-index: 2000 !important;
}

/* 1. 默认浅色主题：浅色背景 + 黑色字体 */
.rc-slider-tooltip-inner {
  background-color: var(--global-panel-bg, #ffffff) !important;
  color: #1a1a1a !important; /* 🌟 浅色主题显示黑色字体 */
  border: 1px solid var(--input-border-color) !important;
  border-radius: 4px !important;
  padding: 4px 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1) !important;
  min-width: 30px !important;
  text-align: center !important;
}

.rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {
  border-top-color: var(--input-border-color) !important;
}

.rc-slider-tooltip-placement-bottom .rc-slider-tooltip-arrow {
  border-bottom-color: var(--input-border-color) !important;
}


/* 2. 黑色主题 (Geek Dark)：深色背景 + 白色字体 */
[data-theme='geek-dark'] .rc-slider-tooltip-inner {
  background-color: #333537 !important;
  color: #ffffff !important; /* 🌟 黑色主题显示白色字体 */
  border-color: #555555 !important;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.4) !important;
}

[data-theme='geek-dark'] .rc-slider-tooltip-placement-top .rc-slider-tooltip-arrow {
  border-top-color: #555555 !important;
}

[data-theme='geek-dark'] .rc-slider-tooltip-placement-bottom .rc-slider-tooltip-arrow {
  border-bottom-color: #555555 !important;
}

/* =================================================================== */
/* 13. 色块选择器精准修整 (Selection Indicator Fix)                     */
/* =================================================================== */
.color-swatch-sm,
button[id*="background-color-swatch"] {
    width: 28px !important;
    height: 28px !important;
    display: block !important;
    border: 1px solid var(--input-border-color) !important;
    padding: 0 !important;
    margin: 0 !important;
    cursor: pointer !important;
}

.color-swatch-selected {
    outline: 2px solid #333333 !important; 
    outline-offset: 2px;
    transform: scale(0.85) !important; 
    z-index: 100 !important;
    position: relative !important;
    border: none !important; 
}

[data-theme='geek-dark'] .color-swatch-selected {
    outline-color: var(--theme-accent-color) !important; /* 暗黑模式色块选中框同步变色 */
}

.popover-body, .popover-menu {
    overflow: visible !important;
}




/* 3. 修复暗黑模式下，开关未选中时背景太亮或看不清的问题 */
[data-theme='geek-dark'] .form-switch .form-check-input:not(:checked),
[data-theme='geek-dark'] .form-check-input:not(:checked) {
    background-color: #333537 !important;
    border-color: var(--input-border-color) !important;
}


/* =================================================================== */
/* AI Modeling Agent Component Styles (智能体专属界面：硬核工业风)     */
/* =================================================================== */

/* ------------------------------------------------------------------- */
/* 1. 聊天大框 (主屏幕：内凹质感，明显边框)                             */
/* ------------------------------------------------------------------- */
.ai-agent-chat-box {
  height: 57.3vh;       /* 默认占据整个浏览器屏幕高度的 55% */
  max-height: 80vh;   /* 最大不超过屏幕高度的 75% */
  overflow-y: auto;
  
  /* 基础模式下的浅色内凹背景 */
  background-color: var(--global-panel-bg) !important;
  color: var(--global-text-color) !important;
  
  /* 借用输入框的边框变量，确保大边框清晰可见 */
  border: 1px solid var(--input-border-color) !important;
  border-radius: 0 !important; /* 工业风硬核直角 */
  
  padding: 12px;
  margin-bottom: 12px;
  display: flex;
  flex-direction: column;
  gap: 10px;
  font-size: 0.8rem !important; /* 从 0.85rem 下调 */
  /* 增加内阴影，营造“屏幕凹陷”的视觉层次感 */
  box-shadow: inset 0 2px 6px rgba(0,0,0,0.08) !important;
}

/* Geek Dark 暗黑模式专属覆盖：深邃控制台效果 */
[data-theme='geek-dark'] .ai-agent-chat-box {
  background-color: #1e2022 !important; /* 比外层更深的颜色 */
  border-color: #44474a !important;      /* 明显的高亮边框 */
  box-shadow: inset 0 2px 8px rgba(0,0,0,0.3) !important; /* 更深的内阴影 */
}

/* 针对滚动条的工业风美化，让框内更沉浸 */
.ai-agent-chat-box::-webkit-scrollbar {
  width: 6px;
}
.ai-agent-chat-box::-webkit-scrollbar-track {
  background: transparent;
}
.ai-agent-chat-box::-webkit-scrollbar-thumb {
  background-color: rgba(120, 120, 120, 0.4);
}
.ai-agent-chat-box::-webkit-scrollbar-thumb:hover {
  background-color: rgba(120, 120, 120, 0.8);
}

/* ------------------------------------------------------------------- */
/* 2. 对话气泡与卡片设计                                                */
/* ------------------------------------------------------------------- */

/* 用户发送的消息框 (靠右，科技蓝底色) */
.ai-agent-user-msg-container {
    text-align: right;
    margin-bottom: 12px;
}
.ai-agent-user-msg {
    display: inline-block;
    background-color: rgba(138, 180, 248, 0.15); 
    border: 1px solid rgba(138, 180, 248, 0.3);
    padding: 8px 12px;
    text-align: left; 
    max-width: 85%;
    word-break: break-word;
    color: var(--global-text-color);
    border-radius: 0 !important; /* 强制直角 */
}

/* AI 助手的消息框 (靠左，紫色强调边框) */
.ai-agent-bot-msg-container {
    text-align: left;
    margin-bottom: 6px;
}
.ai-agent-bot-msg {
    display: block;      
    background-color: var(--global-bg-color, #ffffff);
    border: 1px solid var(--global-border-color, #dee2e6);
    border-left: 4px solid #6f42c1; 
    padding: 10px 14px;
    width: 100%;          
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
    border-radius: 0 !important;
}

/* 错误警报框 (靠左，红色强调边框) */
.ai-agent-error-msg-container {
    text-align: left;
    margin-bottom: 12px;
}
.ai-agent-error-msg {
    display: inline-block;
    background-color: rgba(220, 53, 69, 0.08);
    border: 1px solid rgba(220, 53, 69, 0.2);
    border-left: 4px solid #dc3545;
    padding: 10px 14px;
    color: #dc3545;
    max-width: 92%;
    border-radius: 0 !important;
}

/* ------------------------------------------------------------------- */
/* 3. 物理引擎执行日志卡片                                              */
/* ------------------------------------------------------------------- */
.ai-agent-log-card {
    padding: 6px 10px;
    margin-top: 4px;
    border-radius: 0 !important;
    font-family: 'Consolas', 'Monaco', 'Courier New', monospace; /* 统一等宽代码字体 */
    font-size: 0.75rem !important; /* 从 0.8rem 下调 */
}
.ai-agent-log-card.success {
    background-color: rgba(25, 135, 84, 0.08);
    border-left: 3px solid #198754;
}
.ai-agent-log-card.error {
    background-color: rgba(220, 53, 69, 0.08);
    border-left: 3px solid #dc3545;
}
.ai-agent-log-text {
    color: var(--global-text-color);
    opacity: 0.9;
}

/* ------------------------------------------------------------------- */
/* 4. 系统通知与状态文本                                                */
/* ------------------------------------------------------------------- */
.ai-agent-sys-msg-container {
    text-align: left;
    margin-bottom: 10px;
}
.ai-agent-msg-system-label {
    font-weight: bold;
    color: #6c757d;
}

/* 状态指示灯（呼吸灯效果） */
.ai-agent-status-dot {
  height: 9px;
  width: 9px;
  background-color: #28a745;
  border-radius: 50%;
  display: inline-block;
  margin-right: 6px;
  box-shadow: 0 0 4px #28a745;
}

/* 状态栏文本 */
.ai-agent-status-text {
  color: var(--global-text-color) !important;
  opacity: 0.75; 
  font-weight: 500;
}

/* ------------------------------------------------------------------- */
/* 5. 指令输入区域美化                                                  */
/* ------------------------------------------------------------------- */
.ai-agent-input-field {
  height: 90px !important;
  resize: none !important;
  background-color: var(--global-panel-bg) !important;
  color: var(--global-text-color) !important;
  border: 1px solid var(--input-border-color) !important;
  font-size: 0.8rem !important; /* 保持与聊天框一致的视觉比例 */
  border-radius: 0 !important; /* 强制直角 */
  transition: all 0.2s ease;
}

.ai-agent-input-field:focus {
  background-color: var(--global-panel-bg) !important;
  color: var(--global-text-color) !important;
  border-color: var(--theme-accent-color, #8ab4f8) !important;
  box-shadow: 0 0 0 0.15rem rgba(138, 180, 248, 0.25) !important;
}

/* 输入框占位符颜色适配 */
.ai-agent-input-field::placeholder {
  color: var(--global-text-color) !important;
  opacity: 0.45 !important;
}

/* 进度条直角化与主题融合 */
.ai-agent-progress-bar {
  border-radius: 0 !important;
  background-color: var(--global-bg-color, #e9ecef) !important;
  border: 1px solid var(--global-border-color) !important;
}
.ai-agent-progress-bar .progress-bar {
  background-color: var(--theme-accent-color, #0d6efd) !important;
  color: #ffffff !important; 
  border-radius: 0 !important;
}

/* ========================================================================= */
/* 6. 终极防御：强制统一 AI Agent 聊天气泡内的所有 Markdown 字体大小        */
/* ========================================================================= */

/* 强制把所有标题 (H1~H6) 降维打击成普通正文大小，只保留加粗 */
.ai-agent-bot-msg h1, 
.ai-agent-bot-msg h2, 
.ai-agent-bot-msg h3, 
.ai-agent-bot-msg h4, 
.ai-agent-bot-msg h5, 
.ai-agent-bot-msg h6 {
    font-size: 0.8rem !important; /* 强制等同于外层配置的正文大小 */
    font-weight: bold !important;
    margin-top: 8px !important;
    margin-bottom: 4px !important;
    line-height: 1.4 !important;
    border-bottom: none !important; /* 去除某些标题自带的下划线 */
}

/* 统一表格文字大小，取消自带的代码块高亮感 */
.ai-agent-bot-msg table,
.ai-agent-bot-msg th,
.ai-agent-bot-msg td {
    font-size: 0.8rem !important;
    font-family: inherit !important; /* 取消等宽字体，跟随全局字体 */
}

/* 如果模型使用了引用语法 (>)，统一字号并淡化颜色 */
.ai-agent-bot-msg blockquote {
    font-size: 0.8rem !important;
    color: #6c757d !important;
    border-left: 3px solid #dee2e6 !important;
    padding-left: 10px !important;
    margin-left: 0 !important;
}

/* 统一无序/有序列表的间距和字号 */
.ai-agent-bot-msg ul,
.ai-agent-bot-msg ol {
    font-size: 0.8rem !important;
    margin-top: 4px !important;
    margin-bottom: 4px !important;
    padding-left: 20px !important;
}
.ai-agent-bot-msg li {
    margin-bottom: 2px !important;
}

/* 取消段落底部的过大留白 */
.ai-agent-bot-msg p {
    margin-bottom: 6px !important;
    font-size: 0.8rem !important;
}

/* 弱化行内代码的特殊字号和底色 */
.ai-agent-bot-msg code {
    font-size: 0.75rem !important;
    background-color: rgba(120, 120, 120, 0.1) !important;
    color: inherit !important;
    padding: 2px 4px !important;
    border-radius: 2px !important;
}

/* =================================================================== */
/* Slider UI Alignment & Value Box Removal Patch                       */
/* =================================================================== */

/* Force the InputGroup container to remain strictly on a single horizontal row */
.input-group {
    display: flex !important;
    flex-wrap: nowrap !important; /* Prevents elements from breaking into multiple lines */
    align-items: center !important;
}

/* Allow the slider container to dynamically expand and occupy all available middle space */
.form-control-slider-container {
    flex: 1 1 0% !important;    /* Smoothly scales to fill the horizontal row gap */
    width: auto !important;     /* Overrides any disruptive full-width wrapping constraints */
}

/* Completely isolate and eliminate the uncoordinated white numeric display boxes on the right */
.input-group > .form-control-slider-container + div,
.input-group > .form-control-slider-container + output,
.input-group > .form-control-slider-container + input,
.input-group > div[id*="-value"] {
    display: none !important;    /* Visual extraction without disrupting the underlying DOM state */
}
/* =================================================================== */
/* Global Slider Tooltip Callback Regression & White Box Elimination   */
/* =================================================================== */

/* Force the InputGroup container to remain strictly on a single horizontal row */
.input-group {
    display: flex !important;
    flex-wrap: nowrap !important; /* Disables reactive responsive line breaking */
    align-items: center !important;
}

/* Allow the slider box component to dynamically stretch and scale smoothly */
.form-control-slider-container {
    flex: 1 1 0% !important;    /* Forces full horizontal grid elongation */
    width: auto !important;     /* Overrides aggressive default percentage widths */
}

/* The ultimate fix for the stuck white value boxes.
   Because dcc.Slider tooltips are rendered via React Portals directly under 
   the <body> tag, localized parent selectors fail to match them. 
   
   Hiding these classes globally targets the root portal nodes, seamlessly 
   erasing the buggy, callback-stuck white frames across the entire workspace.
*/
.rc-slider-tooltip,
.rc-slider-tooltip-inner,
.rc-slider-tooltip-arrow {
    display: none !important;      /* Immediate visual suppression */
    visibility: hidden !important; /* Complete rendering engine bypass */
    opacity: 0 !important;         /* Multi-layer fail-safe erasure */
}