/**
 * Professional Dropdown Component
 */
class Dropdown {
    constructor() {
        this.duration = 250;
        this.isTouch = 'ontouchstart' in window || navigator.maxTouchPoints > 0;
        this.init();
        this.initGlobalEvents();
    }

    /**
     * Initialize dropdown elements
     */
    init() {
        document.querySelectorAll('.js-dropdown:not(.js-dropdown-initialized)').forEach(dropdown => {
            const trigger = dropdown.querySelector('.rt-dropdown__toggle');
            const content = dropdown.querySelector('.rt-dropdown__content');
            if (!trigger || !content) return;

            dropdown.classList.add('js-dropdown-initialized');
            const mode = this.isTouch ? 'click' : (dropdown.dataset.trigger || 'hover');

            if (mode === 'hover') {
                dropdown.addEventListener('mouseenter', () => this.open(dropdown, content));
                dropdown.addEventListener('mouseleave', () => this.close(dropdown, content));
            } else {
                trigger.addEventListener('click', (e) => {
                    // Allow clicks inside content area
                    if (e.target.closest('.rt-dropdown__content')) return;

                    e.preventDefault();
                    e.stopPropagation();

                    dropdown.classList.contains('is-open') ? this.close(dropdown, content) : this.open(dropdown, content);
                });
            }
        });
    }

    /**
     * Open Dropdown
     */
    open(dropdown, content) {
        if (dropdown.classList.contains('is-open')) return;
        this.closeAll();

        // Use requestAnimationFrame to avoid forced reflow after closeAll() writes
        window.requestAnimationFrame(() => {
            // Lightweight alignment check
            dropdown.classList.remove('is-align-right');
            const rect = content.getBoundingClientRect();
            const viewportWidth = window.innerWidth || document.documentElement.clientWidth;

            if (rect.right > viewportWidth) {
                dropdown.classList.add('is-align-right');
            }

            dropdown.classList.add('is-open', 'is-active');
        });
    }

    /**
     * Close Dropdown
     */
    close(dropdown, content) {
        dropdown.classList.remove('is-open', 'is-active');
    }

    /**
     * Close all active dropdowns
     */
    closeAll() {
        document.querySelectorAll('.rt-dropdown.is-open').forEach(opened => {
            const content = opened.querySelector('.rt-dropdown__content');
            this.close(opened, content);
        });
    }

    /**
     * Handle global events (click outside)
     */
    initGlobalEvents() {
        if (window.rtDropdownEventsBound) return;
        document.addEventListener('click', (e) => {
            if (!e.target.closest('.rt-dropdown')) {
                this.closeAll();
            }
        });
        window.rtDropdownEventsBound = true;
    }
}

// Initialize on DOM Ready
document.addEventListener('DOMContentLoaded', () => {
    window.kubelioDropdown = new Dropdown();
});
