/* Временный файл для отладки проблем со скроллингом */
/* Удалить этот файл после решения проблемы */

/* 1. Убедимся, что основные элементы не блокируют скроллинг */
html, body {
    overflow: visible !important;
    position: relative !important;
    height: auto !important;
    max-height: none !important;
}

/* 2. Проверка наложения элементов */
.debug-overlay * {
    outline: 1px solid rgba(255, 0, 0, 0.2) !important;
}

.debug-overlay .glowing-strips-container {
    outline: 2px solid blue !important;
    background-color: rgba(0, 0, 255, 0.05) !important;
}

.debug-overlay .header {
    outline: 2px solid green !important;
    background-color: rgba(0, 255, 0, 0.05) !important;
}

/* 3. Временное отключение сложных анимаций для тестирования */
.debug-no-animations * {
    animation: none !important;
    transition: none !important;
    transform: none !important;
}

.debug-no-animations .glowing-strip {
    display: none !important;
}

/* 4. Проверка фиксированных элементов */
.debug-fixed-elements [style*="fixed"],
.debug-fixed-elements .header,
.debug-fixed-elements .messenger-buttons,
.debug-fixed-elements .confetti-toggle {
    position: relative !important;
    top: auto !important;
    bottom: auto !important;
}

/* 5. Проверка z-index */
.debug-z-index * {
    z-index: auto !important;
}

/* 6. Классы для пошаговой отладки */
/* Добавьте class="debug-overlay" к body для проверки наложения */
/* Добавьте class="debug-no-animations" к body для отключения анимаций */
/* Добавьте class="debug-fixed-elements" к body для проверки фиксированных элементов */
/* Добавьте class="debug-z-index" к body для проверки z-index */

/* 7. Визуальные индикаторы для отладки */
.debug-scroll-indicator {
    position: fixed;
    top: 10px;
    right: 10px;
    background: #ff4444;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 99999;
    display: none;
}

.debug-scroll-indicator.active {
    display: block;
}

/* 8. Стили для консоли отладки */
.debug-console {
    position: fixed;
    bottom: 10px;
    left: 10px;
    background: rgba(0, 0, 0, 0.8);
    color: #0f0;
    padding: 10px;
    border-radius: 4px;
    font-family: monospace;
    font-size: 12px;
    z-index: 99999;
    max-width: 300px;
    max-height: 200px;
    overflow: auto;
    display: none;
}

.debug-console.active {
    display: block;
}

/* 9. Кнопка включения/выключения отладки */
.debug-toggle {
    position: fixed;
    bottom: 10px;
    right: 10px;
    background: #4444ff;
    color: white;
    border: none;
    padding: 8px 12px;
    border-radius: 4px;
    cursor: pointer;
    z-index: 99999;
    font-size: 12px;
}

/* 10. Сброс потенциально проблемных стилей */
.debug-reset {
    /* Сброс всех потенциально проблемных свойств */
    overflow: visible !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
    position: static !important;
    height: auto !important;
    width: auto !important;
    max-height: none !important;
    max-width: none !important;
    min-height: 0 !important;
    min-width: 0 !important;
    transform: none !important;
    filter: none !important;
    backdrop-filter: none !important;
    pointer-events: auto !important;
    user-select: auto !important;
    touch-action: auto !important;
}

/* 11. Стили для отладки горизонтального скроллинга */
.debug-horizontal-scroll * {
    box-shadow: inset 0 0 0 1px rgba(0, 255, 255, 0.3) !important;
}

.debug-horizontal-scroll .container {
    box-shadow: inset 0 0 0 2px #ff00ff !important;
    background-color: rgba(255, 0, 255, 0.05) !important;
}

.debug-horizontal-scroll .glowing-strip {
    box-shadow: inset 0 0 0 2px #00ff00 !important;
    background-color: rgba(0, 255, 0, 0.05) !important;
}

/* Индикатор горизонтального скроллинга */
.debug-horizontal-indicator {
    position: fixed;
    top: 40px;
    right: 10px;
    background: #ff8800;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    font-size: 12px;
    z-index: 99999;
    display: none;
}

.debug-horizontal-indicator.active {
    display: block;
}

/* Стили для устранения горизонтального скроллинга */
.no-horizontal-scroll {
    overflow-x: hidden !important;
    max-width: 100vw !important;
}

.no-horizontal-scroll body {
    overflow-x: hidden !important;
    width: 100% !important;
}

.no-horizontal-scroll .container {
    max-width: 100% !important;
    overflow-x: hidden !important;
}

.no-horizontal-scroll .glowing-strips-container {
    width: 100% !important;
    left: 0 !important;
    right: 0 !important;
}

/* Выделение элементов, выходящих за границы */
.element-out-of-bounds {
    outline: 3px solid #ff0000 !important;
    background-color: rgba(255, 0, 0, 0.1) !important;
}