/* Custom additions to Tailwind */

/* Drag and drop styling */
.drag-over {
    border-top: 2px solid theme('colors.primary') !important;
}

.dragging {
    opacity: 0.5;
    background-color: theme('colors.gray.100');
}

.dark .dragging {
    background-color: theme('colors.gray.700');
}

/* Scrollbar styling for pre/code */
pre::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}
pre::-webkit-scrollbar-track {
    background: transparent; 
}
pre::-webkit-scrollbar-thumb {
    background: #cbd5e1; 
    border-radius: 4px;
}
.dark pre::-webkit-scrollbar-thumb {
    background: #475569; 
}
pre::-webkit-scrollbar-thumb:hover {
    background: #94a3b8; 
}
.dark pre::-webkit-scrollbar-thumb:hover {
    background: #64748b; 
}

/* Simple XML syntax highlighting colors applied natively via JS */
.xml-tag { color: #3b82f6; }
.dark .xml-tag { color: #60a5fa; }
.xml-attr { color: #10b981; }
.dark .xml-attr { color: #34d399; }
.xml-val { color: #f59e0b; }
.dark .xml-val { color: #fbbf24; }
.xml-content { color: #1f2937; }
.dark .xml-content { color: #e5e7eb; }
.xml-comment { color: #6b7280; font-style: italic; }
.dark .xml-comment { color: #9ca3af; }
