/* ============================================
   被全班霸凌的她 · 天台暮色主题
   与详情页统一视觉
   ============================================ */

pre {
  white-space: pre-wrap !important;
  word-wrap: break-word !important;
  font-family: 'Menlo', 'Consolas', 'Microsoft YaHei', monospace !important;
}

/* ============ 状态栏折叠区 ============ */
details {
  background: #1c2230 !important;
  border: 1px solid #36405a !important;
  border-radius: 4px !important;
  margin: 14px 0 !important;
  padding: 0 !important;
  transition: all 0.3s ease !important;
  overflow: hidden !important;
}

details[open] {
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35) !important;
  border-color: #4a5568 !important;
}

details summary {
  color: #d9a05b !important;
  font-size: 13px !important;
  padding: 11px 18px !important;
  cursor: pointer !important;
  letter-spacing: 2px !important;
  transition: all 0.2s ease !important;
  outline: none !important;
  user-select: none !important;
  list-style: none !important;
  background: linear-gradient(180deg, #232b3d 0%, #1f2637 100%) !important;
  font-family: 'Songti SC', 'STSong', 'SimSun', serif !important;
}

details summary::-webkit-details-marker {
  display: none !important;
}

details summary:hover {
  color: #e8b87a !important;
  background: linear-gradient(180deg, #283148 0%, #232b3d 100%) !important;
}

details pre {
  color: #c8ccd8 !important;
  background: transparent !important;
  padding: 8px 18px 16px 18px !important;
  font-size: 12px !important;
  line-height: 1.9 !important;
  border: none !important;
  margin: 0 !important;
}

/* ============ 代码块 · 行动选项 ============ */
:not(details) > pre {
  background: #232b3d !important;
  border: 1px solid #36405a !important;
  border-left: 3px solid #b03a3a !important;
  border-radius: 3px !important;
  padding: 12px 16px !important;
  color: #e6e4de !important;
  font-size: 13px !important;
  line-height: 1.8 !important;
  margin: 8px 0 !important;
  transition: all 0.25s ease !important;
  cursor: pointer !important;
}

:not(details) > pre:hover {
  border-left-color: #d9a05b !important;
  background: #283148 !important;
  box-shadow: 0 2px 8px rgba(217, 160, 91, 0.15) !important;
  transform: translateX(2px) !important;
}

/* ============ 消息气泡 ============ */
[class*="message-ai"],
[class*="assistant-message"],
[class*="ai-message"],
[class*="bot-message"] {
  background: #1c2230 !important;
  border: 1px solid #36405a !important;
  border-left: 2px solid #d9a05b !important;
  border-radius: 6px !important;
  padding: 16px 20px !important;
  color: #e6e4de !important;
  line-height: 1.95 !important;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.25) !important;
}

[class*="message-user"],
[class*="user-message"] {
  background: #232b3d !important;
  border: 1px solid #36405a !important;
  border-radius: 6px !important;
  padding: 14px 18px !important;
  color: #e6e4de !important;
  line-height: 1.9 !important;
}

/* ============ 输入框 ============ */
textarea,
input[type="text"],
[class*="input-area"] textarea,
[class*="chat-input"] textarea {
  background: #141924 !important;
  border: 1px solid #36405a !important;
  color: #e6e4de !important;
  border-radius: 6px !important;
  transition: all 0.3s ease !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
}

textarea:focus,
input[type="text"]:focus,
[class*="input-area"] textarea:focus,
[class*="chat-input"] textarea:focus {
  border-color: #d9a05b !important;
  box-shadow: 0 0 0 3px rgba(217, 160, 91, 0.15) !important;
  outline: none !important;
}

textarea::placeholder,
input[type="text"]::placeholder {
  color: #5a6476 !important;
}

/* ============ 发送按钮 ============ */
[class*="send-button"],
button[class*="send"],
button[class*="submit"],
[class*="btn-send"] {
  background: linear-gradient(180deg, #b03a3a 0%, #8a2e2e 100%) !important;
  border: none !important;
  color: #ffffff !important;
  border-radius: 4px !important;
  transition: all 0.3s ease !important;
  font-weight: 500 !important;
  letter-spacing: 2px !important;
}

[class*="send-button"]:hover,
button[class*="send"]:hover,
button[class*="submit"]:hover,
[class*="btn-send"]:hover {
  background: linear-gradient(180deg, #c14a4a 0%, #9a3434 100%) !important;
  box-shadow: 0 3px 10px rgba(176, 58, 58, 0.3) !important;
  transform: translateY(-1px) !important;
}

/* ============ 移动端 ============ */
@media (max-width: 768px) {
  details summary {
    font-size: 12px !important;
    padding: 10px 14px !important;
  }
  details pre {
    font-size: 11px !important;
    padding: 6px 14px 14px 14px !important;
  }
  :not(details) > pre {
    font-size: 12px !important;
    padding: 10px 14px !important;
  }
  [class*="message-ai"],
  [class*="message-user"] {
    padding: 12px 14px !important;
    font-size: 14px !important;
  }
}