/**
 * Modales MIP — présentation centrée, agrandissement si contenu dense,
 * plafond dur 80 % de la largeur ET de la hauteur d’écran.
 * Les petites confirmations gardent leur largeur (440–520px).
 * Overlay Madha5ir (.modal plein écran) : seule la carte .modal-dialog est plafonnée.
 */
:root {
    --mip-modal-max-w: 80vw;
    --mip-modal-max-h: 80dvh;
    --mip-modal-anchor-top: max(10dvh, env(safe-area-inset-top, 0px), 12px);
    --mip-modal-pad-bottom: max(10dvh, env(safe-area-inset-bottom, 0px), 12px);
    --mip-modal-pad-inline: max(10vw, env(safe-area-inset-left, 0px), env(safe-area-inset-right, 0px), 12px);
}

/* Overlay : centré, marge 10 % → cadre utile = 80 % */
.modal-overlay,
.modal-overlay.active,
.modal-overlay.show,
.preview-overlay.active,
.drug-modal-overlay,
.mip-modal-overlay,
.mip-modal-overlay.active,
.mip-dialog-overlay,
.mip-tenant-dialog-overlay,
.iraq-widget-modal,
.cabinet-tour-modal-wrap {
    align-items: center !important;
    justify-content: center !important;
    padding-top: var(--mip-modal-anchor-top) !important;
    padding-bottom: var(--mip-modal-pad-bottom) !important;
    padding-left: var(--mip-modal-pad-inline) !important;
    padding-right: var(--mip-modal-pad-inline) !important;
    box-sizing: border-box;
    overflow: hidden !important;
}

/* Cartes : hauteur max 80 %, en-tête/pied fixes, corps défilant.
   Pas de max-width ici : ça élargirait les petites confirmations. */
.modal-overlay .modal,
.modal-overlay .modal-content,
.modal-overlay > .modal > .modal-content,
.modal .modal-dialog,
.mip-modal-card,
.mip-dialog-card,
.mip-tenant-dialog-card,
.preview-modal,
.drug-modal-overlay .glass-card,
.iraq-widget-modal__card,
.cabinet-tour-modal,
.mip-alert-dialog,
.mip-alert-dialog__card,
html.razipos-mode .modal.razipos-modal {
    box-sizing: border-box;
    max-height: var(--mip-modal-max-h) !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
}

/* Overlay Madha5ir : reste plein écran */
body.m5-kindi-app .modal {
    max-width: none !important;
    max-height: none !important;
    width: 100% !important;
    height: 100dvh !important;
    padding: 10dvh 10vw !important;
    overflow: hidden !important;
    align-items: center !important;
    justify-content: center !important;
}

body.m5-kindi-app .modal.active {
    display: flex !important;
    flex-direction: row !important;
}

body.m5-kindi-app .modal .modal-dialog {
    max-height: var(--mip-modal-max-h) !important;
}

.modal-overlay .modal:not(:has(.modal-body)):not(:has(form)),
.mip-modal-card:not(:has(.mip-modal-body)):not(:has(#mip-modal-message)) {
    overflow: auto !important;
}

/* Grand contenu : occuper jusqu’à 80 % (jamais plus) */
.modal-overlay .modal.modal-lg,
.modal-overlay .modal.modal-xl,
.modal-overlay .modal.modal-wide,
.modal-overlay .modal.modal--wide,
.modal-overlay .modal.modal-crud-wide,
.modal-overlay .modal.modal-crud-xl,
.modal-overlay .modal[data-mip-db-form],
.modal-overlay .modal[data-mip-form-action],
.modal-overlay .modal.pur-drug-picker-modal,
.modal-overlay .modal:has(.role-pages-grid),
.modal-overlay .modal:has(.pf-role-pages-grid),
.modal.modal-lg .modal-dialog,
.modal.modal-xl .modal-dialog,
.modal.modal-wide .modal-dialog,
.modal.modal--wide .modal-dialog,
.modal.modal-crud-wide .modal-dialog,
.modal.modal-crud-xl .modal-dialog,
.modal[data-mip-db-form] .modal-dialog,
.modal.pur-drug-picker-modal .modal-dialog,
.modal:has(.role-pages-grid) .modal-dialog,
.modal:has(.m5-role-pages-grid) .modal-dialog,
.mip-dialog-card--xl,
.mip-tenant-dialog-card--lg,
.mip-tenant-dialog-card--xl,
.drug-modal-overlay .glass-card,
.iraq-widget-modal__card {
    width: var(--mip-modal-max-w) !important;
    max-width: var(--mip-modal-max-w) !important;
    min-width: min(36rem, var(--mip-modal-max-w));
}

html.razipos-mode .modal.razipos-modal.modal-lg,
html.razipos-mode .modal.razipos-modal.razipos-patient-modal,
html.razipos-mode .modal.razipos-modal.razipos-rx-list-modal,
html.razipos-mode .modal.razipos-modal.razipos-customers-modal,
html.razipos-mode .modal.razipos-modal.razipos-sales-hub-modal {
    width: var(--mip-modal-max-w) !important;
    min-width: min(36rem, var(--mip-modal-max-w)) !important;
    max-width: var(--mip-modal-max-w) !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: var(--mip-modal-max-h) !important;
}

.modal-overlay .modal.active,
.modal-overlay .modal.show {
    display: flex !important;
    flex-direction: column !important;
}

.modal-header,
.modal-footer,
.mip-modal-header,
.mip-modal-footer,
.mip-dialog-header,
.mip-dialog-footer,
.preview-modal-header,
.iraq-widget-modal__header,
.pur-picker-header {
    flex-shrink: 0;
}

.modal-body,
.mip-modal-body,
.mip-modal-message,
.mip-dialog-body,
.preview-modal-body,
.iraq-widget-modal__body,
.modal .modal-dialog .modal-body,
.drug-modal-overlay .glass-card form,
.modal-overlay .modal > form {
    flex: 1 1 auto;
    min-height: 0;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}

body.m5-kindi-app #modalRolePages .modal-body {
    max-height: none !important;
    min-height: 0;
    overflow: hidden !important;
}

body.m5-kindi-app #modalRolePages .m5-role-pages-grid {
    max-height: none !important;
    flex: 1 1 auto;
    min-height: 0;
}