/* 思考过程区域 - 契合当前淡绿色配色方案 */ .thinking-block { margin-bottom: 12px; border-radius: 12px; background: linear-gradient(135deg, #e8f5e9 0%, #f1f8e9 100%); border: 1px solid #a4e2ad; overflow: hidden; transition: all 0.3s ease; } .thinking-block:hover { border-color: #8dd99a; box-shadow: 0 2px 8px rgba(164, 226, 173, 0.2); } /* 思考过程头部 */ .thinking-header { display: flex; align-items: center; justify-content: space-between; padding: 10px 14px; cursor: pointer; user-select: none; background: rgba(164, 226, 173, 0.15); transition: background 0.2s ease; } .thinking-header:hover { background: rgba(164, 226, 173, 0.25); } .thinking-header:active { background: rgba(164, 226, 173, 0.35); } .thinking-title { display: flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 500; color: #2e7d32; } .thinking-icon { font-size: 16px; color: #66bb6a; } .thinking-label { font-weight: 500; } .thinking-toggle { display: flex; align-items: center; } .toggle-icon { font-size: 12px; color: #66bb6a; transition: transform 0.3s ease; } /* 思考内容区域 */ .thinking-content { padding: 12px 14px; background: rgba(255, 255, 255, 0.5); border-top: 1px solid rgba(164, 226, 173, 0.3); animation: expandContent 0.3s ease-out; } @keyframes expandContent { from { opacity: 0; max-height: 0; padding-top: 0; padding-bottom: 0; } to { opacity: 1; max-height: 1000px; padding-top: 12px; padding-bottom: 12px; } } .thinking-text { font-size: 13px; line-height: 1.6; color: #37474f; white-space: pre-wrap; word-wrap: break-word; font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif; } .thinking-paragraph { margin: 0 0 8px 0; padding: 0; } .thinking-paragraph:last-child { margin-bottom: 0; } /* 响应式设计 */ @media (max-width: 768px) { .thinking-block { border-radius: 10px; margin-bottom: 10px; } .thinking-header { padding: 8px 12px; } .thinking-title { font-size: 13px; } .thinking-icon { font-size: 14px; } .thinking-content { padding: 10px 12px; } .thinking-text { font-size: 12px; line-height: 1.5; } } @media (max-width: 480px) { .thinking-block { border-radius: 8px; margin-bottom: 8px; } .thinking-header { padding: 6px 10px; } .thinking-title { font-size: 12px; } .thinking-icon { font-size: 13px; } .toggle-icon { font-size: 11px; } .thinking-content { padding: 8px 10px; } .thinking-text { font-size: 11px; } .thinking-paragraph { margin-bottom: 6px; } }