/**
 * Sentiment Controller - Maintains 3px gap with original positioning
 * Seller near top percentage, Buyer near bottom percentage
 */

class SentimentController {
    constructor() {
        this.buyerSection = document.querySelector('.buyer-section');
        this.sellerSection = document.querySelector('.seller-section');
        this.container = document.querySelector('.buyer-seller-indicator');
        
        this.init();
    }

    init() {
        // Prevent any external scripts from overriding our positioning
        this.maintainGap();
        
        // Set up observer for external changes
        this.observeChanges();
    }

    maintainGap() {
        if (this.sellerSection) {
            // Set positioning but allow height animations
            this.sellerSection.style.position = 'absolute';
            this.sellerSection.style.top = '20px';
            this.sellerSection.style.left = '50%';
            this.sellerSection.style.transform = 'translateX(-50%)';
            // Remove height override to allow animations
        }

        if (this.buyerSection) {
            // Set positioning but allow height animations
            this.buyerSection.style.position = 'absolute';
            this.buyerSection.style.bottom = '22px';
            this.buyerSection.style.left = '50%';
            this.buyerSection.style.transform = 'translateX(-50%)';
            // Remove height override to allow animations
        }
    }

    observeChanges() {
        // Disable observer to allow full animation control
        // The CSS positioning is sufficient
    }

}

// Initialize immediately
if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', () => {
        window.sentimentController = new SentimentController();
    });
} else {
    window.sentimentController = new SentimentController();
}