/* css/notifications.css
   Виджет и бейдж уведомлений
   Вынесено из style.css без изменения содержимого правил. */

.notifications-widget {
  background: #1f2349;
  padding: 10px 15px;
  border-radius: 30px;
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  transition: background 0.2s;
  font-size: 1.2em;
  position: relative;
}
.notifications-widget:hover { background: #2a2f5a; }
.notifications-badge {
  position: absolute;
  top: -5px;
  right: -5px;
  background: #e94560;
  color: white;
  border-radius: 50%;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.7em;
  font-weight: bold;
}
.notification-item { transition: opacity 0.3s; }
.notification-item:hover { opacity: 1 !important; }
.notifications-btn {
  background: #1f2349;
  padding: 10px;
  border-radius: 50%;
  border: none;
  cursor: pointer;
  position: relative;
  font-size: 1.2em;
  color: #e0e0e0;
  transition: background 0.2s;
}
.notifications-btn:hover { background: #2a2f5a; }
#notificationBadge {
  position: absolute;
  top: -5px; right: -5px;
  background: #e94560; color: white;
  border-radius: 50%; width: 18px; height: 18px;
  display: none; align-items: center; justify-content: center;
  font-size: 0.7em; font-weight: bold;
}
#notificationsModal { max-width: 400px; }