/* v136.27 — correction agencement entêtes Notifications / Alertes */

#notification-sheet .notification-head,
#alert-sheet .notification-head {
  display:grid !important;
  grid-template-columns:minmax(80px,auto) 1fr auto !important;
  grid-template-areas:
    'close title actions'
    '. subtitle .' !important;
  align-items:start !important;
  column-gap:12px !important;
  row-gap:4px !important;
  padding-bottom:8px !important;
}

#notification-sheet #notification-close,
#alert-sheet #alert-close {
  grid-area:close !important;
  justify-self:start !important;
  align-self:start !important;
  margin:0 !important;
}

#notification-sheet .notification-head > div:first-of-type,
#alert-sheet .notification-head > div:first-of-type {
  grid-area:title / title / subtitle / subtitle !important;
  display:grid !important;
  grid-template-areas:'title' 'subtitle' !important;
  justify-items:center !important;
  align-content:start !important;
  gap:6px !important;
  min-width:0 !important;
  text-align:center !important;
}

#notification-sheet .notification-head > div:first-of-type .settings-sheet-title,
#alert-sheet .notification-head > div:first-of-type .settings-sheet-title {
  grid-area:title !important;
  margin:0 !important;
  line-height:1.05 !important;
  font-size:clamp(26px, 5vw, 40px) !important;
}

#notification-sheet .notification-head > div:first-of-type .settings-sheet-subtitle,
#alert-sheet .notification-head > div:first-of-type .settings-sheet-subtitle {
  grid-area:subtitle !important;
  margin:0 !important;
  max-width:320px !important;
  line-height:1.35 !important;
  font-size:clamp(15px, 3.1vw, 19px) !important;
  color:var(--muted, #6f7891) !important;
  text-align:center !important;
}

#notification-sheet .notification-head-actions,
#alert-sheet .notification-head-actions {
  grid-area:actions !important;
  justify-self:end !important;
  align-self:start !important;
  display:flex !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  gap:14px !important;
  margin:0 !important;
}

#notification-sheet .notification-head-actions .profile-text-button,
#alert-sheet .notification-head-actions .profile-text-button {
  white-space:nowrap !important;
  padding:0 !important;
  min-height:auto !important;
}

@media (max-width:640px) {
  #notification-sheet .notification-head,
  #alert-sheet .notification-head {
    grid-template-columns:minmax(70px,auto) 1fr auto !important;
    column-gap:10px !important;
  }

  #notification-sheet .notification-head > div:first-of-type .settings-sheet-title,
  #alert-sheet .notification-head > div:first-of-type .settings-sheet-title {
    font-size:clamp(22px, 4.8vw, 32px) !important;
  }

  #notification-sheet .notification-head > div:first-of-type .settings-sheet-subtitle,
  #alert-sheet .notification-head > div:first-of-type .settings-sheet-subtitle {
    max-width:250px !important;
    font-size:clamp(13px, 3.5vw, 17px) !important;
  }

  #notification-sheet .notification-head-actions,
  #alert-sheet .notification-head-actions {
    gap:10px !important;
  }
}