:global .modal-backdrop {
  background-color: rgba(0, 0, 0, 0.5) !important;
}

.modal :global .modal-content {
  background-color: var(--bs-body-bg) !important;
  border-radius: 1rem !important;
  box-shadow: 0px 0px 24px rgba(0, 0, 0, 0.25) !important;
}

.modal-header {
  display: flex !important;
  justify-content: center !important;
  background-color: transparent !important;
  border: none !important;
  padding: 1.25rem 1.25rem 0 1.25rem !important;
}

.modal-title {
  font-size: 1.3rem !important;
  font-weight: 600 !important;
  color: var(--bs-body-color) !important;
}

.modal-body {
  text-align: center !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  padding: 0.25rem 1.25rem 1rem 1.25rem !important;
}

.modal-footer {
  display: flex !important;
  justify-content: center !important;
  gap: 1rem;
  background-color: transparent !important;
  padding: 1rem 1.25rem 1.25rem 1.25rem !important;
}

.modal-footer :global .btn {
  flex-grow: 1;
  min-height: 2.8rem;
  font-weight: 500;
  border-color: rgba(222, 222, 222, 1);
}