#scrollToTop {
    display: none; /* Скрыта по умолчанию */
}

.floating-button {
    position: fixed;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px; /* Расстояние между иконкой и текстом */
    padding: 10px 16px;
    font-size: 20px;
    border: none;
    border-radius: 8px;
    background-color: #d95f24; 
    color: #ffffff; /* Базовый цвет текста для этого блока */
    cursor: pointer;
    z-index: 900;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5), inset 0 2px 2px rgba(255, 255, 255, 0.2), inset 0 -2px 2px rgba(0, 0, 0, 0.2);
    /* text-shadow: 0 1px 0 #68402280 !important; */
    /* opacity: 0.85; */
    transition: background-color 0.3s, opacity 0.3s, top 0.1s linear;

    
    

    
}

.floating-button:hover {
    background-color: #d95f24;
    opacity: 1;
}

.floating-button.left {
    bottom: 20px; /* Прижимаем к нижнему краю */
    left: 20px;
}

.floating-button.right {
    /* Отступ сверху зависит от того, насколько спрятан хедер */
    /* Для многострочного текста лучше выравнивать иконку по верху */
    align-items: flex-start;
    /* Немного увеличим отступ сверху, чтобы иконка не прилипала к краю */
    padding-top: 15px;
    top: calc((var(--header-height) + 100px) - (var(--header-height) * var(--header-hide-progress)));
    right: 20px;
}

/* Сохраняем выравнивание текста по левому краю внутри кнопки "Позвонить" */
.floating-button.right .button-text-wrapper {
    text-align: left;
	margin-bottom: 0.5em;
}

/* На экранах, где может начаться наложение, меняем текст */
@media (max-width: 1500px) {
    /* На узких экранах превращаем кнопки в круглые иконки без текста */
    .floating-button {
        width: 50px;
        height: 50px;
        border-radius: 50%; /* Делаем кнопку круглой */
        padding: 0; /* Убираем внутренние отступы, чтобы иконка была по центру */
    }

    /* Скрываем все текстовые элементы внутри кнопок */
    .floating-button span, .floating-button .button-text-wrapper {
        display: none;
    }

    /* Сбрасываем специфичные стили для правой кнопки, чтобы иконка была по центру */
    .floating-button.right {
        align-items: center;
        padding-top: 0;
    }
}

/* Для сверхшироких экранов, чтобы кнопки не "улетали" к краям */
/* 1600px = 1200px (контейнер) + ~200px (кнопка) * 2 */
@media (min-width: 1600px) {
    .floating-button.left {
        /* Вычисляем положение: 50% (центр экрана) - 600px (половина контейнера) - 20px (отступ) */
        /* Затем сдвигаем кнопку влево на её собственную ширину, чтобы она была слева от контента */
        left: calc(50% - 600px - 20px);
        transform: translateX(-100%);
    }

    .floating-button.right {
        /* Убираем привязку к правому краю */
        right: auto;
        /* Вычисляем положение: 50% (центр экрана) + 600px (половина контейнера) + 20px (отступ) */
        left: calc(50% + 600px + 20px);
    }
}
