// Timestamp localization
document.querySelectorAll('time[data-timestamp]').forEach(function(el) {
    const timestamp = el.getAttribute('data-timestamp');
    const date = new Date(timestamp);
    const now = new Date();
    const isToday = date.toDateString() === now.toDateString();
    const timeStr = date.toLocaleTimeString(undefined, { hour: '2-digit', minute: '2-digit' });
    if (isToday) { el.textContent = timeStr; }
    else { el.textContent = date.toLocaleDateString(undefined, { month: 'short', day: 'numeric' }) + ' ' + timeStr; }
});

// JSON syntax highlighting
document.querySelectorAll('pre.json').forEach(function(el) {
    let text = el.textContent;
    text = text.replace(/"([^"]+)":/g, '<span style="color: #ce93d8">"$1"</span>:');
    text = text.replace(/: "([^"]*)"/g, ': <span style="color: #81d4fa">"$1"</span>');
    text = text.replace(/: (\d+)/g, ': <span style="color: #ffcc80">$1</span>');
    text = text.replace(/: (true|false|null)/g, ': <span style="color: #f48fb1">$1</span>');
    el.innerHTML = text;
});

// Truncatable content
document.querySelectorAll('.truncatable').forEach(function(wrapper) {
    const content = wrapper.querySelector('.truncatable-content');
    const btn = wrapper.querySelector('.expand-btn');
    if (content && btn) {
        // Always set up the click handler
        btn.addEventListener('click', function() {
            if (wrapper.classList.contains('truncated')) {
                wrapper.classList.remove('truncated');
                wrapper.classList.add('expanded');
                btn.textContent = 'Show less';
            } else {
                wrapper.classList.remove('expanded');
                wrapper.classList.add('truncated');
                btn.textContent = 'Show more';
            }
        });
        // Use requestAnimationFrame to check scrollHeight after layout
        requestAnimationFrame(function() {
            if (content.scrollHeight > 250) {
                wrapper.classList.add('truncated');
            }
        });
    }
});
