/* Shared mobile modal ergonomics for authenticated product screens. */
@media (max-width: 768px) {
  body.internal-page-layout .modal,
  body.internal-page-layout .modal-edit,
  body.internal-page-layout [class*="modal-overlay"] {
    box-sizing: border-box;
    padding: max(12px, env(safe-area-inset-top, 0px)) 10px max(10px, env(safe-area-inset-bottom, 0px));
  }

  body.internal-page-layout .modal-content,
  body.internal-page-layout .modal-content-edit,
  body.internal-page-layout .confirmation-modal-content,
  body.internal-page-layout [role="dialog"] {
    box-sizing: border-box;
    width: min(100%, 560px);
    max-width: 100%;
    max-height: calc(100dvh - max(24px, env(safe-area-inset-top, 0px)) - max(20px, env(safe-area-inset-bottom, 0px)));
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border-radius: 26px;
  }

  body.internal-page-layout .modal-content input,
  body.internal-page-layout .modal-content select,
  body.internal-page-layout .modal-content textarea,
  body.internal-page-layout .modal-content-edit input,
  body.internal-page-layout .modal-content-edit select,
  body.internal-page-layout .modal-content-edit textarea {
    box-sizing: border-box;
    max-width: 100%;
    font-size: 16px !important;
  }

  body.internal-page-layout .modal-content button,
  body.internal-page-layout .modal-content-edit button,
  body.internal-page-layout .confirmation-modal-content button {
    min-height: 46px;
    touch-action: manipulation;
  }
}

@media (max-width: 480px) {
  body.internal-page-layout .modal,
  body.internal-page-layout .modal-edit {
    align-items: flex-end !important;
    padding: 8px 8px max(8px, env(safe-area-inset-bottom, 0px));
  }

  body.internal-page-layout .modal-content,
  body.internal-page-layout .modal-content-edit,
  body.internal-page-layout .confirmation-modal-content {
    padding: 22px 18px calc(20px + env(safe-area-inset-bottom, 0px));
    border-radius: 28px;
  }
}