/* =========================================
   灰烬纪元 - 废土终端界面核心样式 (完全版)
   包含UI接管与AI终端面板渲染
   ========================================= */

/* 1. 全局废土光标植入 (应用至所有主要交互区域) */
.sticky.w-full.top-0.flex.items-center *,
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] *,
#ai-chat-bottom-input *,
#ai-mod-button2 *,
ai * {
    cursor: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="%234ade80" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12.01" y2="16"></line></svg>'), auto !important;
}

/* =========================================
   顶部栏：战术指令中枢
   ========================================= */
.sticky.w-full.top-0.flex.items-center {
    background: rgba(10, 10, 12, 0.95) !important;
    border-bottom: 2px solid #ef4444 !important;
    box-shadow: 0 5px 15px rgba(239, 68, 68, 0.3) !important;
    backdrop-filter: blur(5px) !important;
    font-family: 'Courier New', Courier, monospace !important;
}

#ai-model-selector .truncate.text-\[13px\] {
    color: #ef4444 !important;
    font-weight: bold !important;
    text-transform: uppercase !important;
    letter-spacing: 2px !important;
    text-shadow: 0 0 8px rgba(239, 68, 68, 0.6) !important;
}

#ai-model-selector .shrink-0.flex.items-center svg,
.sticky.w-full.top-0 svg.lucide-clock-8,
.sticky.w-full.top-0 button.MuiIconButton-root svg.lucide-music-2,
.sticky.w-full.top-0 svg:has(use[href="#icon-icon-set"]),
#header-setting-button svg {
    color: #4ade80 !important;
    filter: drop-shadow(0 0 3px rgba(74, 222, 128, 0.8)) !important;
    transition: all 0.3s !important;
}
#header-setting-button:hover svg {
    transform: rotate(90deg) !important;
}

.sticky.w-full.top-0 span.MuiBadge-dot.md\:hidden {
    background-color: #ef4444 !important;
    box-shadow: 0 0 8px #ef4444 !important;
}

/* =========================================
   开场白选择器：终端模块
   ========================================= */
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"],
div.h-9.rounded-md.cursor-pointer.group:has(svg[data-icon="SlidersH"]) {
    background: #18181b !important;
    border: 1px dashed #4ade80 !important;
    border-radius: 0 !important;
    color: #4ade80 !important;
    transition: all 0.3s !important;
}
div.flex.items-center.h-9.bg-white.rounded-md.cursor-pointer.group[class*="border-gray"]:hover {
    background: #27272a !important;
    box-shadow: inset 0 0 10px rgba(74, 222, 128, 0.2), 0 0 10px rgba(74, 222, 128, 0.5) !important;
}
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="SlidersH"],
div.flex.items-center.h-9.cursor-pointer.group svg[data-icon="ChevronDown"] {
    color: #4ade80 !important;
}

/* =========================================
   按钮栏：铁锈与鲜血
   ========================================= */
#ai-mod-button2 button.MuiButton-root {
    background: #18181b !important;
    border: 1px solid #3f3f46 !important;
    color: #d4d4d8 !important;
    font-family: 'Courier New', Courier, monospace !important;
    border-radius: 0 !important;
    text-transform: uppercase !important;
    transition: all 0.3s !important;
}
#ai-mod-button2 button.MuiButton-root:hover {
    background: #7f1d1d !important;
    border-color: #ef4444 !important;
    color: #fff !important;
    box-shadow: 0 0 15px rgba(239, 68, 68, 0.8) !important;
}
#ai-mod-button2 button.MuiButton-root svg {
    color: inherit !important;
}

/* =========================================
   底部栏与输入框：数据录入层
   ========================================= */
.bg-gradient-to-t {
    background: transparent !important;
}
#ai-chat-bottom-input {
    background: #0a0a0c !important;
    border-top: 2px solid #ef4444 !important;
    box-shadow: 0 -5px 15px rgba(239, 68, 68, 0.2) !important;
}
#ai-chat-input {
    background: #000 !important;
    color: #4ade80 !important;
    font-family: 'Courier New', Courier, monospace !important;
    border: 1px dashed #3f3f46 !important;
    border-radius: 0 !important;
}
#ai-chat-input:focus {
    border-color: #ef4444 !important;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.4) !important;
    outline: none !important;
}
#ai-chat-input::placeholder {
    color: #a1a1aa !important;
    opacity: 0.6 !important;
}
#ai-chat-input::selection {
    background: #ef4444 !important;
    color: #fff !important;
}

/* =========================================
   分页栏：废土导航
   ========================================= */
