.button-hover {
  background-color: var(--primary-color);
  color: var(--text-color);
  font-weight: bold;
  border-radius: 0.5rem !important;
  box-shadow: 0 3px 3px 0 rgba(31, 53, 86, 0.15), 0 3px 1px -2px rgba(31, 53, 86, 0.2), 0 1px 5px 0 rgba(31, 53, 86, 0.15)
}

.button-hover-white {
  background-color: white;
  color: var(--primary-color);
  font-weight: bold;
  border-radius: 0.5rem !important;
  box-shadow: 0 3px 3px 0 rgba(31, 53, 86, 0.15), 0 3px 1px -2px rgba(31, 53, 86, 0.2), 0 1px 5px 0 rgba(31, 53, 86, 0.15);
}

.button-hover:disabled, .btn.disabled, .btn:disabled{
  background-color: var(--primary-color);
  color: var(--text-color);
  opacity: 0.6 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

#navbar a {
  padding: 0.5rem;
}

#navbar a:hover {
  background-color: var(--secondary-color);
  color: var(--text-color);
  /* opacity: 0.7; */
  transition: background-color 0.3s ease;
}

.btn:hover {    
  background-color: var(--secondary-color) !important;
  color: var(--text-color) !important;
  /* opacity: 0.7; */
  transition: background-color 0.3s ease;
}

.btn:focus {
  background-color: var(--primary-color);
  color: var(--text-color);
}

.notification-bell.button-hover {
  padding: 1.2rem;
}

.notification-bell.button-hover:hover {
  background-color: var(--secondary-color);
  color: var(--text-color);
  transition: background-color 0.3s ease;
}

span.material-symbols-outlined:hover {
  color: var(--text-color) !important;
}

span.material-icons-round {
  color: var(--primary-color);
}

/* i.material-icons {
  color: var(--primary-color);
} */

span.material-icons-round:hover {
  color: var(--secondary-color);
}

.modal-header {
  background: var(--primary-color);
}

.modal-title {
  color: var(--text-color);
}