/* VECC 360 V22.2.3 — HARD FIX SCROLL NATIF iPhone */

dialog.dialog{
  width:min(760px, calc(100vw - 16px)) !important;
  height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
  max-height:none !important;
  margin:auto !important;
  padding:0 !important;
  overflow:hidden !important;
  display:flex;
  flex-direction:column;
  border:0 !important;
  border-radius:22px !important;
}

dialog.dialog:not([open]){
  display:none !important;
}

dialog.dialog[open]{
  display:flex !important;
}

dialog.dialog > form{
  width:100% !important;
  height:100% !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
  overscroll-behavior-y:contain !important;
  padding:0 16px max(18px, env(safe-area-inset-bottom)) !important;
  box-sizing:border-box !important;
}

dialog.dialog > form > .dialog-head{
  position:sticky !important;
  top:0 !important;
  z-index:20 !important;
  flex:0 0 auto !important;
  margin-left:-16px !important;
  margin-right:-16px !important;
  padding:16px !important;
  background:#fff !important;
  border-bottom:1px solid #d9e5ef !important;
}

dialog.dialog > form > .form-grid{
  flex:0 0 auto !important;
  padding-top:14px !important;
}

dialog.dialog > form > .form-actions{
  position:sticky !important;
  bottom:0 !important;
  z-index:20 !important;
  flex:0 0 auto !important;
  margin-left:-16px !important;
  margin-right:-16px !important;
  padding:14px 16px max(14px, env(safe-area-inset-bottom)) !important;
  background:#fff !important;
  border-top:1px solid #d9e5ef !important;
}

/* Modales sans <form> direct : le contenu lui-même scrolle */
dialog.dialog > .dialog-head{
  position:sticky !important;
  top:0 !important;
  z-index:20 !important;
  flex:0 0 auto !important;
  background:#fff !important;
}
dialog.dialog > pre,
dialog.dialog > .comm360-preview,
dialog.dialog > .dialog-body{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
  touch-action:pan-y !important;
}

/* Anciennes .modal non natives */
.modal.open{
  overflow-y:auto !important;
  -webkit-overflow-scrolling:touch !important;
}
.modal.open .dialog{
  max-height:calc(100dvh - 24px) !important;
}

/* Mobile */
@media(max-width:860px){
  dialog.dialog{
    width:calc(100vw - 12px) !important;
    height:calc(100dvh - 12px - env(safe-area-inset-top) - env(safe-area-inset-bottom)) !important;
    border-radius:20px !important;
  }

  dialog.dialog > form .field{
    scroll-margin-bottom:110px !important;
  }

  dialog.dialog > form > .form-actions{
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:10px !important;
  }
}

/* Courriels : actions lisibles sur téléphone */
@media(max-width:700px){
 .zoho-mail-card .zoho-mail-link{display:block!important;min-width:0}
 .zoho-mail-card .form-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%}
 .zoho-mail-card .form-actions .btn{width:100%!important;min-width:0!important;max-width:none!important;white-space:normal!important;word-break:normal!important;overflow-wrap:normal!important;padding:12px 8px!important}
}

/* V22.2.5 : une zone de défilement pour les fenêtres classiques.
   Le suivi a une description, un formulaire puis un historique frères. */
.modal > .dialog{
 display:block!important;
 overflow-y:auto!important;overflow-x:hidden!important;
 max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important;
 -webkit-overflow-scrolling:touch;touch-action:pan-y;
 overscroll-behavior-y:contain;
}
.modal > .dialog > form{
 display:block!important;height:auto!important;max-height:none!important;
 overflow:visible!important;flex:none!important;
}
.modal > .dialog .form-actions{position:static!important}
#signalEditModal .timeline-item,#signalEditModal .timeline-card{min-width:0}
#signalEditModal .timeline{overflow-wrap:break-word}
@media(max-width:860px){
 .modal > .dialog{max-height:calc(100dvh - 16px - env(safe-area-inset-top) - env(safe-area-inset-bottom))!important}
 #signalEditModal .dialog-head{display:block!important}
 #signalEditModal .dialog-head .btn{margin-top:10px}
}

#tenantNoticeOption[hidden]{display:none!important}

#landlordFollowupOption[hidden]{display:none!important}