/* Badge circular de avisos: siempre queda por encima de las reglas antiguas. */
.lx-main-menu .notification-menu-item .notification__badge {
  position: absolute !important;
  top: -10px !important;
  right: -10px !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  border: 2px solid #111217 !important;
  border-radius: 50% !important;
  color: #261500 !important;
  background: #ffb347 !important;
  font: 800 11px/1 "Poppins", sans-serif !important;
  text-align: center !important;
  box-shadow:
    0 0 0 2px rgba(255, 179, 71, 0.2),
    0 0 12px rgba(255, 128, 24, 0.9) !important;
  z-index: 5 !important;
  transform: none !important;
}

.lx-main-menu .notification-menu-item .notification.notification-alert-active {
  border-color: #54ff9a !important;
  color: #eafff2 !important;
  background:
    radial-gradient(circle at 35% 22%, rgba(191, 255, 220, 0.26), transparent 38%),
    #071b15 !important;
  box-shadow:
    0 0 0 3px rgba(50, 255, 143, 0.22),
    0 0 18px rgba(50, 255, 143, 0.95),
    0 0 42px rgba(50, 255, 143, 0.72),
    inset 2px 2px 6px rgba(240, 255, 247, 0.16),
    inset -3px -3px 8px rgba(0, 25, 14, 0.92) !important;
  animation: notification-neon-alert 1.15s ease-in-out infinite !important;
}

.lx-main-menu .notification-menu-item .notification.notification-alert-active::before {
  color: #baffd5 !important;
  text-shadow:
    0 0 7px #39ff91,
    0 0 17px #1cff7c,
    0 0 30px rgba(49, 255, 145, 0.95) !important;
}

.lx-main-menu .notification-menu-item .notification.notification-alert-active
  .notification__badge {
  border-color: #071b15 !important;
  width: 24px !important;
  min-width: 24px !important;
  height: 24px !important;
  border-radius: 50% !important;
  color: #071b15 !important;
  background: #5affaa !important;
  box-shadow:
    0 0 0 2px rgba(90, 255, 170, 0.25),
    0 0 15px rgba(50, 255, 143, 1) !important;
}

.lx-main-menu .notification-menu-item .notification__badge:not([hidden]) {
  animation: notification-badge-pulse 1.8s ease-in-out infinite !important;
}

@keyframes notification-badge-pulse {
  0%, 100% { transform: scale(1); }
  50% { transform: scale(1.1); }
}

@keyframes notification-neon-alert {
  0%, 100% { filter: brightness(1); }
  50% { filter: brightness(1.28); }
}

@media (prefers-reduced-motion: reduce) {
  .lx-main-menu .notification-menu-item .notification.notification-alert-active {
    animation: none !important;
  }

  .lx-main-menu .notification-menu-item .notification__badge:not([hidden]) {
    animation: none !important;
  }
}
