/* Плавающая кнопка */
.feedback-button {
        display: block;
        position: fixed;
        bottom: 0;    /* Прикрепляем к нижней части экрана, когда футер скрыт */
        left: 50%;
        transform: translateX(-50%);
        background-color: #6DBE45;
        color: white;
        border: none;
        padding: 3px 30px;
        font-size: 1rem;
        border-radius: 30px 30px 0 0;  /* Закругление только верхних углов */
        cursor: pointer;
        z-index: 10;
        transition: background-color 0.3s;
        width: 150px;
    }


.feedback-button:hover {
    background-color: #4A9A36;
    }


/* Форма с отзывами */
.feedback-form {
  display: block;
  position: fixed;
  bottom: -350px; /* Начальное положение за нижним краем */
   left: 50%; /*  Смещаем по горизонтали на 50% от ширины окна */
  transform: translateX(-50%); /* Сдвигаем форму на 50% её ширины влево */
  width: 300px; /* Ширина формы */
  background-color: white;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
  padding: 20px;
  border-radius: 8px;
  transition: bottom 0.5s ease-in-out; /* Плавное выдвижение */
  z-index: 999; /* Поверх контента */
}


/* Когда форма активна (выдвигается) */
#feedback-form.open {
  bottom: 0; /* Форма будет выдвигаться наверх */
}

/* Стиль для textarea */
#feedback-text {
  width: 100%;
  height: 150px; /* Устанавливаем фиксированную высоту */
  margin-bottom: 10px;
  padding: 10px;
  border: 1px solid #ccc;
  border-radius: 4px;
  resize: none; /* Запрещаем изменение размера пользователем */
}

/* Кнопка отправки отзыва */
#submit-feedback {
  background-color: rgba(73, 204, 144, .3); /* Зеленый фон */
  border: none;
  padding: 10px;
  border-radius: 10px;
  cursor: pointer;
  width: 100%;
  font-size: 16px;
}

#submit-feedback:hover {
  background-color: rgba(73, 204, 144, .5); /* Зеленый фон */
  transform: translateY(-2px); /* Легкий подъем кнопки */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* Легкая тень при наведении */
}

/* Кнопка закрытия */
#close-feedback {
  background-color: rgba(249, 62, 62, .3); /* Красный фон */
  border: none;
  padding: 10px;
  border-radius: 10px;
  cursor: pointer;
  width: 100%;
  margin-top: 10px;
}

#close-feedback:hover {
    background-color: rgba(249, 62, 62, .5); /* Красный фон */
  transform: translateY(-2px); /* Легкий подъем кнопки */
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15); /* Легкая тень при наведении */
}

/* Адаптивность */
@media (max-width: 760px) {
/* Плавающая кнопка */
.feedback-button {
        display: block;
        position: fixed;
        bottom: 0;    /* Прикрепляем к нижней части экрана, когда футер скрыт */
        left: 80%;
        transform: translateX(-50%);
        background-color: #4CAF50;
        color: white;
        border: none;
        padding: 3px 30px;
        font-size: 1rem;
        border-radius: 30px 30px 0 0;  /* Закругление только верхних углов */
        cursor: pointer;
        z-index: 10;
        transition: background-color 0.3s;
        width: 150px;
    }
}