/**
 * Bottom sheet with click and drag support.
 * Visible only on small screens (CSS handles display).
 */
var BottomSheet = (function () {
    var sheet, backdrop, handle, content;
    var isOpen = false;
    var dragging = false;
    var startY = 0;
    var maxHeight = 0;

    function init() {
        sheet = document.getElementById('bottom-sheet');
        backdrop = document.getElementById('bottom-sheet-backdrop');
        handle = document.getElementById('bottom-sheet-handle');
        content = sheet ? sheet.querySelector('.bottom-sheet-content') : null;
        if (!sheet || !handle || !content) return;

        // Click to toggle
        handle.addEventListener('click', function () {
            if (dragging) return;
            toggle();
        });

        if (backdrop) {
            backdrop.addEventListener('click', close);
        }

        // Touch drag (handle + content)
        handle.addEventListener('touchstart', onDragStart, { passive: true });
        content.addEventListener('touchstart', onDragStart, { passive: true });
        document.addEventListener('touchmove', onDragMove, { passive: false });
        document.addEventListener('touchend', onDragEnd);

        // Mouse drag (handle + content)
        handle.addEventListener('mousedown', onDragStart);
        content.addEventListener('mousedown', onDragStart);
        document.addEventListener('mousemove', onDragMove);
        document.addEventListener('mouseup', onDragEnd);
    }

    function getMaxHeight() {
        // Temporarily expand to measure natural height
        content.style.maxHeight = 'none';
        var h = content.scrollHeight;
        content.style.maxHeight = '';
        return h;
    }

    function open() {
        isOpen = true;
        sheet.classList.add('open');
        if (backdrop) backdrop.classList.add('open');
    }

    function close() {
        isOpen = false;
        sheet.classList.remove('open');
        content.style.maxHeight = '';
        if (backdrop) {
            backdrop.classList.remove('open');
            backdrop.style.opacity = '';
        }
    }

    function toggle() {
        if (isOpen) { close(); } else { open(); }
    }

    function getClientY(e) {
        if (e.touches && e.touches.length) return e.touches[0].clientY;
        return e.clientY;
    }

    function onDragStart(e) {
        dragging = false;
        startY = getClientY(e);
        maxHeight = getMaxHeight();
        sheet.classList.add('dragging');
    }

    function onDragMove(e) {
        if (startY === 0) return;
        var currentY = getClientY(e);
        var delta = currentY - startY;

        if (!dragging && Math.abs(delta) > 5) {
            dragging = true;
        }
        if (!dragging) return;

        if (e.cancelable) e.preventDefault();

        var currentHeight;
        if (isOpen) {
            currentHeight = Math.max(0, Math.min(maxHeight, maxHeight - delta));
        } else {
            currentHeight = Math.max(0, Math.min(maxHeight, -delta));
        }

        content.style.maxHeight = currentHeight + 'px';

        // Fade backdrop proportionally
        if (backdrop) {
            var progress = maxHeight > 0 ? currentHeight / maxHeight : 0;
            backdrop.style.opacity = progress * 0.5;
            backdrop.classList.add('open');
            backdrop.style.pointerEvents = progress > 0.1 ? 'auto' : 'none';
        }
    }

    function onDragEnd() {
        if (startY === 0) return;
        sheet.classList.remove('dragging');

        if (dragging) {
            var currentPx = parseInt(content.style.maxHeight) || 0;
            var progress = maxHeight > 0 ? currentPx / maxHeight : 0;

            content.style.maxHeight = '';
            if (backdrop) {
                backdrop.style.opacity = '';
                backdrop.style.pointerEvents = '';
            }

            if (progress > 0.3) {
                open();
            } else {
                close();
            }
        }

        startY = 0;
        setTimeout(function () { dragging = false; }, 0);
    }

    return { init: init, open: open, close: close, toggle: toggle };
})();
