/* V22.2.81 / build 2302 — correções exclusivamente mobile.
   Escopo: Central de Notificações, compartilhamento da lista nos detalhes e
   visibilidade do progresso do PDF dentro do dialog da Agenda. */
@media (max-width:760px){
  /* Central de Notificações: modal compacto, sem overflow horizontal. */
  #notificationsDialog.notifications-dialog{
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 20px)!important;
    margin:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  #notificationsDialog *,#shareJobDialog *{box-sizing:border-box;min-width:0}
  #notificationsDialog .notifications-card{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 20px)!important;
    padding:12px!important;
    border-radius:18px!important;
    overflow:hidden!important;
    display:grid!important;
    grid-template-rows:auto auto minmax(0,1fr)!important;
    gap:8px!important;
  }
  #notificationsDialog .dialog-head{
    min-height:40px!important;
    align-items:center!important;
    padding:0 0 7px!important;
    gap:8px!important;
    border-bottom:1px solid #30343a;
  }
  #notificationsDialog .dialog-head small{display:none!important}
  #notificationsDialog .dialog-head h3{margin:0!important;font-size:1rem!important;line-height:1.1!important}
  #notificationsDialog .dialog-head .icon-btn{width:34px!important;height:34px!important;flex:0 0 34px!important}
  #notificationsDialog .notifications-toolbar{
    width:100%!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    align-items:stretch!important;
    gap:7px!important;
    padding:0 0 8px!important;
    margin:0!important;
    border-bottom:1px solid #30343a!important;
    overflow:hidden!important;
  }
  #notificationsSummary{
    width:max-content!important;
    max-width:100%!important;
    padding:4px 8px!important;
    border-radius:999px!important;
    background:#202329!important;
    color:#d7d9de!important;
    font-size:.66rem!important;
    line-height:1.2!important;
  }
  #notificationsDialog .notification-device-health{
    width:100%!important;
    max-width:100%!important;
    flex:none!important;
    padding:8px 9px!important;
    gap:8px!important;
    border-radius:11px!important;
  }
  #notificationsDialog .notification-device-health>span{overflow:hidden!important}
  #notificationsDialog .notification-device-health strong{font-size:.7rem!important;line-height:1.2!important}
  #notificationsDialog .notification-device-health small{font-size:.62rem!important;line-height:1.28!important;overflow-wrap:anywhere!important}
  #notificationsDialog .notification-device-health[data-state="active"] small{display:none!important}
  #notificationsDialog .notification-setup-card{
    width:100%!important;
    padding:9px!important;
    gap:8px!important;
    border-radius:11px!important;
  }
  #notificationsDialog .notification-setup-card strong{font-size:.76rem!important}
  #notificationsDialog .notification-setup-card p{font-size:.65rem!important;line-height:1.3!important}
  #notificationsDialog .notification-setup-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:6px!important}
  #notificationsDialog .notification-setup-actions .btn{min-height:34px!important;padding:6px 8px!important;font-size:.66rem!important}
  #notificationsDialog .notifications-actions{
    width:100%!important;
    display:grid!important;
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
    align-items:stretch!important;
  }
  #notificationsDialog .notifications-actions .btn{
    width:100%!important;
    min-width:0!important;
    min-height:34px!important;
    padding:6px 5px!important;
    font-size:.64rem!important;
    line-height:1.15!important;
    white-space:normal!important;
    border-radius:10px!important;
  }
  #notificationsDialog #notificationsPushEnable{
    grid-column:1/-1!important;
    min-height:36px!important;
    font-size:.69rem!important;
  }
  #notificationsDialog .push-help{display:none!important}
  #notificationsDialog .notifications-list,
  #notificationsDialog .notifications-list.has-scroll{
    width:100%!important;
    min-height:0!important;
    max-height:none!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    scrollbar-gutter:auto!important;
    padding:1px!important;
    gap:6px!important;
  }
  #notificationsDialog .notification-item{
    width:100%!important;
    min-height:0!important;
    grid-template-columns:8px minmax(0,1fr)!important;
    gap:8px!important;
    padding:9px 10px!important;
    border-radius:12px!important;
  }
  #notificationsDialog .notification-dot{width:6px!important;height:6px!important;margin-top:5px!important}
  #notificationsDialog .notification-copy{gap:3px!important;overflow:hidden!important}
  #notificationsDialog .notification-copy strong{font-size:.8rem!important;line-height:1.2!important;overflow-wrap:anywhere!important}
  #notificationsDialog .notification-copy small{font-size:.7rem!important;line-height:1.34!important;overflow-wrap:anywhere!important}
  #notificationsDialog .notification-copy em{font-size:.65rem!important;line-height:1.25!important;overflow-wrap:anywhere!important}
  #notificationsDialog .notification-item time{grid-column:2!important;justify-self:start!important;padding:0!important;font-size:.61rem!important;line-height:1.1!important}

  /* Compartilhar a lista nos detalhes: diálogo completo e compacto no mobile. */
  #shareJobDialog{
    width:calc(100vw - 16px)!important;
    max-width:calc(100vw - 16px)!important;
    max-height:calc(100dvh - 20px)!important;
    margin:auto!important;
    padding:0!important;
    border:0!important;
    background:transparent!important;
    overflow:visible!important;
  }
  #shareJobDialog .share-list-dialog-card{
    width:100%!important;
    max-width:100%!important;
    max-height:calc(100dvh - 20px)!important;
    overflow-y:auto!important;
    overscroll-behavior:contain!important;
    -webkit-overflow-scrolling:touch!important;
    padding:14px!important;
    border-radius:18px!important;
  }
  #shareJobDialog .dialog-head{align-items:center!important;gap:8px!important}
  #shareJobDialog .dialog-head h3{font-size:1rem!important;line-height:1.15!important}
  #shareJobDialog .muted{font-size:.72rem!important;line-height:1.35!important;margin:6px 0 10px!important}
  #shareJobDialog label{font-size:.72rem!important}
  #shareJobDialog input,#shareJobDialog select{min-height:42px!important}
  #shareJobDialog .share-user-suggestions{max-height:31dvh!important}
  #shareJobDialog .share-list-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:7px!important}
  #shareJobDialog #shareJobSubmit{grid-column:1/-1!important}
  #shareJobDialog .share-list-actions .btn{min-height:40px!important;padding:8px!important;font-size:.72rem!important;white-space:normal!important}
  #shareJobDialog .share-invite-link-box{padding:9px!important;border-radius:11px!important}
  #shareJobDialog .share-invite-link-row{grid-template-columns:minmax(0,1fr) auto!important;gap:6px!important}
  #shareJobDialog .share-invite-link-row .btn{width:auto!important;min-height:40px!important}

  /* O dialog modal da Agenda vive no top layer. Portalamos o progresso do PDF
     para dentro dele para que a barra continue visível no iPhone/PWA. */
  #jobDetailsDialog > #processProgressOverlay{
    position:fixed!important;
    inset:auto 0 0 0!important;
    z-index:2147483646!important;
    width:100vw!important;
    max-width:100vw!important;
  }
}

@media (max-width:390px){
  #notificationsDialog .notifications-actions{grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:4px!important}
  #notificationsDialog .notifications-actions .btn{font-size:.6rem!important;padding-inline:3px!important}
  #shareJobDialog .share-invite-link-row{grid-template-columns:1fr!important}
  #shareJobDialog .share-invite-link-row .btn{width:100%!important}
}
