/* Shared modal layout: only the body scrolls; headings and close controls stay visible. */
.modal-content,
.modal-security-content,
.booking-confirm-dialog {
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.modal-content > *,
.modal-security-content > *,
.booking-confirm-dialog > *,
.login-dialog-content > * {
  flex-shrink: 0;
}

.modal-content > .modal-body,
.modal-security-content > .modal-security-body,
.booking-confirm-dialog > .modal-body,
.login-dialog-content > .modal-body {
  flex: 0 1 auto;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior-y: contain;
}

.modal-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1rem;
}

.modal-header > :first-child { min-width: 0; }
.modal-header > button { flex-shrink: 0; }
.modal-header > h2,
.modal-header > h3 { margin: 0; }

[data-theme="dark"] .modal-header > button {
  /* Override inline close-button colors, including the help modal. */
  color: #fff !important;
}

.modal-content {
  max-height: 90vh;
  max-height: 90dvh;
}

.modal-security-content {
  max-height: min(88vh, 860px);
  max-height: min(88dvh, 860px);
}

.booking-confirm-dialog {
  max-height: 90vh;
  max-height: 90dvh;
}

.payments-modal-content {
  max-height: min(78vh, 540px);
  max-height: min(78dvh, 540px);
}

.payments-modal-content > .payments-header { margin-bottom: 16px; }

#helpModal {
  align-items: center;
  justify-content: center;
}

#helpModal > .modal-content { box-sizing: border-box; }

@media (max-width: 640px) {
  .payments-modal-content {
    max-height: min(76vh, 520px);
    max-height: min(76dvh, 520px);
  }
}