{{ if player.subsession.treatment_name == "Barg1" or player.subsession.treatment_name == "ODR1" or player.subsession.treatment_name == "OpaODR1" or player.subsession.treatment_name == "SeqODR1" or player.subsession.treatment_name == "AIODR1" or player.subsession.treatment_name == "AIODRsoph1" }}
<style>
    .otree-timer.timer-urgent-warning,
    .timer-urgent-warning {
        background: #b42318 !important;
        border-color: #8f1b13 !important;
        color: #ffffff !important;
        font-weight: 700 !important;
        box-shadow: 0 0 0 0.25rem rgba(180, 35, 24, 0.18) !important;
        animation: timerUrgentPulse 1s ease-in-out infinite;
    }

    .timer-urgent-warning *,
    .otree-timer.timer-urgent-warning .otree-timer__time-left {
        color: #ffffff !important;
        font-weight: 800 !important;
    }

    .timer-urgent-message {
        margin: -8px 0 16px;
        padding: 10px 12px;
        border-radius: 8px;
        background: #fff1f0;
        border: 1px solid #d92d20;
        color: #8f1b13;
        font-weight: 700;
        text-align: center;
    }

    @keyframes timerUrgentPulse {
        0%, 100% { transform: scale(1); }
        50% { transform: scale(1.02); }
    }
</style>

<script>
(function() {
    const warningThreshold = 15;
    let warningShown = false;
    let userInteracted = false;
    let pollTimer = null;

    document.addEventListener("pointerdown", function() {
        userInteracted = true;
    }, { once: true });

    document.addEventListener("keydown", function() {
        userInteracted = true;
    }, { once: true });

    function parseSeconds(text) {
        const cleanText = String(text || "").trim();
        const colonMatch = cleanText.match(/(\d+)\s*:\s*(\d+)/);
        if (colonMatch) {
            return Number(colonMatch[1]) * 60 + Number(colonMatch[2]);
        }

        const secondsMatch = cleanText.match(/(\d+)\s*(seconds?|secs?|s)\b/i);
        if (secondsMatch) {
            return Number(secondsMatch[1]);
        }

        const numberMatch = cleanText.match(/\d+/);
        return numberMatch ? Number(numberMatch[0]) : null;
    }

    function getTimerElements() {
        const timeLeft = document.querySelector(".otree-timer__time-left");
        const timerBox = document.querySelector(".otree-timer") || (timeLeft ? timeLeft.closest("div") : null);

        return {
            timerBox: timerBox,
            timeLeft: timeLeft || timerBox
        };
    }

    function playWarningTone() {
        if (!userInteracted || (!window.AudioContext && !window.webkitAudioContext)) {
            return;
        }

        try {
            const AudioContextClass = window.AudioContext || window.webkitAudioContext;
            const audioContext = new AudioContextClass();
            const oscillator = audioContext.createOscillator();
            const gain = audioContext.createGain();

            oscillator.type = "sine";
            oscillator.frequency.value = 880;
            gain.gain.setValueAtTime(0.001, audioContext.currentTime);
            gain.gain.exponentialRampToValueAtTime(0.18, audioContext.currentTime + 0.03);
            gain.gain.exponentialRampToValueAtTime(0.001, audioContext.currentTime + 0.35);

            oscillator.connect(gain);
            gain.connect(audioContext.destination);
            oscillator.start();
            oscillator.stop(audioContext.currentTime + 0.38);
        } catch (error) {
            // Browsers can block sound before a user gesture; the red warning still works.
        }
    }

    function showWarning(timerBox) {
        if (!timerBox || warningShown) {
            return;
        }

        warningShown = true;
        timerBox.classList.add("timer-urgent-warning");

        if (!document.querySelector(".timer-urgent-message")) {
            const message = document.createElement("div");
            message.className = "timer-urgent-message";
            message.textContent = "Bargaining time is about to end. Please submit your answer now.";
            timerBox.insertAdjacentElement("afterend", message);
        }

        playWarningTone();
    }

    function checkTime(seconds, timerBox) {
        if (seconds !== null && seconds <= warningThreshold && seconds >= 0) {
            showWarning(timerBox);
        }
    }

    function bindTimerWarning() {
        const timer = getTimerElements();
        if (!timer.timerBox || !timer.timeLeft) {
            return false;
        }

        if (window.jQuery) {
            window.jQuery(timer.timeLeft).on("update.countdown", function(event) {
                const seconds = event && event.offset ? event.offset.totalSeconds : parseSeconds(timer.timeLeft.textContent);
                checkTime(seconds, timer.timerBox);
            });
        }

        if (!pollTimer) {
            pollTimer = window.setInterval(function() {
                const currentTimer = getTimerElements();
                if (currentTimer.timerBox && currentTimer.timeLeft) {
                    checkTime(parseSeconds(currentTimer.timeLeft.textContent), currentTimer.timerBox);
                }
            }, 250);
        }

        return true;
    }

    function startTimerBinding() {
        if (bindTimerWarning()) {
            return;
        }

        const retryTimer = window.setInterval(function() {
            if (bindTimerWarning()) {
                window.clearInterval(retryTimer);
            }
        }, 250);
    }

    if (document.readyState === "loading") {
        document.addEventListener("DOMContentLoaded", startTimerBinding);
    } else {
        startTimerBinding();
    }
})();
</script>
{{ endif }}