/* Referral Module Styles */
/* Dark Theme */
body.referral-dark {
  background-color: #121212;
  color: #e0e0e0;
}

.referral-modal {
  background: #212121;
  color: #e0e0e0;
  border-radius: 8px;
  max-width: 600px;
  width: 90%;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.5);
  animation: fadeIn 0.3s ease forwards;
}

/* Fade‑in animation */
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-10px); }
  to { opacity: 1; transform: translateY(0); }
}

/* Buttons hover effect */
.referral-btn {
  transition: background-color 0.2s ease, transform 0.1s ease;
}
.referral-btn:hover {
  background-color: #3b82f6;
  transform: translateY(-2px);
}

/* Dark mode toggle button */
#btn-toggle-dark {
  margin-left: 8px;
  background: #555;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 6px 10px;
  cursor: pointer;
  transition: background 0.2s ease;
}
#btn-toggle-dark:hover {
  background: #777;
}