document.addEventListener('DOMContentLoaded', () => {
    document.querySelectorAll('.custom-syntax-highlighter').forEach(block => {
        // Add line numbers
        const code = block.querySelector('code');
        const lines = code.textContent.split('\n');
        code.innerHTML = lines.map((line, i) => `<span class="line-number">${i + 1}</span><span class="code-line">${line}</span>`).join('\n');

        // Add copy button
        const copyButton = document.createElement('button');
        copyButton.className = 'copy-button';
        copyButton.textContent = 'Copy';
        block.appendChild(copyButton);

        copyButton.addEventListener('click', () => {
            const plainText = lines.join('\n'); // Extract plain text
            navigator.clipboard.writeText(plainText).then(() => {
                copyButton.textContent = 'Copied!';
                setTimeout(() => copyButton.textContent = 'Copy', 2000);
            }).catch(err => {
                console.error('Error copying text: ', err);
                copyButton.textContent = 'Error';
            });
        });
    });
});