/* Shared modal rhythm for Bootstrap pages in public/.
   Data-heavy dialogs keep a stable shell so async details/audit content cannot
   shrink the modal first and then grow it after data arrives. */
.modal {
  --public-modal-side-gap: 96px;
  --public-modal-mobile-gap: 32px;
  --public-modal-dialog-max: clamp(520px, 56vw, 860px);
  --public-modal-dialog-margin-y: clamp(24px, 5dvh, 64px);
  --public-modal-shell-max-height: calc(100dvh - (var(--public-modal-dialog-margin-y) * 2));
  --public-modal-shell-min-height: 0px;
  --public-modal-body-max-height: calc(var(--public-modal-shell-max-height) - 126px);
}

body .modal:not(#public-modal-layout-bypass).modal .modal-dialog {
  width: min(var(--public-modal-dialog-max), calc(100vw - var(--public-modal-side-gap))) !important;
  max-width: min(var(--public-modal-dialog-max), calc(100vw - var(--public-modal-side-gap))) !important;
  height: auto !important;
  min-height: 0 !important;
  margin: var(--public-modal-dialog-margin-y) auto !important;
}

body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-sm {
  --public-modal-dialog-max: clamp(360px, 34vw, 460px);
}

body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-lg {
  --public-modal-dialog-max: clamp(640px, 62vw, 1040px);
}

body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-xl {
  --public-modal-dialog-max: clamp(760px, 70vw, 1280px);
}

body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-xxl,
body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-fullscreen,
body .modal:not(#public-modal-layout-bypass).modal .modal-dialog[class*="modal-fullscreen"] {
  --public-modal-dialog-max: clamp(840px, 76vw, 1480px);
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="add" i],
  [id*="create" i],
  [id*="edit" i],
  [id*="form" i],
  [id*="customer" i],
  [id*="client" i],
  [id*="mijoz" i],
  [id*="partner" i],
  [id*="order" i],
  [id*="product" i]
) .modal-dialog:not(.modal-sm) {
  --public-modal-dialog-max: clamp(760px, 72vw, 1380px);
  --public-modal-shell-min-height: min(600px, var(--public-modal-shell-max-height));
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="filter" i],
  [id*="filters" i],
  [id*="filtr" i],
  .dg-filter-modal,
  .archive-filter-modal
) .modal-dialog:not(.modal-sm) {
  --public-modal-dialog-max: clamp(700px, 68vw, 1220px);
  --public-modal-shell-min-height: min(520px, var(--public-modal-shell-max-height));
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="view" i],
  [id*="detail" i],
  [id*="read" i],
  [id*="audit" i],
  [id*="history" i],
  [id*="log" i],
  [id*="map" i],
  [id*="gps" i]
) .modal-dialog:not(.modal-sm) {
  --public-modal-dialog-max: clamp(760px, 74vw, 1400px);
  --public-modal-shell-min-height: min(650px, var(--public-modal-shell-max-height));
}

body :is(#viewModal, #orderModal, #detailModal, #orderDetailModal, #txDetailModal).modal .modal-dialog:not(.modal-sm) {
  --public-modal-dialog-max: clamp(860px, 78vw, 1460px);
  --public-modal-shell-min-height: min(700px, var(--public-modal-shell-max-height));
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="confirm" i],
  [id*="delete" i],
  [id*="cancel" i],
  [id*="reject" i],
  [id*="remove" i]
) .modal-dialog {
  --public-modal-dialog-max: clamp(380px, 38vw, 560px);
  --public-modal-shell-min-height: 0px;
}

body .modal:not(#public-modal-layout-bypass).modal .modal-content,
body .modal:not(#public-modal-layout-bypass).modal .modal-dialog-scrollable .modal-content,
body .modal:not(#public-modal-layout-bypass).modal .modal-dialog[class*="modal-fullscreen"] .modal-content {
  width: auto !important;
  height: auto !important;
  min-height: var(--public-modal-shell-min-height) !important;
  max-height: var(--public-modal-shell-max-height) !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
  border-radius: 0.85rem !important;
}

body .modal:not(#public-modal-layout-bypass):not(
  [id*="confirm" i],
  [id*="delete" i],
  [id*="cancel" i],
  [id*="reject" i],
  [id*="remove" i]
).modal .modal-dialog.modal-dialog-centered:not(.modal-sm) {
  align-items: flex-start !important;
  min-height: 0 !important;
}

body .modal:not(#public-modal-layout-bypass).modal .modal-header,
body .modal:not(#public-modal-layout-bypass).modal .modal-footer {
  padding: 0.95rem 1.15rem !important;
}

body .modal:not(#public-modal-layout-bypass).modal .modal-body,
body .modal:not(#public-modal-layout-bypass).modal .modal-dialog-scrollable .modal-body {
  height: auto !important;
  min-height: 0 !important;
  max-height: var(--public-modal-body-max-height) !important;
  overflow: auto !important;
  flex: 1 1 auto !important;
  padding: 1.1rem 1.2rem !important;
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="confirm" i],
  [id*="delete" i],
  [id*="cancel" i],
  [id*="reject" i],
  [id*="remove" i]
) .modal-content {
  min-height: 0 !important;
}

body .modal:not(#public-modal-layout-bypass).modal:is(
  [id*="confirm" i],
  [id*="delete" i],
  [id*="cancel" i],
  [id*="reject" i],
  [id*="remove" i]
) .modal-body {
  flex: 0 1 auto !important;
  max-height: none !important;
  overflow: visible !important;
}

body .modal:not(#public-modal-layout-bypass).modal .row {
  --bs-gutter-x: 1rem;
  --bs-gutter-y: 1rem;
}

body .modal:not(#public-modal-layout-bypass).modal .form-control,
body .modal:not(#public-modal-layout-bypass).modal .form-select,
body .modal:not(#public-modal-layout-bypass).modal .input-group-text {
  min-height: 42px;
  font-size: 0.94rem;
}

body .modal:not(#public-modal-layout-bypass).modal .btn:not(.btn-close) {
  min-height: 42px;
  padding: 0.56rem 0.95rem;
  font-size: 0.94rem;
}

@media (max-width: 767.98px) {
  .modal {
    --public-modal-dialog-max: calc(100vw - var(--public-modal-mobile-gap));
    --public-modal-dialog-margin-y: 16px;
    --public-modal-shell-max-height: calc(100dvh - 32px);
    --public-modal-body-max-height: calc(100dvh - 150px);
  }

  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-sm,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-lg,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-xl,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-xxl,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog.modal-fullscreen,
  body .modal:not(#public-modal-layout-bypass).modal .modal-dialog[class*="modal-fullscreen"] {
    width: calc(100vw - var(--public-modal-mobile-gap)) !important;
    max-width: calc(100vw - var(--public-modal-mobile-gap)) !important;
    margin: 16px auto !important;
  }

  body .modal:not(#public-modal-layout-bypass).modal .modal-body > .row > .col-6 {
    flex: 0 0 auto;
    width: 100%;
  }

  body .modal:not(#public-modal-layout-bypass).modal .modal-body {
    padding: 0.95rem !important;
  }
}