.modal.loading {
  width: fit-content !important;
  height: fit-content !important;
  max-width: 95%;
  border-radius: 20px 20px 20px 20px;
  overflow: hidden;
  transform: translateY(-50%) !important;
}

.modal .loadingIcon {
  width: 100px;
  height: 100px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.modal.loading.open:has(.loadingMessage) {
  height: fit-content;
  padding-bottom: var(--pad);
  display: flex !important;
  flex-direction: column;
  align-items: center !important;
}

.modal.loading.open .loadingMessage {
  max-width: 90%;
}