function saveDraft(key, content) {
    try {
        localStorage.setItem(key, content);
        localStorage.setItem(key + '_timestamp', Date.now().toString());
    } catch (e) {
        console.error('Failed to save draft:', e);
    }
}

function loadDraft(key) {
    try {
        return localStorage.getItem(key);
    } catch (e) {
        console.error('Failed to load draft:', e);
        return null;
    }
}

function clearDraft(key) {
    try {
        localStorage.removeItem(key);
        localStorage.removeItem(key + '_timestamp');
    } catch (e) {
        console.error('Failed to clear draft:', e);
    }
}

function getDraftTimestamp(key) {
    try {
        const timestamp = localStorage.getItem(key + '_timestamp');
        return timestamp ? parseInt(timestamp, 10) : null;
    } catch (e) {
        console.error('Failed to get draft timestamp:', e);
        return null;
    }
}

function formatTimeAgo(timestamp) {
    const now = Date.now();
    const diff = now - timestamp;
    const seconds = Math.floor(diff / 1000);
    const minutes = Math.floor(seconds / 60);
    const hours = Math.floor(minutes / 60);
    const days = Math.floor(hours / 24);

    if (days > 0) return `${days} day${days > 1 ? 's' : ''} ago`;
    if (hours > 0) return `${hours} hour${hours > 1 ? 's' : ''} ago`;
    if (minutes > 0) return `${minutes} minute${minutes > 1 ? 's' : ''} ago`;
    return 'just now';
}

function showDraftIndicator(content, timestamp, onRestore, onDiscard) {
    const indicator = document.createElement('div');
    indicator.className = 'draft-indicator';
    indicator.innerHTML = `
        <div class="draft-indicator-content">
            <span class="draft-indicator-icon">📝</span>
            <span class="draft-indicator-text">Draft from ${formatTimeAgo(timestamp)}</span>
            <button type="button" class="draft-indicator-button restore">Restore</button>
            <button type="button" class="draft-indicator-button discard">Discard</button>
        </div>
    `;

    const restoreBtn = indicator.querySelector('.restore');
    const discardBtn = indicator.querySelector('.discard');

    restoreBtn.addEventListener('click', () => {
        onRestore(content);
        indicator.remove();
    });

    discardBtn.addEventListener('click', () => {
        onDiscard();
        indicator.remove();
    });

    return indicator;
}