.MuiPaginationItem-root {
    color: #a1a1aa !important;
    border: 1px solid #3f3f46 !important;
    background: #18181b !important;
    border-radius: 0 !important;
    font-family: 'Courier New', Courier, monospace !important;
}
.MuiPaginationItem-root.Mui-selected {
    background: #7f1d1d !important;
    color: #fff !important;
    border-color: #ef4444 !important;
    box-shadow: 0 0 10px rgba(239, 68, 68, 0.5) !important;
}
.MuiPaginationItem-root:hover:not(.Mui-disabled) {
    background: #27272a !important;
    border-color: #4ade80 !important;
    color: #4ade80 !important;
}
.MuiPaginationItem-root.Mui-disabled {
    opacity: 0.3 !important;
}
.MuiPaginationItem-icon {
    color: inherit !important;
}
.MuiStack-root.css-1uwir8f .MuiBox-root {
    color: #d4d4d8 !important;
    font-family: 'Courier New', Courier, monospace !important;
}
.MuiInputBase-input {
    background: #000 !important;
    color: #4ade80 !important;
    border: 1px solid #3f3f46 !important;
    border-radius: 0 !important;
    font-family: 'Courier New', Courier, monospace !important;
}

/* =========================================
   评论区：废土众生相 (核心面板)
   ========================================= */
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] {
    background: radial-gradient(circle at 50% 50%, #1a1a1c 0%, #000000 100%) !important;
    color: #d4d4d8 !important;
    font-family: 'Courier New', Courier, monospace !important;
    border-top: 2px solid #7f1d1d !important;
    box-shadow: 0 -10px 20px rgba(0,0,0,0.8) !important;
}
div[class*="w-full"][class*="bg-white"][class*="bottom-0"] div.text-lg.font-bold {
    color: #ef4444 !important;
    text-transform: uppercase !important;
    letter-spacing: 3px !important;
    border-bottom: 1px dashed #3f3f46 !important;
    padding-bottom: 8px !important;
    text-shadow: 0 0 10px rgba(239, 68, 68, 0.6) !important;
}
p.MuiTypography-body1.text-grey-600 { color: #a1a1aa !important; }
span.MuiRating-iconEmpty svg { color: #3f3f46 !important; }
span.MuiRating-iconFilled svg {
    color: #ef4444 !important;
    filter: drop-shadow(0 0 4px #ef4444) !important;
}
span.text-orange-500 { color: #ef4444 !important; font-weight: bold !important; }
div.flex.flex-col.border-gray-200 { border: 1px solid #3f3f46 !important; background: #000 !important; }
textarea.rc-textarea { background: #000 !important; color: #4ade80 !important; font-family: 'Courier New', Courier, monospace !important; }
textarea.rc-textarea:focus { outline: none !important; border-color: #ef4444 !important; box-shadow: inset 0 0 10px rgba(239, 68, 68, 0.3) !important; }
div.bg-gray-100.text-gray-500 { background: #18181b !important; color: #a1a1aa !important; border-top: 1px dashed #3f3f46 !important; }
div.cursor-pointer.group.flex.items-center.justify-center[data-state="closed"] { background: #166534 !important; border: 1px solid #4ade80 !important; transition: all 0.3s !important; }
div.cursor-pointer.group.flex.items-center.justify-center[data-state="closed"]:hover { background: #22c55e !important; box-shadow: 0 0 15px rgba(74, 222, 128, 0.8) !important; }
div[data-state="closed"] svg[data-icon="Send03"] { color: #000 !important; }
div.style_divider__mW0YX { background-color: #3f3f46 !important; }
button.MuiButton-containedPrimary { background: #7f1d1d !important; color: #fff !important; border: 1px solid #ef4444 !important; border-radius: 0 !important; font-family: 'Courier New', Courier, monospace !important; box-shadow: 0 0 10px rgba(239, 68, 68, 0.5) !important; }
button.MuiButton-outlinedPrimary { background: #18181b !important; color: #a1a1aa !important; border: 1px solid #3f3f46 !important; border-radius: 0 !important; font-family: 'Courier New', Courier, monospace !important; }
button.MuiButton-outlinedPrimary:hover { border-color: #4ade80 !important; color: #4ade80 !important; box-shadow: inset 0 0 8px rgba(74, 222, 128, 0.2) !important; }
div.p-3.overflow-y-auto { background: transparent !important; }
div.group.ml-0 { background: rgba(24, 24, 27, 0.8) !important; border: 1px solid #3f3f46 !important; border-left: 4px solid #7f1d1d !important; padding: 12px !important; margin-bottom: 12px !important; border-radius: 0 !important; box-shadow: 0 5px 15px rgba(0,0,0,0.5) !important; }
div.group img.rounded-full { border-radius: 0 !important; border: 1px solid #4ade80 !important; filter: grayscale(60%) sepia(30%) hue-rotate(80deg) contrast(1.2) !important; }
div.text-sm.text-grey-600 span.font-bold { color: #ef4444 !important; font-family: 'Courier New', Courier, monospace !important; letter-spacing: 1px !important; }
span.text-\[10px\] { color: #a855f7 !important; border: 1px solid #a855f7 !important; padding: 0 4px !important; background: rgba(168, 85, 247, 0.1) !important; border-radius: 0 !important; }
div.text-xs.text-grey-600 { color: #71717a !important; }
div.break-all { color: #d4d4d8 !important; font-family: 'Courier New', Courier, monospace !important; line-height: 1.6 !important; margin-top: 8px !important; }
button.text-gray-400 { color: #71717a !important; }
button.text-gray-400:hover { color: #4ade80 !important; }
button.text-gray-400 svg { transition: all 0.3s !important; }
button.text-gray-400:hover svg { filter: drop-shadow(0 0 5px #4ade80) !important; transform: scale(1.1) !important; }
span.cursor-pointer { color: #a1a1aa !important; text-decoration: underline !important; text-decoration-style: dashed !important; }
span.cursor-pointer:hover { color: #ef4444 !important; }
div.ml-8.border-l { border-left-color: #3f3f46 !important; border-left-style: dashed !important; border-left-width: 2px !important; }

/* =========================================
   AI 动态对话面板：废土终端自定义组件
   ========================================= */
ai {
  display: block;
  background: #0a0a0c;
  color: #d4d4d8;
  font-family: 'Courier New', Courier, monospace !important;
  font-size: 14px;
  line-height: 1.5;
  border: 1px solid #3f3f46;
  box-shadow: inset 0 0 15px rgba(0,0,0,0.8);
  position: relative;
  overflow: hidden;
  margin-top: 10px;
}
/* 废土终端CRT扫描线 */
ai::after {
  content: "";
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%);
  background-size: 100% 4px;
  pointer-events: none; /* 确保鼠标事件穿透扫描线 */
}
/* 警告条风格头部 */
ai hd {
  display: block;
  background: repeating-linear-gradient(45deg, #18181b, #18181b 10px, #27272a 10px, #27272a 20px);
  color: #ef4444;
  padding: 8px 12px;
  font-weight: bold;
  border-bottom: 2px solid #7f1d1d;
  text-shadow: 0 0 5px rgba(239, 68, 68, 0.6);
  font-size: 13px;
  letter-spacing: 1px;
}
ai article {
  display: block;
  padding: 15px;
  color: #e4e4e7;
  text-align: justify;
}
/* 终端面板 */
ai details {
  margin: 0 12px 12px 12px;
  border: 1px solid #3f3f46;
  background: rgba(24, 24, 27, 0.8);
  position: relative;
}
ai summary {
  background: #18181b;
  color: #4ade80;
  padding: 8px 12px;
  font-weight: bold;
  cursor: pointer;
  border-bottom: 1px solid #3f3f46;
  list-style: none;
  text-shadow: 0 0 5px rgba(74, 222, 128, 0.3);
  transition: all 0.3s;
}
ai summary::-webkit-details-marker { display: none; }
ai summary:hover {
  background: #27272a;
  color: #fff;
  box-shadow: inset 0 0 10px rgba(74, 222, 128, 0.1);
}
/* 分区与动态标题 */
ai sec {
  display: block;
  padding: 10px 12px;
  border-bottom: 1px dashed #3f3f46;
}
ai sec:last-child { border-bottom: none; }
ai sec::before {
  content: attr(t);
  display: block;
  color: #a1a1aa;
  font-size: 12px;
  margin-bottom: 8px;
  font-weight: bold;
  border-left: 3px solid #7f1d1d;
  padding-left: 6px;
}
/* 紧凑数据行 */
ai d {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px 8px;
  margin-bottom: 6px;
}
ai d:last-child { margin-bottom: 0; }
ai f {
  color: #4ade80;
  font-size: 12px;
}
ai f::after { content: ":"; color: #71717a; }
ai .warn f { color: #ef4444; }
/* 畸变阈值进度条 */
ai bar {
  flex: 1;
  min-width: 80px;
  height: 12px;
  background: #000;
  border: 1px solid #3f3f46;
  position: relative;
  overflow: hidden;
}
ai bar::before {
  content: "";
  position: absolute;
  top: 0; left: 0; bottom: 0;
  width: var(--p);
  background: linear-gradient(90deg, #b45309, #ef4444);
  box-shadow: 0 0 10px rgba(239, 68, 68, 0.5);
  transition: width 0.5s ease;
}
ai b {
  color: #ef4444;
  font-family: monospace;
  font-size: 13px;
  text-shadow: 0 0 3px rgba(239, 68, 68, 0.5);
}