@@ -214,4 +214,142 @@ body {
214214 vertical-align : middle;
215215}
216216
217+ /* Custom styles for Thinking details box */
218+ .thinking-details summary {
219+ list-style : none;
220+ outline : none;
221+ }
222+ .thinking-details summary ::-webkit-details-marker {
223+ display : none;
224+ }
225+ .thinking-details summary ::after {
226+ content : "▲" ;
227+ font-size : 0.7rem ;
228+ transition : transform 0.25s ease;
229+ opacity : 0.6 ;
230+ }
231+ .thinking-details [open ] summary ::after {
232+ transform : rotate (180deg );
233+ }
234+
235+ /* Smooth scrollbar and container setup */
236+ # chat-messages-container {
237+ scroll-behavior : smooth;
238+ scrollbar-width : thin;
239+ }
240+ # chat-messages-container ::-webkit-scrollbar {
241+ width : 6px ;
242+ }
243+ # chat-messages-container ::-webkit-scrollbar-track {
244+ background : transparent;
245+ }
246+ # chat-messages-container ::-webkit-scrollbar-thumb {
247+ background-color : rgba (155 , 155 , 155 , 0.2 );
248+ border-radius : 20px ;
249+ }
250+ .dark # chat-messages-container ::-webkit-scrollbar-thumb {
251+ background-color : rgba (255 , 255 , 255 , 0.1 );
252+ }
253+
254+ /* Custom Syntax Highlighting Styles (Highlight.js compatible) */
255+ /* Light mode colors */
256+ .markdown-content .hljs-comment ,
257+ .markdown-content .hljs-quote {
258+ color : # 6a737d ;
259+ font-style : italic;
260+ }
261+ .markdown-content .hljs-keyword ,
262+ .markdown-content .hljs-selector-tag ,
263+ .markdown-content .hljs-subst {
264+ color : # d73a49 ;
265+ font-weight : 500 ;
266+ }
267+ .markdown-content .hljs-string ,
268+ .markdown-content .hljs-regexp ,
269+ .markdown-content .hljs-addition {
270+ color : # 032f62 ;
271+ }
272+ .markdown-content .hljs-number ,
273+ .markdown-content .hljs-literal ,
274+ .markdown-content .hljs-symbol ,
275+ .markdown-content .hljs-bullet {
276+ color : # 005cc5 ;
277+ }
278+ .markdown-content .hljs-title ,
279+ .markdown-content .hljs-section ,
280+ .markdown-content .hljs-name {
281+ color : # 6f42c1 ;
282+ }
283+ .markdown-content .hljs-type ,
284+ .markdown-content .hljs-built_in ,
285+ .markdown-content .hljs-class {
286+ color : # e36209 ;
287+ }
288+ .markdown-content .hljs-variable ,
289+ .markdown-content .hljs-template-variable ,
290+ .markdown-content .hljs-attr {
291+ color : # 24292e ;
292+ }
293+ .markdown-content .hljs-meta {
294+ color : # 005cc5 ;
295+ font-weight : 500 ;
296+ }
297+ .markdown-content .hljs-doctag {
298+ color : # d73a49 ;
299+ }
300+ .markdown-content .hljs-emphasis {
301+ font-style : italic;
302+ }
303+ .markdown-content .hljs-strong {
304+ font-weight : bold;
305+ }
306+
307+ /* Dark mode colors */
308+ .dark .markdown-content .hljs-comment ,
309+ .dark .markdown-content .hljs-quote {
310+ color : # 8b949e ;
311+ font-style : italic;
312+ }
313+ .dark .markdown-content .hljs-keyword ,
314+ .dark .markdown-content .hljs-selector-tag ,
315+ .dark .markdown-content .hljs-subst {
316+ color : # ff7b72 ;
317+ font-weight : 500 ;
318+ }
319+ .dark .markdown-content .hljs-string ,
320+ .dark .markdown-content .hljs-regexp ,
321+ .dark .markdown-content .hljs-addition {
322+ color : # a5d6ff ;
323+ }
324+ .dark .markdown-content .hljs-number ,
325+ .dark .markdown-content .hljs-literal ,
326+ .dark .markdown-content .hljs-symbol ,
327+ .dark .markdown-content .hljs-bullet {
328+ color : # 79c0ff ;
329+ }
330+ .dark .markdown-content .hljs-title ,
331+ .dark .markdown-content .hljs-section ,
332+ .dark .markdown-content .hljs-name {
333+ color : # d2a8ff ;
334+ }
335+ .dark .markdown-content .hljs-type ,
336+ .dark .markdown-content .hljs-built_in ,
337+ .dark .markdown-content .hljs-class {
338+ color : # ff9b50 ;
339+ }
340+ .dark .markdown-content .hljs-variable ,
341+ .dark .markdown-content .hljs-template-variable ,
342+ .dark .markdown-content .hljs-attr {
343+ color : # c9d1d9 ;
344+ }
345+ .dark .markdown-content .hljs-meta {
346+ color : # 79c0ff ;
347+ font-weight : 500 ;
348+ }
349+ .dark .markdown-content .hljs-doctag {
350+ color : # ff7b72 ;
351+ }
352+
353+
354+
217355
0 commit comments