/* DroneHQ Notifications Header Tighter v73
   CSS-only spacing cleanup for the Notifications flyout after expander removal.
   Scope: notification popover/header/date/mark-all spacing only.
*/

.notification-popover,
.shell-popover.notification-popover {
  --dhq-notif-v73-header-pad-top: 14px;
  --dhq-notif-v73-header-pad-x: 20px;
  --dhq-notif-v73-header-pad-bottom: 12px;
}

.notification-popover .notification-heading,
.shell-popover.notification-popover .notification-heading {
  min-height: 0 !important;
  padding: var(--dhq-notif-v73-header-pad-top) var(--dhq-notif-v73-header-pad-x) var(--dhq-notif-v73-header-pad-bottom) !important;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  grid-template-areas:
    "eyebrow close"
    "title close"
    "date close";
  align-items: start !important;
  column-gap: 12px !important;
  row-gap: 2px !important;
}

.notification-popover .notification-heading .eyebrow,
.notification-popover .notification-heading p.eyebrow,
.notification-popover .notification-heading [class*="eyebrow"],
.shell-popover.notification-popover .notification-heading .eyebrow,
.shell-popover.notification-popover .notification-heading p.eyebrow,
.shell-popover.notification-popover .notification-heading [class*="eyebrow"] {
  grid-area: eyebrow !important;
  margin: 0 !important;
  line-height: 1.1 !important;
}

.notification-popover .notification-heading h2,
.shell-popover.notification-popover .notification-heading h2 {
  grid-area: title !important;
  margin: 0 !important;
  line-height: 1.12 !important;
}

.notification-popover .notification-heading time,
.notification-popover .notification-heading [data-notification-date],
.notification-popover .notification-heading [data-notification-current-date],
.notification-popover .notification-heading .notification-date,
.notification-popover .notification-heading .notification-panel-date,
.shell-popover.notification-popover .notification-heading time,
.shell-popover.notification-popover .notification-heading [data-notification-date],
.shell-popover.notification-popover .notification-heading [data-notification-current-date],
.shell-popover.notification-popover .notification-heading .notification-date,
.shell-popover.notification-popover .notification-heading .notification-panel-date {
  grid-area: date !important;
  justify-self: start !important;
  align-self: start !important;
  margin: 4px 0 0 !important;
  line-height: 1.2 !important;
  text-align: left !important;
}

/* Many earlier patches inserted the date as a plain centered element.
   Keep this broad enough for the active v44 header layout but scoped to Notifications. */
.notification-popover .notification-heading > :not(h2):not(button):not(.eyebrow):not([class*="close"]):not([aria-label*="Close" i]) {
  max-height: none;
}

.notification-popover .notification-heading button[aria-label*="Close" i],
.notification-popover .notification-heading button[title*="Close" i],
.notification-popover .notification-heading .dialog-close,
.notification-popover .notification-heading .panel-close,
.notification-popover .notification-heading [data-notification-close],
.shell-popover.notification-popover .notification-heading button[aria-label*="Close" i],
.shell-popover.notification-popover .notification-heading button[title*="Close" i],
.shell-popover.notification-popover .notification-heading .dialog-close,
.shell-popover.notification-popover .notification-heading .panel-close,
.shell-popover.notification-popover .notification-heading [data-notification-close] {
  grid-area: close !important;
  align-self: center !important;
  justify-self: end !important;
  margin: 0 !important;
}

/* Pull Mark all as read directly under the compact header. */
.notification-popover [data-mark-all-notifications],
.shell-popover.notification-popover [data-mark-all-notifications] {
  margin-top: 10px !important;
  margin-bottom: 10px !important;
}

/* Reduce the empty band between the header, action, and list. */
.notification-popover .notification-list,
.shell-popover.notification-popover .notification-list {
  margin-top: 8px !important;
  padding-top: 8px !important;
}

/* If v44 added a header-layout wrapper, tighten it too without changing behavior. */
.notification-popover .notification-header-actions,
.notification-popover .notification-heading-actions,
.notification-popover .notification-panel-actions,
.shell-popover.notification-popover .notification-header-actions,
.shell-popover.notification-popover .notification-heading-actions,
.shell-popover.notification-popover .notification-panel-actions {
  margin-top: 8px !important;
  margin-bottom: 8px !important;
}