.spending-alert {
  position: relative;
  border: 2px solid #ef4444 !important;
  background: #3b1016 !important;
  color: #fecaca !important;
  border-radius: 17px;
  padding: 15px 16px 15px 52px !important;
  font-weight: 800;
  line-height: 1.45;
  letter-spacing: .01em;
  box-shadow: 0 0 0 1px rgba(239, 68, 68, .12), 0 8px 22px rgba(127, 29, 29, .2) !important;
}

.spending-alert::before {
  content: "!";
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  display: grid;
  place-items: center;
  width: 25px;
  height: 25px;
  border-radius: 50%;
  background: #ef4444;
  color: #fff;
  font-size: 17px;
  font-weight: 950;
  line-height: 1;
}

.spending-alert.neon-flow {
  --neon-a: #ef4444;
  --neon-b: #fb7185;
  animation: none !important;
  border-color: #dc2626 !important;
}

.light .spending-alert {
  border-color: #dc2626 !important;
  background: #fff1f2 !important;
  color: #991b1b !important;
  box-shadow: 0 0 0 1px rgba(220, 38, 38, .1), 0 8px 20px rgba(153, 27, 27, .12) !important;
}

/* Analitik dan peringatan berisi teks panjang: gunakan outline stabil agar tidak tampak berkedip. */
.analytics.neon-flow {
  animation: none !important;
  border-color: #20b9a5 !important;
  box-shadow: 0 0 0 1px rgba(32, 185, 165, .12), 0 8px 22px rgba(13, 148, 136, .11) !important;
}

.expense {
  color: #ff4d5f !important;
  font-weight: 850 !important;
}

.light .expense {
  color: #b4232f !important;
}