/* Touch-safe modal behaviour for iPadOS and other tablet browsers. */
.modal.show {
  overflow-x: hidden !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

.modal.show,
.modal.show .modal-dialog,
.modal.show .modal-content,
.modal.show .modal-body,
.modal.show form,
.modal.show button,
.modal.show a,
.modal.show input,
.modal.show select,
.modal.show textarea {
  pointer-events: auto !important;
}

.modal.show button,
.modal.show a.btn,
.modal.show [role="button"],
.modal.show [data-dismiss="modal"] {
  position: relative;
  z-index: 1;
  touch-action: manipulation;
  -webkit-tap-highlight-color: rgba(28, 117, 188, .14);
}

@media (max-width: 1024px) {
  #openDialogSection .modal-dialog,
  #openDialogSectionEdit .modal-dialog {
    width: calc(100vw - 16px) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 16px) !important;
    min-height: 100vh;
    min-height: 100dvh;
  }

  #openDialogSection .modal-content,
  #openDialogSectionEdit .modal-content {
    min-height: 100vh;
    min-height: 100dvh;
  }

  #openDialogSection .modal-body,
  #openDialogSectionEdit .modal-body {
    overflow: visible !important;
  }
}

/* Mobile Safari can misroute taps when a full-screen backdrop filter and a
   transformed modal layer are composited together. Keep the effect on other
   browsers and use the stable non-composited path on iPadOS/iOS. */
@supports (-webkit-touch-callout: none) {
  .modal.show {
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }

  .modal-dialog-left .modal-content,
  #openDialogSection .modal-content,
  #openDialogSectionEdit .modal-content {
    animation: none !important;
    transform: none !important;
  }
}