/* RF test36 fix3 — notification center root-cause rebuild.
   The settings body normally uses .stack {display:grid}. In a height-constrained dialog,
   many auto grid tracks shrink below their content and the buttons overflow across cards.
   The notification center is intentionally a non-shrinking vertical flex list. */
#settingsModal.notification-center-modal #settingsModalBody{
  display:flex!important;
  flex-direction:column!important;
  align-items:stretch!important;
  justify-content:flex-start!important;
  gap:10px!important;
  min-height:0!important;
  overflow-y:auto!important;
  overflow-x:hidden!important;
  -webkit-overflow-scrolling:touch!important;
  overscroll-behavior:contain!important;
}
#settingsModal.notification-center-modal #settingsModalBody>.notification-summary,
#settingsModal.notification-center-modal #settingsModalBody>.notification-card{
  flex:0 0 auto!important;
  align-self:stretch!important;
  width:100%!important;
  max-width:100%!important;
  box-sizing:border-box!important;
}
#settingsModal.notification-center-modal .notification-card{
  display:block!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  padding:0!important;
  overflow:hidden!important;
}
#settingsModal.notification-center-modal .notification-card-open{
  position:static!important;
  display:flex!important;
  align-items:flex-start!important;
  width:100%!important;
  height:auto!important;
  min-height:0!important;
  max-height:none!important;
  margin:0!important;
  padding:13px!important;
  gap:10px!important;
  border:0!important;
  background:transparent!important;
  color:var(--text)!important;
  text-align:left!important;
  white-space:normal!important;
  overflow:visible!important;
  box-sizing:border-box!important;
}
#settingsModal.notification-center-modal .notification-main{
  position:static!important;
  display:flex!important;
  flex:1 1 auto!important;
  flex-direction:column!important;
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  min-height:0!important;
  gap:5px!important;
  overflow:visible!important;
}
#settingsModal.notification-center-modal .notification-head{
  display:flex!important;
  flex-wrap:wrap!important;
  align-items:flex-start!important;
  justify-content:space-between!important;
  gap:6px 10px!important;
  min-width:0!important;
  height:auto!important;
}
#settingsModal.notification-center-modal .notification-title-row{
  display:flex!important;
  align-items:flex-start!important;
  min-width:0!important;
  gap:7px!important;
  line-height:1.3!important;
}
#settingsModal.notification-center-modal .notification-status{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  max-width:100%!important;
  height:auto!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  text-align:center!important;
  line-height:1.25!important;
}
#settingsModal.notification-center-modal .notification-meta,
#settingsModal.notification-center-modal .notification-services{
  display:block!important;
  position:static!important;
  min-width:0!important;
  width:auto!important;
  height:auto!important;
  white-space:normal!important;
  overflow:visible!important;
  text-overflow:clip!important;
  overflow-wrap:anywhere!important;
}
@media(max-width:560px){
  #settingsModal.notification-center-modal{
    width:calc(100vw - 12px)!important;
    max-width:calc(100vw - 12px)!important;
    height:calc(var(--app-height,100dvh) - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)))!important;
    max-height:calc(var(--app-height,100dvh) - max(12px,env(safe-area-inset-top)) - max(12px,env(safe-area-inset-bottom)))!important;
    margin:auto!important;
    overflow:hidden!important;
    border-radius:20px!important;
  }
  #settingsModal.notification-center-modal .settings-modal-shell{
    display:flex!important;
    flex-direction:column!important;
    width:100%!important;
    height:100%!important;
    min-height:0!important;
    max-height:none!important;
    overflow:hidden!important;
  }
  #settingsModal.notification-center-modal #settingsModalBody{
    padding:10px 12px calc(18px + env(safe-area-inset-bottom))!important;
  }
  #settingsModal.notification-center-modal .notification-card-open{padding:12px!important;gap:9px!important}
  #settingsModal.notification-center-modal .notification-head{flex-direction:column!important;align-items:flex-start!important;gap:5px!important}
  #settingsModal.notification-center-modal .notification-status{align-self:flex-start!important}
}
@media(max-width:350px){
  #settingsModal.notification-center-modal .notification-card-open{padding:10px!important;gap:8px!important}
  #settingsModal.notification-center-modal .notification-icon{flex-basis:30px!important;width:30px!important;height:30px!important}
}
