.notification {
    position: fixed; /* Элемент фиксируется относительно окна браузера, остается на месте при прокрутке */
    top: 20px; /* Отступ элемента от верхнего края окна браузера составляет 20 пикселей */
    left: 50%; /* Позиционирование элемента по горизонтали в центре, отступая на 50% ширины родительского элемента от левого края */
    transform: translateX(-50%); /* Смещение элемента на 50% его ширины влево от текущего положения для центрирования */
    background-color: rgba(36, 143, 234, 0.64); /* Цвет фона элемента с прозрачностью */
    color: #333; /* Цвет текста внутри элемента */
    padding: 10px; /* Внутренние отступы вокруг содержимого элемента со всех сторон */
    border-radius: 5px; /* Радиус скругления углов рамки элемента */
    box-shadow: 0px 0px 5px rgba(0,0,0,0.2); /* Тень вокруг элемента */
    display: none; /* Элемент изначально не отображается */
    z-index: 1000; /* Значение на оси Z, элемент будет расположен поверх других элементов с меньшим z-index */
}

.ymaps-2-1-79-balloon__layout,
.ymaps-2-1-79-balloon__content,
.ymaps-2-1-79-balloon__tail:after {
    background-color: blue !important;  /* Цвет фона */
    color: #ffffff !important; /* Цвет текста внутри элемента */
}

.approve-button {
  background-color: red; /* Красный фон кнопки */
  color: white; /* Белый цвет текста на кнопке */
  border: none; /* Убираем рамку кнопки */
  padding: 10px 15px; /* Внутренние отступы: 10px сверху и снизу, 15px слева и справа */
  cursor: pointer; /* Указатель мыши при наведении на кнопку */
  font-size: 14px; /* Размер шрифта текста на кнопке */
  border-radius: 5px; /* Скругленные углы кнопки */
  transition: background-color 0.3s ease; /* Плавный переход фона кнопки при наведении (0.3 секунды) */
}

.approve-button:hover {
  background-color: darkred; /* Темно-красный фон при наведении на кнопку */
}

.button-point{
  background-color: red; /* Красный фон кнопки */
  color: white; /* Белый цвет текста на кнопке */
  border: none; /* Убираем рамку кнопки */
  padding: 10px 15px; /* Внутренние отступы: 10px сверху и снизу, 15px слева и справа */
  cursor: pointer; /* Указатель мыши при наведении на кнопку */
  font-size: 14px; /* Размер шрифта текста на кнопке */
  border-radius: 5px; /* Скругленные углы кнопки */
  transition: background-color 0.3s ease; /* Плавный переход фона кнопки при наведении (0.3 секунды) */
}

.cancel{
  background-color: gray; /* Серый фон кнопки Отмены */
}

.ymaps-2-1-79-balloon__content {
    transform: scale(1.15) !important; /* Увеличение контента балуна на 15%, применяется ко всем осям */
}

.ymaps-2-1-79-balloon__layout {
    padding: 12.5px !important; /* Увеличиваем padding (отступы внутри) балуна на 25% (от базового значения 10px) */
}

.balloon-button {
  display: inline-block; /* Кнопка отображается как блочный элемент, но в строке */
  width: 100%; /* Кнопка занимает всю доступную ширину */
  margin: 5px 0; /* Отступы сверху и снизу по 5px */
  padding: 10px; /* Внутренние отступы кнопки: 10px со всех сторон */
  font-size: 16px; /* Размер шрифта кнопки */
  background-color: #f0f0f0; /* Светло-серый фон кнопки */
  border: 1px solid #ccc; /* Серый цвет рамки */
  cursor: pointer; /* Указатель мыши при наведении */
  text-align: center; /* Выравнивание текста кнопки по центру */
}

.balloon-button:hover {
  background-color: #e0e0e0; /* Более темный серый фон при наведении */
}

.modal {
  display: none; /* Модальное окно скрыто по умолчанию */
  position: fixed; /* Окно фиксируется относительно экрана */
  z-index: 1000; /* Высокий приоритет отображения окна (над другими элементами) */
  left: 50%; /* Центрируем окно по горизонтали относительно середины экрана */
  bottom: 0; /* Окно закреплено внизу экрана */
  transform: translateX(-50%); /* Сдвиг окна влево на 50% его ширины для центрирования */
  width: 70%; /* Ширина окна составляет 70% от ширины экрана */
  background-color: rgba(255, 165, 0, 0.8); /* Полупрозрачный оранжевый фон (80% непрозрачности) */
  padding: 20px; /* Внутренние отступы окна: 20px со всех сторон */
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3); /* Тень вокруг окна для создания эффекта "подъема" */
  border-radius: 10px 10px 0 0; /* Скругленные углы окна сверху */
  text-align: center; /* Текст и элементы внутри окна выровнены по центру */
}

.modal-button-container {
  display: flex; /* Используем Flexbox для организации кнопок внутри контейнера */
  flex-wrap: wrap; /* Кнопки будут переноситься на следующую строку, если не поместятся */
  justify-content: center; /* Центрируем кнопки по горизонтали */
  gap: 10px; /* Отступ между кнопками по 10px */
}

.modal-close-button,
.modal-button {
  flex: 1 1 40%; /* Кнопка занимает примерно 40% ширины контейнера с возможностью адаптации */
  padding: 5px; /* Внутренние отступы кнопки: 5px со всех сторон */
  font-size: 14px; /* Размер шрифта текста на кнопке */
  box-sizing: border-box; /* Включаем отступы и границы в общую ширину кнопки */
  margin: 4px; /* Внешние отступы кнопки: 4px со всех сторон */
}

#closeTrafficModalButton,
#closePostModalButton{
  background-color: red; /* Красный фон для кнопки "Закрыть" */
  color: white; /* Белый цвет текста на кнопке */
  width: 95%; /* Кнопка "Закрыть" занимает 95% ширины окна */
  margin: 10px auto; /* Центрируем кнопку по горизонтали с отступом 10px сверху и снизу */
  padding: 10px; /* Внутренние отступы кнопки: 10px со всех сторон */
}